Socket.io 内容安全策略：页面的设置被阻止错误

Question

我正在尝试使用 nodejs 和 express 运行 websocket 服务器。 服务器端代码是 Socket.io 文档中给出的简单代码示例。

我正在使用最新版本的 Socket.io (v4.5.4)

const app = express();

const httpServer = createServer(app);

const io = new Server(httpServer, {
  cors: {
    origin: "http://0.0.0.0:8000",
    credentials: true,
  },
  allowRequest: (req, callback) => {
    console.log("ALLOWING REQ");
    callback(null, true);
  },
  path: "/ws",
});

io.on("connection", () => {
  console.log("Connected");
});

app.listen(8000, () => {
  console.log(`server listening on http://0.0.0.0:8000`);
});

但是当我尝试通过在控制台上键入以下内容来通过浏览器连接到 websocket 时：

new WebSocket("ws://0.0.0.0:8000/ws")

我收到这个错误

Content Security Policy: The page's settings blocked the loading of a resource at ws://0.0.0.0:8000/ws (“default-src”)

如果有帮助，这也是异常消息

Exception { name: "NS_ERROR_CONTENT_BLOCKED", message: "", result: 2153644038, filename: "debugger eval code", lineNumber: 1, columnNumber: 0, data: null, stack: "@debugger eval code:1:1\n" }

谁能帮我我在这里做错了什么？

Answer 1

试试下面的代码。 它工作正常，您也可以设置允许 IP。

const app = express();

const httpServer = createServer(app);

let whitelist = ['*']
let corsOptions = {
  origin: function (origin, callback) {
    if (whitelist.indexOf(origin) !== -1 || whitelist.indexOf('*') !== -1) {
      callback(null, true)
    } else {
      callback(new Error('Not allowed by CORS'))
    }
  }
}
app.use("/", cors(corsOptions), index);

const io = require('socket.io')(httpServer, {
  cors: {
    origin: '*',
  }
});

io.on("connection", () => {
  console.log("Connected");
});

app.listen(8000, () => {
  console.log(`server listening on http://0.0.0.0:8000`);
});