javascript - 弹出脚本复制后台脚本网络活动 - Chrome 扩展

Question

我使用 React 制作 Chrome 扩展并使用 WebPack 构建。我有 3 个输出文件，背景、内容和弹出窗口。

在我注入的内容脚本中，我有一个执行以下操作的函数：

chrome.runtime.sendMessage({action: "getDesigns", name: $}, (response) => {
    if (response.error) throw(response.error);
    this.setState({
        designs: response.data.designs,
        fetching: false,
        selectedFile: null
    })
});

在我的后台脚本中，我有一个该操作的侦听器，当触发它时，它会调用此函数

function bgGetDesigns(req, sendResponse) {
    getDesigns({
        'per_page': 100,
        'name': req.name
    })
    .then((res) => {
        sendResponse({success: true, data: res});
    })
    .catch((e) => {
        sendResponse({success: false, error: e});
    });
}

我注意到的是，如果我的弹出脚本打开，当我通过内容脚本调用 sendMessage 时，后台脚本执行网络请求（正确）但是弹出脚本也执行网络请求（错误）

这是预期的行为，还是由 webpack 构建我的包的方式引起的？

标签： javascriptreactjsgoogle-chrome-extension