前言

最近一阵子主要是在做插件开发，作为一个基本和web网页开发一样的技术栈，插件开发还是很容易上手的，但是需要注意，在插件环境中做状态存储和数据处理的时候，往往需要通过一个叫background的东西来同步或者更新/维持数据，如果对background的运行逻辑和机制不是很熟悉，很容易就会造成致数据错乱之类的bug。我自己的一些开发经经验，希望对你有些帮助。

背景知识

chrome extension 的执行逻辑中， service作为 background的替代，属于一个会静默执行的单独线程。 不管你有没有唤醒插件，只要安装了插件，都会被默认运行。关健： 在打开插件内的tab选项卡时，会重新跑（几乎）一个一模一样的service worker。 之所以说几乎，是因为他们的全局的 globalThis 有着区别。可以看下面的分析。

根本原因

chrome.runtime.onConnect.addListener 是 background的 service worker 里的监听代码，chrome插件的特性，在插件每新打开一个tab窗口都会重新泡一个 service worker 进程，导致监听事件实现了很多次。

解决办法

在tab的servive worker 环境 和 默认的 service worker 环境中，globalThis 对象有一个区别，就是 tab 中有window属性，而在默认的 service worker 中没有这个window对象。通过这个判断可以解决重复监听的问题

参考