javascript - Chrome扩展程序onMessage的奇怪行为

我的background.js中包含以下代码：

chrome.webRequest.onHeadersReceived.addListener(function(details){
    if(isfileTypeXYZ(details))
    {
        chrome.tabs.sendMessage(details.tabId, {isFileXYZ: true});
        return { //Stop rendering of frame...
        responseHeaders: [{
          name: 'X-Content-Type-Options',
          value: 'nosniff'
        }, {
          name: 'X-Frame-Options',
          value: 'deny'
        }]
      };
    }
}, {
   urls: ['*://*/*'],
   types: ['main_frame']
}, ['blocking', 'responseHeaders']);

在我的内容脚本中，我有以下代码：

var toLoadXYZ = 0;
chrome.runtime.onMessage.addListener(function(msg, _, sendMessage){
    if(msg.isFileXYZ)
    {
        toLoadXYZ = 1;
    }
});

$(document).ready(function(){
    alert(toLoadXYZ);
});

我要做的是检测是否正在打开特定文件类型，然后从系统本身上运行的服务器加载图像并显示它。我将不得不使用xhr加载图像，但首先需要使此检测功能正常运行。我面临两个问题：


首次加载url时不会触发onMessage，而是在此之后（使用F5刷新）。
即使调试器显示onMessage被触发，alert(toLoadXYZ)中显示的值也为0而不是1（第一次加载后-在第一次加载后，我正在使用F5刷新页面）。


如果要引用，这是清单文件：

{
    "manifest_version": 2,

    "name": "my Extension",
    "version": "1.0",

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

    "permissions": [
        "webRequest",
        "<all_urls>",
        "webRequestBlocking",
        "tabs",
        "webNavigation"
    ],
    "content_scripts": [
    {
      "matches": ["<all_urls>"],
      "js": ["jquery-2.1.4.min","renderXYZ.js"]
    }
  ],
    "web_accessible_resources": [ "http:/*", "https:/*", "ftp:/*", "file:/*", "chrome-extension:/*"]
}

这个问题的原因是什么？如何解决？我搜索了很多东西，没有得到任何有用的信息，请帮助！！

更新

function findContentType(responseHeaders)
{
    for(var i = 0; i < responseHeaders.length; i++)
    {
        var header = responseHeaders[i];
        if(header.name.toLowerCase() === "content-type")
            return header.value.toLowerCase();
    }
    return "";
}

function isfileTypeXYZ(details)
{
    var contentType = findContentType(details.responseHeaders);
    if(contentType === "some-mime-type-here")
    {
        return true;
    }
    return false;
}

最佳答案

chrome.runtime.onMessage被调用，但在上一个请求的内容脚本上被调用。由于您正在刷新页面，因此tabId不会改变，因此在加载新正文之前，您将消息发送到上一页的内容脚本中，这就是为什么您看到此行为的原因。也许这样更清晰：


首次URL调用。
onHeadersReceived被呼叫
您调用chrome.tabs.sendMessage，但由于内容脚本尚未加载，因此它不会触发任何操作。
该选项卡加载请求的主体和内容脚本。准备就绪的文档将被调用。
您刷新选项卡。为此新请求调用onHeadersReceived，但是选项卡的内容仍然是先前请求的内容。在这里您可以看到警报以及toLoadXYZ为0的原因。

关于javascript - Chrome扩展程序onMessage的奇怪行为，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/32065171/