上传套接字 io 聊天应用程序时出错

Question

错误是：- 从源“https://lets-talk-frontend.vercel.app”访问“https://lets-talk-orcin.vercel.app/socket.io/?EIO=4&transport=polling&t=OwKav8O&sid=Qge6bm6DZTQlvvJBAAAA”处的 XMLHttpRequest ' 已被 CORS 策略阻止：请求的资源上不存在“Access-Control-Allow-Origin”标头。 我使用 Nodejs 和 ReactJS 创建了一个聊天应用程序。在我的本地计算机上，它工作正常，但在 vercel 上部署后，它给出了上述错误。 请帮我解决这个问题。

我与套接字io连接的服务器端代码是

app.use(
    cors({
        origin: process.env.FRONTEND_URL,
        credentials: true,
    })
)
const server = app.listen(PORT, () => {
    console.log("Listening at port no. ", PORT);
});

// Frontend url is :- https://lets-chat-frontend.vercel.app
const io = require('socket.io')(server, {
    cors: {
        origin: process.env.FRONTEND_URL,
        methods: ["GET", "POST"],
        transports: ['websocket', 'polling'],
    },
    allowEIO3: true
});

我与套接字io连接的客户端代码是

import { io } from "socket.io-client";


export const socket = io("https://lets-talk-orcin.vercel.app/", {
    autoConnect: false,
});

Answer 1

您应该首先尝试授予所有对 Socket 的域访问权限，就像

socketio.io.attach(server, {
  cors: {
    origin: "*",
    method: ["POST", "GET"],
  },
});

如果在这种情况下工作，我们可以获得确切的错误