为什么我在点击 chrome 扩展时出现错误？

Question

I am trying to create a simple chrome extension.我正在尝试创建一个简单的 chrome 扩展。 I was able to load the extension but when I clicked the extension icon next to the address bar I get an error : Unchecked runtime.lastError: Could not establish connection. Receiving end does not exist.我能够加载扩展程序，但是当我单击地址栏旁边的扩展程序图标时，出现错误： Unchecked runtime.lastError: Could not establish connection. Receiving end does not exist. Unchecked runtime.lastError: Could not establish connection. Receiving end does not exist. Why?为什么？

My manifest.json file :我的manifest.json文件：

{
    "name" : "Test",
    "version" : "0.1",
    "permissions" : ["<all_urls>", "tabs", "activeTab"],
    "content_scripts" : [
        {
            "matches" : ["<all_urls>"],
            "js" : ["content.js"]
        }
    ],
    "background" : {
        "scripts" : ["background.js"]
    },
    "browser_action" : {
        "default_popup" : "popup.html"
    },
    "manifest_version" : 2
}

popup.html : popup.html :

<html>
    <head>
        <link rel="stylesheet" href="popup.css">
        <script src="popup.js"></script>
    </head>
    <body>
        <button>Click</button>
    </body>
</html>

popup.js弹出窗口.js

chrome.tabs.query({active : true, currentWindow : true}, (tabs)=>{
    chrome.tabs.sendMessage(tabs[0].id, {action : "button_click"}, response =>{
        console.log(response);
    })
});

content.js内容.js

chrome.runtime.onMessage.addListener((request, sender, sendResponse)=>{
    if(request.action === "button_click"){
        console.log("You clicked the button");
        sendResponse("success");
    }
})

popup.js is working fine because it is logging the response but content.js returns undefined response. popup.js工作正常，因为它正在记录响应，但content.js返回undefined响应。 background.js is still empty so I excluded it. background.js仍然是空的，所以我排除了它。 This is my first time diving into chrome APIs so I'm really confused as to why it isn't working.这是我第一次深入研究 chrome API，所以我真的很困惑为什么它不起作用。

Answer 1

Content scripts run only when a page loads for the first time in a tab so when you install or reload your extension on chrome://extensions page you also need to reload the tabs or reinject the script explicitly .内容脚本仅在页面第一次在选项卡中加载时运行，因此当您在 chrome://extensions 页面上安装或重新加载扩展时，您还需要重新加载选项卡或明确重新注入脚本。 Also, by default content scripts run after DOMContentLoaded so it may be still pending injection if the page is still loading (you can tell it to run at document_start ).此外，默认情况下，内容脚本在 DOMContentLoaded 之后运行，因此如果页面仍在加载，它可能仍处于等待注入状态（您可以告诉它在document_start 处运行）。

Note that in your use case it's possible you don't need an automatically injected content script so you can remove content_scripts section, remove <all_urls> from permissions , and switch to programmatic injection which can pass data even without messaging.请注意，在您的用例中，您可能不需要自动注入的内容脚本，因此您可以删除content_scripts部分，从permissions删除<all_urls> ，并切换到即使没有消息传递也可以传递数据的程序化注入。

为什么我在点击 chrome 扩展时出现错误？

问题描述

1 个解决方案

解决方案1
1 已采纳 2020-10-01 10:17:21

为什么我在点击 chrome 扩展时出现错误？

问题描述

1 个解决方案

解决方案1 1 已采纳 2020-10-01 10:17:21

解决方案1
1 已采纳 2020-10-01 10:17:21