We Keep Coding

Handling CORS in communication through web-sockets

I'm developing a client and server app, that communicate over web-sockets and found that handling CORS only on the web-socket doesn't raise any additional CORS issues, without handling CORS on the server side itself.
Before solving the issue the error on the client side was:
Access to XMLHttpRequest at 'http://localhost:5000/socket.io/?EIO=4&transport=polling&t=NOOM0wp' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
No "Access-Control-Allow-Origin" header on the response object, that appears only if I handle CORS on the server side.
But, on the client side I get an error:
GET http://localhost:5000/socket.io/?EIO=4&transport=polling&t=NOONjI6 net::ERR_CONNECTION_REFUSED
I guess this is a pretty simple issue, still an explanation will be much appreciated.

Use cors configuration.
Refer to Handling CORS.
var express = require('express')
var app = express()
var app = express()
var server = require('http').createServer(app)
var io = require('socket.io')(server, {
cors: {
origin: "*" // add your own origin, or '*' for any origins allow.
}
})

504 (Gateway Time-out) issue

I have a node/express api deployed (api.mysite.com)
In the express app, I have used app.use(cors());
In the frontend I have a nuxt/vue site (www.mysite.com).
The vue site uses the api to fetch some data. The problem is that most times it works fine. But some times (2 out of 10), I get the following error:
Failed to load resource: the server responded with a status of 504 (Gateway Time-out)
Access to XMLHttpRequest at 'api.mysite.com' from origin 'www.mysite.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
I've read a lot but cannot figure out why it's happening specially why only sometimes and not the other times?

Set the timeout to a higher value. If your request is taking more time to be served than the current timeout it throws Gateway Timeout
var server= http.createServer(app).listen(port, function()
{
console.log("Listening on port " + port)
})
server.timeout = 240000;

P5JS CORS error after making it a node app

So I have a P5JS app which has a very simple preload function:
function preload() {
json = loadJSON(getCurrentViewersUrl());
}
which calls this function and returns the request url:
function getCurrentViewersUrl() {
return "https://tmi.twitch.tv/group/user/" + STREAM_NAME + "/chatters";
}
This all worked swimingly when using http-server to start my P5JS app.
I've now just switched so that my P5JS code is served up by my node app.
const express = require('express');
var app = express();
var server = app.listen(9999);
app.use(express.static('public'));
But now, with making this change I'm now getting the cors policy error:
Access to fetch at
'https://tmi.twitch.tv/group/user/x/chatters' from origin 'http://localhost:9999' has been blocked by CORS policy: No
'Access-Control-Allow-Origin' header is present on the requested
resource. If an opaque response serves your needs, set the request's
mode to 'no-cors' to fetch the resource with CORS disabled.
My question is, why am I getting this now and not before?
This is what the request looks like:

info - unhandled socket.io url

I'm trying to use sockets to connect to a Node server I'm running localy
but I keep on getting 'info - unhandled socket.io url' on the server side
+
"XMLHttpRequest cannot load http://localhost:8080/socket.io/?EIO=3&transport=polling&t=1424356590540-0. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8000' is therefore not allowed access." on chrome (using address localhost:8000/index.html)
// top six lines of code to see setup
var express = require('express'),
app = express(),
http = require('http'),
server = http.createServer(app),
io = require('socket.io').listen(server);
server.listen(8080);
also I'm using python SimpleHTTPServer on port 8000
client code is:
var socket = io.connect('http://localhost:8080');
socket.on('connection', function(){
console.log("connected")
});
using https://cdn.socket.io/socket.io-1.3.4.js" version of sockets.io
I'm assuming the html is irrelevant since I don't have any javascript code in it (except references to angular and jquery)

That's a problem with CORS.
Since your web page is on localhost:8000 and the Socket.io server is on localhost:8080 (two different ports, so two different servers), to allow async requests between the two of them you need to enable CORS. Browsers require that for security reasons.
Your server seems to be using Express. Enabling CORS in Express is quite easy, thanks to NPM packages like cors. Alternatively, look at some questions on SO, like: How to allow CORS?

Unexpected Access-Control-Allow-Origin error

I'm following a simple tutorial from here:
http://addyosmani.github.io/backbone-fundamentals/
I have a node.js server running on a localhost port 4711
I have tomcat running on port 8082 and a backbone.js app as client started as index.html on that server.
But I get :
XMLHttpRequest cannot load ... api/books. Origin localhost:8082 is not
allowed by Access-Control-Allow-Origin.
1) Why? This is not file based access - indeed a plain web browser will see
htttp://localhost:4711/ and interact just fine.
2) What's the fix? (Given that part of this stack is a node.js server)

You're initiating a CORS request since the two servers are listening on different ports( index.html on localhost:8082 and your node server on localhost:4711)
In your node's http server, try setting the Access-Control-Allow-Origin header to * or to the Origin header.
http.createServer(function(req, res) {
res.header('Access-Control-Allow-Origin', req.headers['origin']);
//handle
});