js:浏览器插件

Posted channy14

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了js:浏览器插件相关的知识,希望对你有一定的参考价值。

1、chrome

background.js

//chrome.webRequest.onBeforeRequest.addListener(function(info) {
//    chrome.tabs.executeScript({code: ‘console.log("‘ + info.url + ‘")‘});
//    chrome.tabs.getSelected(null, function(tab) {
//        chrome.tabs.sendMessage(tab.id, info.url);
//    });
//    return;
//},{urls: ["<all_urls>"]}, ["blocking"]);

chrome.webRequest.onCompleted.addListener(function(info) {
    //chrome.tabs.executeScript({code: ‘console.log("‘ + info.url + ‘")‘});
    chrome.tabs.getSelected(null, function(tab) {
        chrome.tabs.sendMessage(tab.id, info.url);
    });
    return;
},{urls: ["<all_urls>"]});


chrome.webRequest.onErrorOccurred.addListener(function(info) {
    //chrome.tabs.executeScript({code: ‘console.log("‘ + info.url + ‘")‘});
    chrome.tabs.getSelected(null, function(tab) {
        chrome.tabs.sendMessage(tab.id, "!" + info.error + "!" + info.url);
    });
    return;
},{urls: ["<all_urls>"]});

 

content.js

console.log("content.js");

chrome.runtime.onMessage.addListener(function(msg, sender, sendResponse) {
    console.log(msg);
    document.body.text += msg + "\n";
});

 

manifest.json

{
  "name": "test",
  "version": "1.0",
  "description": "Test",
  "background": {
    "persistent": true, 
    "scripts": ["background.js"]
  },
  "content_scripts": [
    {
      "js": ["content.js"],
      "matches": ["http://*/*", "https://*/*"], 
      "run_at": "document_start"
    }
  ],
  "permissions": [
    "tabs", 
    "<all_urls>",
    "webRequest", 
    "webRequestBlocking"
  ],
  "manifest_version": 2
}

 

 

2、firefox

background.js

//browser.webRequest.onBeforeRequest.addListener(function(info) {
//    browser.tabs.executeScript({code: ‘console.log("‘ + info.url + ‘")‘});
//    return;
//},{urls: ["<all_urls>"]}, ["blocking"]);

browser.webRequest.onCompleted.addListener(function(info) {
    //chrome.tabs.executeScript({code: ‘console.log("‘ + info.url + ‘")‘});
    browser.tabs.query({currentWindow: true,active: true}).then(function (tabs){
        for (let tab of tabs) {
            browser.tabs.sendMessage(tab.id,info.url);
        }
    });
    return;
},{urls: ["<all_urls>"]});

browser.webRequest.onErrorOccurred.addListener(function(info) {
    //chrome.tabs.executeScript({code: ‘console.log("!‘ + info.url + ‘")‘});
    browser.tabs.query({currentWindow: true,active: true}).then(function (tabs){
        for (let tab of tabs) {
            browser.tabs.sendMessage(tab.id,"!" + info.error + "!" + info.url);
        }
    });
    return;
},{urls: ["<all_urls>"]});

 

content.js

//console.log("content.js");

browser.runtime.onMessage.addListener(function(msg, sender, sendResponse) {
    console.log(msg);
    document.body.text += msg + "\n";
});

 

manifest.json

{
    "manifest_version": 2,
    "name": "adtest",
    "version": "1.0",
    "description": "get urlinfo where access a website",
    "background": {
        "scripts": ["background.js"]
    },
    "content_scripts": [
        {
          "js": ["content.js"],
          "matches": ["http://*/*", "https://*/*"], 
          "run_at": "document_start"
        }
    ],
    "permissions": [
        "tabs", 
        "<all_urls>",
        "webRequest", 
        "webRequestBlocking"
    ],
    "applications": {
       "gecko": {
            "id": "[email protected]"
       }
    }
}

 

以上是关于js:浏览器插件的主要内容,如果未能解决你的问题,请参考以下文章

AJAX相关JS代码片段和部分浏览器模型

vscode代码片段生成vue模板

angularJS使用ocLazyLoad实现js延迟加载

为啥vscode中.js文件没有片段提示,但是.html文件有提示?

web代码片段

sublime text 3 添加代码片段