Socket.io和Chrome扩展MV3

Question

我想在我的Chrome扩展中使用socket.io。 我已经设置好了express服务器，它已经完美地运行并包括以下socket.io：

const express = require("express");
const cors = require("cors");
const http = require("http");
const { Server } = require("socket.io");
const app = express();
app.use(cors());
const httpServer = http.createServer(app);
const io = new Server(httpServer, {
    cors: {
        origin: "*",
    },
});

io.on('connection', (socket) => {
    //all of our things  we are going to use in sockets, different pipelines 
    console.log("User connected: " + socket.id);

    socket.on("Alert", (data) => {
        console.log(data);
    })
});

我尝试在清单文件content_scripts js中添加socket.io，如下所示：

"content_scripts": [
     {
       "js": [
         "socket.io.4.5.1.js"
        ]
     }
]

而 content.js 文件包含以下代码：

const socket = io('ws://localhost:3001');
socket.on('connection');

在完成上述设置后，当我尝试加载 Chrome 扩展时，内容脚本中会显示错误 Uncaught ReferenceError: io is not defined。除此之外，我的 socket.io 文件中还会出现另一个错误 Uncaught SyntaxError: Unexpected token 'export'。

我尝试查看社区提出的问题，但是没有找到任何解决方法。从 wOxxOm 在这里的回答中，我认为如果需要使用 socket.io，则不能使用 MV3。如果不能使用它，那么最好的其他方法是什么，因为我需要多次与服务器通信，并且由于页面内容经常更新，不能使用 API。

- Muhammad Nouman

Answer 1

您可以在服务工作者中使用socketio，为了保持服务工作者的活动状态，您需要打开一个窗口线程，您可以使用chrome.windows.create函数来创建它，在javascript文档中查看更多信息。我们以相同的方式使用它，这种方法对我们很有效。

此外，如果socket io使用window或document，则可以使用jsdom使window和document可用。

- Manoj Verma

---

一段代码片段可以很好地支持/解释你的答案。 - Amit Sharma