React页面加载时出现通信错误的排查与解决求助

错误日志 #

commons.js:2 Channel: Error in handleResponse UNK/SW_UNREACHABLE isLogsEnabled null
_handleResponsePromise @ commons.js:2
(anonymous) @ commons.js:2
Promise.catch (async)
_sendMessageToExtension @ commons.js:2
sendToExtension @ commons.js:2
168 @ commons.js:2
l @ content.js:1
(anonymous) @ content.js:1
l.O @ content.js:1
(anonymous) @ content.js:1
(anonymous) @ content.js:1
commons.js:2 Channel: Error in handleResponse UNK/SW_UNREACHABLE options getValues
_handleResponsePromise @ commons.js:2
(anonymous) @ commons.js:2
Promise.catch (async)
_sendMessageToExtension @ commons.js:2
sendToExtension @ commons.js:2
update @ commons.js:2
C @ commons.js:2
168 @ commons.js:2
l @ content.js:1
(anonymous) @ content.js:1
l.O @ content.js:1
(anonymous) @ content.js:1
(anonymous) @ content.js:1
commons.js:2 Channel: Error in handleResponse UNK/SW_UNREACHABLE options getValues
_handleResponsePromise @ commons.js:2
(anonymous) @ commons.js:2
Promise.catch (async)
_sendMessageToExtension @ commons.js:2
sendToExtension @ commons.js:2
update @ commons.js:2
ve.onUpdate.e.<computed>.O @ commons.js:2
168 @ commons.js:2
l @ content.js:1
(anonymous) @ content.js:1
l.O @ content.js:1
(anonymous) @ content.js:1
(anonymous) @ content.js:1
commons.js:2 Channel: Error in handleResponse UNK/SW_UNREACHABLE contextMenu createContextMenu
_handleResponsePromise @ commons.js:2
(anonymous) @ commons.js:2
Promise.catch (async)
_sendMessageToExtension @ commons.js:2
sendToExtension @ commons.js:2
send @ commons.js:2
setContextMenuItem @ commons.js:2
enable @ commons.js:2
Le @ commons.js:2
168 @ commons.js:2
l @ content.js:1
(anonymous) @ content.js:1
l.O @ content.js:1
(anonymous) @ content.js:1
(anonymous) @ content.js:1
commons.js:2 Channel: Error in handleResponse UNK/SW_UNREACHABLE tabClipper initCompleted
_handleResponsePromise @ commons.js:2
(anonymous) @ commons.js:2
Promise.catch (async)
_sendMessageToExtension @ commons.js:2
sendToExtension @ commons.js:2
Le @ commons.js:2
168 @ commons.js:2
l @ content.js:1
(anonymous) @ content.js:1
l.O @ content.js:1
(anonymous) @ content.js:1
(anonymous) @ content.js:1
commons.js:2 Channel: Error in handleResponse UNK/SW_UNREACHABLE options getValue
_handleResponsePromise @ commons.js:2
(anonymous) @ commons.js:2
Promise.catch (async)
_sendMessageToExtension @ commons.js:2
sendToExtension @ commons.js:2
Le @ commons.js:2
168 @ commons.js:2
l @ content.js:1
(anonymous) @ content.js:1
l.O @ content.js:1
(anonymous) @ content.js:1
(anonymous) @ content.js:1
commons.js:2 Channel: Error in handleResponse UNK/SW_UNREACHABLE options getValue
_handleResponsePromise @ commons.js:2
(anonymous) @ commons.js:2
Promise.catch (async)
_sendMessageToExtension @ commons.js:2
sendToExtension @ commons.js:2
Le @ commons.js:2
168 @ commons.js:2
l @ content.js:1
(anonymous) @ content.js:1
l.O @ content.js:1
(anonymous) @ content.js:1
(anonymous) @ content.js:1
commons.js:2 Uncaught (in promise) Error: Could not establish connection. Receiving end does not exist.
fromGeneric @ commons.js:2
fromAny @ commons.js:2
_handleResponsePromise @ commons.js:2
(anonymous) @ commons.js:2
Promise.then (async)
168 @ commons.js:2
l @ content.js:1
(anonymous) @ content.js:1
l.O @ content.js:1
(anonymous) @ content.js:1
(anonymous) @ content.js:1
commons.js:2 Uncaught (in promise) Error: Could not establish connection. Receiving end does not exist.
fromGeneric @ commons.js:2
fromAny @ commons.js:2
_handleResponsePromise @ commons.js:2
(anonymous) @ commons.js:2
Promise.then (async)
update @ commons.js:2
C @ commons.js:2
168 @ commons.js:2
l @ content.js:1
(anonymous) @ content.js:1
l.O @ content.js:1
(anonymous) @ content.js:1
(anonymous) @ content.js:1
commons.js:2 Uncaught (in promise) Error: Could not establish connection. Receiving end does not exist.
fromGeneric @ commons.js:2
fromAny @ commons.js:2
_handleResponsePromise @ commons.js:2
(anonymous) @ commons.js:2
Promise.then (async)
update @ commons.js:2
ve.onUpdate.e.<computed>.O @ commons.js:2
168 @ commons.js:2
l @ content.js:1
(anonymous) @ content.js:1
l.O @ content.js:1
(anonymous) @ content.js:1
(anonymous) @ content.js:1
commons.js:2 Uncaught (in promise) Error: Could not establish connection. Receiving end does not exist.
fromGeneric @ commons.js:2
fromAny @ commons.js:2
_handleResponsePromise @ commons.js:2
(anonymous) @ commons.js:2
Promise.catch (async)
_sendMessageToExtension @ commons.js:2
sendToExtension @ commons.js:2
send @ commons.js:2
setContextMenuItem @ commons.js:2
enable @ commons.js:2
Le @ commons.js:2
168 @ commons.js:2
l @ content.js:1
(anonymous) @ content.js:1
l.O @ content.js:1
(anonymous) @ content.js:1
(anonymous) @ content.js:1
commons.js:2 Uncaught (in promise) Error: Could not establish connection. Receiving end does not exist.
fromGeneric @ commons.js:2
fromAny @ commons.js:2
_handleResponsePromise @ commons.js:2
(anonymous) @ commons.js:2
Promise.catch (async)
_sendMessageToExtension @ commons.js:2
sendToExtension @ commons.js:2
Le @ commons.js:2
168 @ commons.js:2
l @ content.js:1
(anonymous) @ content.js:1
l.O @ content.js:1
(anonymous) @ content.js:1
(anonymous) @ content.js:1
commons.js:2 Uncaught (in promise) Error: Could not establish connection. Receiving end does not exist.
fromGeneric @ commons.js:2
fromAny @ commons.js:2
_handleResponsePromise @ commons.js:2
(anonymous) @ commons.js:2
Promise.then (async)
Le @ commons.js:2
168 @ commons.js:2
l @ content.js:1
(anonymous) @ content.js:1
l.O @ content.js:1
(anonymous) @ content.js:1
(anonymous) @ content.js:1
commons.js:2 Uncaught (in promise) Error: Could not establish connection. Receiving end does not exist.
fromGeneric @ commons.js:2
fromAny @ commons.js:2
_handleResponsePromise @ commons.js:2
(anonymous) @ commons.js:2
Promise.then (async)
Le @ commons.js:2
168 @ commons.js:2
l @ content.js:1
(anonymous) @ content.js:1
l.O @ content.js:1
(anonymous) @ content.js:1
(anonymous) @ content.js:1

错误本质 #

这些错误和你的React代码无关——你已经注释了所有自定义组件仍触发，说明问题出在浏览器扩展与页面的通信环节。日志里的sendToExtension、SW_UNREACHABLE（扩展的Service Worker不可达）、Could not establish connection. Receiving end does not exist.都指向：某个浏览器扩展的后台脚本/Service Worker无法响应页面注入脚本的请求，进而抛出错误。

排查解决步骤 #

• 关闭所有浏览器扩展，刷新页面验证错误是否消失。如果消失，逐个开启扩展，定位到触发错误的那个（从日志里的contextMenu、tabClipper关键词看，大概率是网页剪藏、右键菜单类扩展）。
• 若关闭扩展后仍有错误，打开浏览器开发者工具>Application>Service Workers，检查是否有异常注册的Service Worker，手动卸载并清空浏览器缓存，重启浏览器后测试。
• 检查项目依赖，排查是否有第三方SDK（比如埋点、监控工具）内置了和浏览器扩展通信的逻辑，临时移除最近新增的依赖，看错误是否消失。
• 切换到其他浏览器测试（比如Chrome换Firefox），如果错误不再出现，说明是当前浏览器的扩展或配置问题。
• 若以上都无效，重置浏览器到默认状态，排除浏览器配置异常导致的通信故障。

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