Chrome扩展Popup发消息至Content Script报接收端不存在解决
已找到解决方案
本扩展面向Google Meet场景开发,问题根因为manifest.json内容脚本匹配规则配置错误:
原有错误配置:
"matches": ["*://*.meet.google.com/*"],
修正为:
"matches": ["*://meet.google.com/*"],
错误原因:原配置的通配符规则仅会匹配meet.google.com的下级子域名(如xxx.meet.google.com),但Google Meet实际访问地址为根域名meet.google.com,不满足原匹配规则,导致内容脚本完全未注入目标页面,自然不存在消息接收端。
问题描述
开发Manifest V3版本Chrome扩展时,预期逻辑为:点击popup.html内的按钮,触发contentScript.js检索当前网页中的textarea标签DOM元素。经排查popup.js中的消息发送流程无异常,但contentScript.js始终无法接收消息,控制台抛出错误:
Unchecked runtime.lastError: Could not establish connection. Receiving end does not exist.
相关代码片段
popup.js
retrieveTabId(); function retrieveTabId() { chrome.tabs.query({currentWindow: true, active: true}, function (tabs) { var activeTab = tabs[0]; console.log("tabID", activeTab.id); tabId = activeTab.id; }); } document.getElementById("btn").addEventListener('click', function (){ chrome.tabs.sendMessage(tabId, {type: "listener"}, function(response) { console.log((response.success)); }); console.log("tabID", tabId); })
contentScript.js
chrome.runtime.onMessage.addListener( function (request, sender, sendResponse) { if (request.type == 'listener') { try { let textarea = document.getElementsByTagName('textarea'); if (textarea.length == 0) { sendResponse({success: false}); } else { console.log('find node -- textarea' + textarea); sendResponse({success: true}); } } catch (e){ console.log(e); sendResponse({success: false}); } } } );
manifest.json(问题版本)
{ "name": "name", "description": "Build an Extension!", "version": "1.0", "manifest_version": 3, "permissions": ["storage", "activeTab", "scripting", "downloads", "notifications", "<all_urls>", "tabs"], "action": { "default_popup": "popup.html" }, "background": { "service_worker": "background.js" }, "content_scripts": [{ "matches": ["*://*.meet.google.com/*"], "js": ["contentScript.js"] }] }
内容的提问来源于stack exchange,提问作者Hongwei-W
相关产品推荐
相关产品推荐

