Question

我从内容脚本打开套接字连接时遇到问题。 Socket.io库作为内容脚本文件注入，并且套接字在顶部初始化：

content_script.js

let socket;

但是直到用户在扩展UI中单击打开连接才分配值：

popup.js

document.querySelector('#open-connection').addEventListener('click', () => {
   port.postMessage({
       "from": "popup",
       "openConnection": true
    });
});

background.js

if (o.from === 'popup' && o.openConnection === true) {
        chrome.tabs.executeScript(null, {

             // the first check below is executed in content_scrip.js
             // so now we should be able to use socket

            code: `
             if (typeof socket === 'undefined' || !socket) {
             socket = io('http://localhost:3003'); // connection registers fine
             }

             socket.on('joinRequest', (res) => {
             chrome.runtime.sendMessage({message: "sessionStarted"});
             })

             socket.on('error', (payload) => {
             chrome.runtime.sendMessage({message: "error", payload: payload});
             })

            `
        }, callback);
    }

此时，套接字已连接到服务器，服务器注册了一个新连接并发送回joinRequest消息，以确认已建立连接。然后，内容脚本将 sessionStarted 消息发送到popup.js（如上所示）

popup.js

chrome.runtime.onMessage.addListener(
     function(request, sender, sendResponse) {
          if (request.message === 'sessionStarted') {
              document.getElementById('disconnect-button')
              .classList
              .toggle('hidden');
      }}
...

// clicking on this button should send a message to background.js

document.querySelector('#disconnect-button').addEventListener('click', () => {
    port.postMessage({
        "from": "popup",
        "req": 'disconnect'
    });
})

background.js

if (msg.from === 'popup' && msg.req === 'disconnect') {
    chrome.tabs.executeScript(null, {
       code: `socket.emit('disconnect');`
    }, callback);
}

当我单击断开连接按钮时，这种方法可以正常工作-然后什么也没有发生，并且我收到一条错误消息，指出套接字为 undefined 。如果我执行以下检查

if (typeof socket === 'undefined' || !socket) {
   socket = io('http://localhost:3003');
}

然后单击“断开连接”按钮-这将创建另一个套接字连接，第二个连接请求断开连接，而第一个保持打开状态。

感谢对此事的任何投入，因为我已经花了两天的时间试图找出为什么在background.js的一部分中启动的套接字无法在另一部分重复使用的原因。谢谢社区！

[Chrome扩展程序-Socket.io]：用于打开连接的套接字未定义

0 个答案: