对扩展之前并不怎么了解，简单学过一点js，刷小视频的时候突然冒出想法想做一个扩展。一开始做就遇到了麻烦，记录一下-2024.1.28
使用的版本是v3
找了挺久文档之后获得了解决方法：
其实挺简单的，通过拿到iframe的引用，调用下面的postMessage方法对iframe发送消息
var iframe = document.getElementById('myIframe');
// 向 iframe 发送消息
iframe.contentWindow.postMessage({type:"BANNER"},'*');
然后对iframe注入一个脚本用来接收消息
window.addEventListener("message",(event) => {//代码 })
直接就完成了操作
记录一下我遇到的问题：
1.同源访问策略的限制，因为iframe并不是我自己的内容，所以也做不到修改服务器cros
一开始是想扩展中的页面直接引用iframe的dom操作，但是被限制了
后面注入脚本，希望iframe中我注入的脚本拿到父级的dom操作，但是也被限制了，怎么去配置扩展能被跨源访问不清楚
2.脚本的注入一开始也是不懂的，还有就是注入脚本只能注入顶层，页面中的iframe并没有被注入，查了官方文档：
content_scripts: [
{
matches: ['http:///', 'https:///'],
"all_frames": true,
"match_origin_as_fallback": true,
js: ['src/contentScript/index.js'],
},
需要以上配置在manifest中，matches指定注入的范围，"all_frames": true代表注入不仅限于页面的顶层，页面中的iframe也会被逐层注入；
match_orgin_as_fallback,脚本是否应在由匹配的来源创建但其网址或来源可能与模式不直接匹配的帧中注入。其中包括采用不同架构的帧，例如 about:、data:、blob: 和 filesystem(没太懂，大佬看到能帮我解惑再好不过0.0)。js:就是要注入的脚本路径。
3.在官方文档中看到
function chrome.tabs.sendMessage<any, any>(tabId: number, message: any, responseCallback: (response: any) => void): void (+3 overloads)
这个函数的概念，用于扩展与内容脚本互相通信
通过 chrome.runtime.onMessage.addListener添加监视器；
chrome.runtime.sendMessage({ type: 'COUNT', count })这个应该是对扩展发送消息；
但是这两种都是通过上一个监视器接收消息。
还有tabID需要使用
function chrome.tabs.query(queryInfo: chrome.tabs.QueryInfo, callback: (result: chrome.tabs.Tab[]) => void): void (+1 overload)
取到。当传入的第一个参数是空对象{}时可以获取全部tab，然后自己筛分，官方文档上一些例子有教怎么通过一些参数直接query到期望的tab
另外推荐一下简单的Chrome Extension框架create-chrome-ext
https://github.com/guocaoyi/create-chrome-ext
比较适合像我一样的新手，简单易用，像plasmo这个框架，弄了一下怎么都很奇怪，总在报一些看不懂的错误，只怪我确实很捞，他应该是好用的，但是不是我的新手套。