长连接和短连接

其实上面已经涉及到了,这里再单独说明一下。Chrome插件中有2种通信方式,一个是短连接(chrome.tabs.sendMessagechrome.runtime.sendMessage),一个是长连接(chrome.tabs.connectchrome.runtime.connect)。

短连接的话就是挤牙膏一样,我发送一下,你收到了再回复一下,如果对方不回复,你只能重新发,而长连接类似WebSocket会一直建立连接,双方可以随时互发消息。

短连接上面已经有代码示例了,这里只讲一下长连接。

popup.js:

  1. getCurrentTabId((tabId) => {
  2. var port = chrome.tabs.connect(tabId, {name: 'test-connect'});
  3. port.postMessage({question: '你是谁啊?'});
  4. port.onMessage.addListener(function(msg) {
  5. alert('收到消息:'+msg.answer);
  6. if(msg.answer && msg.answer.startsWith('我是'))
  7. {
  8. port.postMessage({question: '哦,原来是你啊!'});
  9. }
  10. });
  11. });

content-script.js:

  1. // 监听长连接
  2. chrome.runtime.onConnect.addListener(function(port) {
  3. console.log(port);
  4. if(port.name == 'test-connect') {
  5. port.onMessage.addListener(function(msg) {
  6. console.log('收到长连接消息:', msg);
  7. if(msg.question == '你是谁啊?') port.postMessage({answer: '我是你爸!'});
  8. });
  9. }
  10. });