Question

我做了一点扩展来阻止网站上的图像，我可以通过弹出窗口打开和关闭。除了检查它是否应该阻止图像的部分外，我得到了所有工作。这就是我现在所得到的：

的manifest.json

{
    "manifest_version": 2,

    "name": "Name",
    "description": "Description",
    "version": "1.0",
    "icons": {  "256": "256icon.png",
                "128": "128icon.png",
                "64": "64icon.png",
                "48": "48icon.png",
                "32": "32icon.png",
                "16": "16icon.png" },

    "browser_action": {
       "default_title": "Name",
       "default_popup": "popup.html"
    },

    "background": {
        "scripts": [
            "background.js"
        ],
        "persistent": true
    },

    "permissions": [
        "webRequest",
        "webRequestBlocking",
        "activeTab",
        "tabs",
        "webNavigation",
        "management",
        "http://*/*",
        "https://*/*",
        "*://static2.gamekit.com/upload/*" 
    ]
}

popup.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title></title>
    <link rel="stylesheet" href="popup.css">
</head>

<body>
    <script src="popup.js"></script>
    <div class="PopUp" id="PopUp">
        <div class="onoffswitch">
            <input type="checkbox" name="onoffswitch" class="onoffswitch-checkbox" id="myonoffswitch">
            <label class="onoffswitch-label" for="myonoffswitch">
                <span class="onoffswitch-inner"></span>
                <span class="onoffswitch-switch"></span>
            </label>
        </div>
    </div>
</body>
</html>

popup.js

document.addEventListener('DOMContentLoaded', function () {
    'use strict';
    var bg = chrome.extension.getBackgroundPage();
    document.getElementById("myonoffswitch").checked = bg.onoffstate;
}); //gets checkbox state from background.js and applies it

function updatecheck() { //onclick function of the checkbox
    'use strict';
//puts checkbox state in var (checkstate)
    var checkstate = document.getElementById("myonoffswitch").checked;
//sends checkbox state to background.js
    chrome.runtime.sendMessage({onoffstate: checkstate}, function (response) {
        console.log(response.bg_onoffstate); //response from background.js
    });
}

document.addEventListener('DOMContentLoaded', function () {
    'use strict';
    document.getElementById('myonoffswitch').addEventListener('click', updatecheck);
}); //adds onclick event to checkbox

background.js

var onoffstate;

chrome.runtime.onMessage.addListener(
    function (request, sender, sendResponse) {
        'use strict';
        onoffstate = request.onoffstate; //puts checkbox state from popup.js into var
        sendResponse({bg_onoffstate: onoffstate}); //debug response
    }
);


if (onoffstate === true) { //check if checkbox is checked
    chrome.webRequest.onBeforeRequest.addListener(
        function (details) {
            'use strict';
            return {cancel: true};
        },
        {urls: ["*://static2.gamekit.com/upload/*"]},
        ["blocking"] //blocks images
    );
}

（抱歉凌乱的代码）

加载popup.html时，它会从background.js中提取已保存的状态（true / false）并将其应用于复选框。当检查popup.html中的（un）复选框时，它将其状态发送到background.js。然后，background.js中保存的状态决定了图像是否应该被阻止。这是它无法正常工作的地方。阻止图像本身的代码本身就能完美运行。但当我把它放在if函数内时，它不会触发。我尝试将其他内容放入其中，看它是否会执行它但它没有。

我在看某个地方是否有错字，但没找到任何东西。 JSLint也没有显示任何内容。

我希望有人能找出错误。

链接到文件以便于访问：Here

Answer 1

不要在onMessage事件处理程序中添加if条件（如评论中所述）。这将多次绑定onBeforeRequest事件处理程序。

解决方案：删除您的条件，然后只返回onBeforeRequest处理程序中的状态。

chrome.webRequest.onBeforeRequest.addListener(
    function (details) {
        'use strict';
          return {cancel: onoffstate};
    },
    {urls: ["*://cdn.sstatic.net/Sites/*"]},
    ["blocking"] //blocks images
);

如果background.js中的条件不起作用

1 个答案: