javascript - 类型错误 : browser is undefined (Web Extension Messaging)

标签 javascript google-chrome-extension firefox-addon-webextensions

我正在尝试使用下面的代码将我的网页脚本与我的网络扩展的内容脚本进行通信

网页脚本

const browser = window.browser || window.chrome;
browser.runtime.sendMessage(message,
     function (response) {
          console.log(response);
     }
);

但是,我不断收到错误TypeError:浏览器未定义。如果我使用 chrome.runtime.sendMessage() 代替,情况也是如此。

我应该如何使用这个方法?

最佳答案

这里的问题是,出于安全目的,用户/网页脚本(非特权脚本)无权访问 JavaScript API,browser , chrome是 JavaScript API 的一部分,只能通过特权脚本访问,例如 Web 扩展的后台脚本和内容脚本(同样,内容脚本无法访问所有 J​​avaScript API)。基本上,如果您需要将数据从网页脚本发送到后台脚本,CustomEvent应该用于将数据发送到充当桥梁的内容脚本,并从那里使用browser.runtime.sendMessage将该数据发送到后台脚本。 。 PFB示例代码

window.onload = function(){
    document.dispatchEvent(new CustomEvent("myEvent",{
        detail:["Hello","World"]
    }));
}

内容脚本.js

document.addEventListener("myEvent", function (event) {
browser.runtime.sendMessage({
    data: event.detail
});

背景.js

browser.runtime.onMessage.addListener(function (message) {
     data = message.data;
     // do stuff
});

关于javascript - 类型错误 : browser is undefined (Web Extension Messaging),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50378133/

相关文章:

javascript - .load() 在 DOM 中的另一个 div 之前添加一个 div(不是内部)

javascript - 我可以在我的 React 组件中获取我的 Key 的值吗

google-chrome - Javascript 捐赠按钮 Paypal

javascript - 当在 document_end 填写表单时,我的脚本单击一个重新加载页面的按钮,以便它再次运行。我如何停止它运行?

javascript - 如何在 Firefox WebExtension 中查看后台脚本的 console.log 输出?

JavaScript 代码设计

javascript - 修改 input type=number 使其两边都有箭头

javascript - 用于拦截/修改 websockets UA 的 Chrome 扩展 API

javascript - 使用 downloads.download() API 将数据 URI 保存为文件

javascript - Firefox/Chrome Web 扩展 - 尝试通过内容脚本注入(inject) IFrame 时出现安全错误