Chrome扩展内容脚本无法向后台脚本发送消息并获响应求助

1. 修复未定义变量问题 #

你的background.js中直接使用了user变量但未定义，这会触发ReferenceError，导致消息处理逻辑中断，后台无法正常响应，内容脚本的回调也不会执行。

修改background.js，先初始化user变量：

console.log('background.js running');
// 先定义user变量，替换为你的实际数据
const user = { id: 1, name: "example" };

chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
    console.log('Message received: ', message);
    if (message.greeting === 'get-user-data') {
        sendResponse(user);
        return true;
    }
    return true;
});

2. 验证页面匹配规则 #

确认当前打开的页面完全匹配manifest.json中content_scripts的matches规则：https://*.myshopify.com/*。如果页面域名、协议不匹配（比如是http而非https，或者域名不是myshopify.com），内容脚本不会注入，消息自然无法发送。

3. 查看后台脚本错误日志 #

后台脚本的错误不会显示在网页控制台，需单独查看：

• 打开chrome://extensions/，找到你的扩展
• 点击「服务工作者」右侧的「检查」按钮，打开后台控制台
• 查看是否有诸如ReferenceError: user is not defined这类错误，这类错误会直接中断消息处理流程。

4. 简化代码做基础测试 #

如果上述步骤未解决，用最简代码验证通信通道是否正常：

• content.js简化为：

console.log('running this');
chrome.runtime.sendMessage({ test: 'hello' }, (response) => {
    console.log('received response:', response);
});

• background.js简化为：

console.log('background.js running');
chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
    console.log('Message received:', message);
    sendResponse({ reply: 'hi' });
    return true;
});

如果简化后能正常收发消息，说明原代码中存在业务逻辑错误（比如user变量问题）；如果仍无响应，再检查扩展的加载状态（是否启用、文件路径是否正确）。

5. 确认Manifest配置正确性 #

• 检查background.service_worker路径是否指向正确的background.js文件
• 检查content_scripts.js路径是否指向正确的content.js文件
• 确保扩展已在chrome://extensions/中启用，且没有加载报错

内容的提问来源于stack exchange，提问作者camstar915