前语：

现在咱们已经在popup.js，background.js，content-script.js中玩转了一番，但咱们仅仅将这三个文件分别进行了实践，实在的开发中，肯定是三份文件一起配合彼此协作的，因而，三个文件的彼此通讯就通信行程卡下载app显得尤为重要。

拓宽之间的通讯：

其实咱们在之前的实践中能够了解到，popup.js与background.js都是在拓宽的上下文中履行的，因而其实咱们能够将它们归为一大类。浏览器网站删除了怎么恢复而content-script.js的履行是在浏览器web页面履行的。因而咱们能够总结为，拓宽内部通讯和拓宽外部通讯。

popup.j字符间距加宽2磅怎么设置s与background.js的通讯：

关于二者的通讯，前文中其实已经有所涉及，咱们曾在popup.js中经过chrome.extension.getBackgroundPage拿到了background下的w字符串逆序输出indo测试w目标，关于background拿到popup.js通信行程卡下载app的信息，用到的办法为：

chrome.extension.getViews({type:'popup'})//要获取的视图类型。假如省掉，回来所有视图（包括后台页面和标签页）。有效值为："tab"（标签页）、"infobar"（信息栏）、"notification"（告诉）、"popup"（弹出窗口）。

background.js代码如下:

var aa = chrome.extension.getViews({type:'popup'})
//直接履行赋值操作
function getPopup(){
  //在函数中获取，并return
  var views = chrome.extension.getViews({type:'popup'})
  return views
}

popup.js代码如下:

function getPopup(){
 const bg = chrome.extension.getBackgroundPage();
 console.log('我直接拿bg的window下的aa',bg.aa)
 console.log('我在popup.js页面,经过调用background的函数办法拿到popup的值',bg.getPopup())
}
getPopup()

读者可能会好奇为何还字符是什么要在popup.js中履行ba通信技术ckground.js中的获取popup的办法(没绕过来的自字符串是什么意思己再读两遍)，不妨翻开元素检检查看你的打印内容。

关于chrome拓宽开发的实践与考虑(四)

能够发现，同样的办法，aa是空数组，而views拿到了window，这又回到了生命周期的问题，测试你的自卑程度background的生命周期在浏览器通信达翻开的时候就履行了，而此刻拓宽并没有敞开，也便是popup的window目标并未生成，天然也就拿不到了，只要敞开了popup页按钮符号面，popup.js履行办法，background中才拿到popup的测试抑郁症window目标，读者在实践开发中也应注意该问题。

tips:注意，V3版本中ge按钮开关怎么接tBackgro浏览器网站删除了怎么恢复undPage办法不再适用，笔者在尝试中发现回来了undefin测试你的自卑程度ed。彼此通讯主张运用chrome.runtime.sendMe测试抑郁症的20道题ssag测试你的自卑程度e&c字符间距怎么加宽hrome.runtime.sendMessage。笔者浏览器由于一直运用V2版本，结果今天尝试运用V3实践时遇到了许多坑点，且V2版本在2023浏览器哪个好年行将弃用，主张多看看官方文档。

popup.js与content-script的通讯：

popup是根据拓宽的js文件，content-script是注入浏览器推荐页面的js文件，二者的交流能够经过浏览器控制台和拓宽控制台明晰的看到，为了便利测试，本着好用就往按钮符号死里用，咱们再次来到百度查找页面(bushi。

popup：

chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
 console.log('收到来自content-script的音讯：');
 console.log(request, sender);//request即为收到的音讯，sender为发送源所在的页面，
 sendResponse('我是后台，我已收到你的音讯：' + JSON.stringify(request));//sendResponse为收到音讯后的回调函数
});

content-scr通信工程专业ipt:

//理论代码，运用chrome提供的api即可完结信息发送，参数[data]为代称，它能够是Object目标，也能够是数组，字符串等，本处data只做展示，读者可自行更改参数类型。笔者将data更改为数字1
 chrome.runtime.sendMessage(data , function(response) {
   console.log('收到来自后台的回复：' + response);
  });
​
​
// 实践代码，由于理论代码只提供理论，假如直接在content-script中放入理论代码，更新插件后，任意翻开页面，代码履行，但此刻拓宽并未敞开，也就无法在控制台检查音讯与给予反馈，代码确实履行了但无从监听，因而需求手动触发事情。
//'#head_wrapper .s_btn'是百度查找页面的【百度一下】按钮类名，之所以监听mouseenter而不是click是由于click之后页面会改写，看不到咱们想要的信息。
document.querySelector('#head_wrapper .s_btn').addEventListener('mouseenter',
 function(){
  chrome.runtime.sendMessage(1 , function(response) {
   console.log('收到来自后台的回复：' + response);
   });
  }
)

全部完结后，来到百度查找页面并翻开控制台，翻开拓宽并翻开拓宽控制台，安排妥当后鼠标放到【百度一下】按钮。能够看到控制台打印信息，二者完结彼此通讯。

关于chrome拓宽开发的实践与考虑(四)

content-script与background.j浏览器下载s的通讯：

这两者的通讯方式与前两者大致相同，但理论上这两个js都字符间距在哪里设置是翻开浏览器页面时主动运转，因而理论上咱们运用最简代码即可完结通讯。

content-script：

chrome.runtime.sendMessage({data:'发给background'} , function(response) {
 console.log('收到来自后台的回复：' + response);
});

back测试抑郁症的20道题ground:

chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
  console.log('收到来自content-script的音讯：');
  console.log(request, sender);
  sendResponse('我是后台，我已收到你的音讯：' + JSON.stringify(request));
  });

更新拓宽，在任意页面(除了扩展程序管通信工程理页面)翻开浏览器控制台即可看到下面的信息。

关于chrome拓宽开发的实践与考虑(四)

至此，通讯大致全部完结。