Error while uploading the socket io chat app

16 Views Asked by At

Error is :- Access to XMLHttpRequest at 'https://lets-talk-orcin.vercel.app/socket.io/?EIO=4&transport=polling&t=OwKav8O&sid=Qge6bm6DZTQlvvJBAAAA' from origin 'https://lets-talk-frontend.vercel.app' has been blocked by CORS policy:No 'Access-Control-Allow-Origin' header is present on the requested resource. I have created a chat app using nodejs and reactjs. On my local machine it works perfectly but after deploying on vercel it gives above error. please help me to solve this.

My server side code to connect with socket io is

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
});

My client side code to connect with socket io is

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


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

There are 1 best solutions below

2
Hiren Kalariya On

You should try Give All domain access to Socket first, Like

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

If working in this case we can get the Exact error