CODEWITHSUNDEEP
node.jsreactjswebsocketsocket.io
Amir Doreh
Amir Doreh

Reputation: 1439

Socket io v3 connection has been blocked by CORS policy

I have cors error while using Socketio v3 the app is on React backed by Nodejs

Server Side Codes:

var server = http.createServer(app);
var port = process.env.PORT || '3000'
const io = require("socket.io")(server,{
cors: {
  origin: "*:*",
  methods: ["PUT", "GET", "POST", "DELETE", "OPTIONS"],
  allowedHeaders:["secretHeader"],
  credentials: true
}
})

Client Side Connecting code:

const SOCKET_URL = "https://fakeurl.org";
socket.current = io(`${SOCKET_URL}`,{
      secretHeader:{
        "Access-Control-Allow-Headers": "*"
      }
    });

And i got the following error:

Access to XMLHttpRequest at 'https://fakeurl.org/socket.io/?EIO=4&transport=polling&t=NOdqBkN' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Upvotes: 2

Views: 2075

Answers (1)

wangdev87
wangdev87

Reputation: 8751

Refer to Socket.io Handling CORS.

// server-side
const io = require("socket.io")(server,{
cors: {
  origin: "*",
  methods: ["PUT", "GET", "POST", "DELETE", "OPTIONS"],
  allowedHeaders:["secretHeader"],
  credentials: true
}
})

// client-side
const SOCKET_URL = "https://fakeurl.org";
socket.current = io(`${SOCKET_URL}`,{
      withCredentials: true,
      extraHeaders: {
          "secretHeader": "secret value"
      }
    });

Upvotes: 1

Related Questions