时间戳

首页 > 解决方案 > tabs.executeScript 在访问 Content Script 中定义的函数时遇到 ReferenceError

javascript - tabs.executeScript 在访问 Content Script 中定义的函数时遇到 ReferenceError

问题描述

更新：似乎问题来自于 Webpack 在其自己的函数中执行每个模块的事实，这意味着全局范围内不能存在任何模块。有什么优雅的方法可以解决这个问题，以便我可以在 Webpacked 内容脚本中定义一个函数并从不同的内容脚本访问它？

原文：

在我的主要内容脚本中，我定义了一个函数

function foo() {
    console.log("foo")
}

在我的background.js中，我注入了一个新的内容脚本，如下所示：

browser.tabs.query({currentWindow: true, active: true}).then(res => {
    browser.tabs.executeScript(res.id, {code: "foo()"})
})

在我的标签控制台中，我看到

VM181:1 Uncaught ReferenceError: foo is not defined
at <anonymous>:1:1

两个内容脚本应该在同一个执行环境中，所以我应该能够在两个脚本中共享函数和变量。

我最近添加了 Webpack 来构建我的 Chrome 扩展程序，并且我正在使用Webextension-Polyfill将chrome.*API 承诺为browser.

在我的代码的旧版本中，这工作得很好，但现在它不工作了。我有一种感觉，这是因为 Webextension-Polyfill，但老实说，我无法弄清楚。

编辑：

executeScript代码正在选项卡中运行。我可以console.log，它出现在控制台中。但是，它似乎无法访问我现有内容脚本的命名空间。

编辑 2：

我添加了另一个内容脚本

function foo() {
    console.log("foo")
}

它可以从注入的脚本中访问。所以我想这与Webpack有关。

它与 Webpack 包中的范围有关吗？

标签： javascriptgoogle-chrome-extensionwebextension-polyfill

解决方案

推荐阅读