Question

我有一个background.js文件，它可以拦截Web请求并替换User-Agent标头的值。根据以下清单，它工作正常。

{
  "manifest_version": 2,

  "name": "TamperHeaders",
  "description": "Replace HTTP headers and parameters",
  "version": "1.0",

  "browser_action": {
    "default_icon": "38.png"
  },

  "background": {
    "scripts": ["background.js"]
  },
  "permissions": [
    "webRequest",
    "webRequestBlocking",
    "<all_urls>"
  ]
}

我想添加一个default_popup并在弹出窗口中添加一个按钮，说＆＃34;点击我！＆＃34;，点击按钮后，扩展应该被激活（即background.js应该开始运行）。我怎样才能做到这一点？

Answer 1

Message passing允许您的扩展程序在不同的上下文之间进行通信。例如后台脚本，内容脚本和弹出窗口。

要实现您想要做的事情，您需要在单击按钮时从弹出窗口发送消息，然后在后台脚本中注册您的chrome.webRequest监听器。例如：

popup.html：

<html>
    <head>
        <script type="text/javascript" src="popup.js"></script>
    </head>
    <body>
        <button id="my-button">Click me</button>
    </body>
</html>

popup.js：

document.addEventListener('DOMContentLoaded', function() {
    var button = document.getElementById('my-button');
    button.addEventListener('click', function() {
        chrome.runtime.sendMessage({action: 'STARTLISTENER'});
        window.close(); // Closes the popup
    });
});

background.js

chrome.runtime.onMessage.addListener(
    function (request, sender, sendResponse) {
        if (request.action == 'STARTLISTENER') {
            chrome.webRequest.onBeforeRequest.addListener(function (details) {
                // web request logic
            };
        }
    }
)

除了这些更改您的manifest would need updating to include popup.html。

请注意，由于HTML中的内容安全策略you can't use <script> tags inline。因此，单独的popup.html和popup.js文件。

Answer 2

当你说

时

我想添加一个default_popup并在弹出窗口中添加一个按钮，说＆＃34;点击我！＆＃34;，然后点击按钮，扩展应该被激活

看起来你根本不需要弹出窗口。只需使用Browser action，当用户点击＆＃39;图标＆＃39;（浏览器操作）时，您的逻辑代码就会被执行。

chrome.browserAction.onClicked.addListener(function() {
    // you logic here
});

如何添加按钮以启用后台脚本？

2 个答案: