CORS problem (No 'Access-Control-Allow-Origin') on client

[AlexanderTserkovniy]

Hi all,

Typically if you do have server with sockets on another domain and you do simple first line io('YOUR_HOST'), you will receive this message:
XMLHttpRequest cannot load YOUR_HOSTsocket.io/?EIO=3&transport=polling&t=1446467052356-0. No 'Access-Control-Allow-Origin'...

First appeared in head, that I need to look at documentation and find out how to set it from there, but eventually I did not find anything because of pure documentation.
Then I entered source code and the only 2 usages of setRequestHeader method, which is actually allow you to do that, is only for setting content-type if POST method is chosen.

Could you help me to fix this issue?

[LordMajestros]

You can use the

var allowedOrigins = "domain_1:* domain_2:*";
 io(server,{origins:allowedOrigins}); 

on the server you want to connect to.

[AlexanderTserkovniy]

Still does not work.

Here is my code:

// page: http://localhost:63342/rabbit/rabbit_client.html

var allowedOrigins = "http://localhost:63342";
var client = io('http://127.0.0.1:15674/stomp', {
    origins: allowedOrigins // I think it should be written like this right? Otherwise there would be syntax error
});

// console output

GET http://127.0.0.1:15674/socket.io/?EIO=3&transport=polling&t=1446541809058-0 Request.create
@ socket.io.js:2919Request @ socket.io.js:2842XHR.request @ socket.io.js:2773XHR.doPoll @ socket.io.js:2803Polling.poll @ socket.io.js:3192Polling.doOpen @ socket.io.js:3136Transport.open @ socket.io.js:2313Socket.open @ socket.io.js:1743Socket @ socket.io.js:1625Socket @ socket.io.js:1560Manager.open.Manager.connect @ socket.io.js:299Manager @ socket.io.js:157Manager @ socket.io.js:127lookup @ socket.io.js:60(anonymous function)
@ rabbit_client.html:40
rabbit_client.html:1
XMLHttpRequest cannot load http://127.0.0.1:15674/socket.io/?EIO=3&transport=polling&t=1446541809058-0.
No 'Access-Control-Allow-Origin' header is present on the requested resource.
Origin 'http://localhost:63342' is therefore not allowed access. The response had HTTP status code 404.

[LordMajestros]

This is in the browser console right?

[AlexanderTserkovniy]

Yeah, right!

[LordMajestros]

I am a bit confused by your code. The allowed origins option goes in your socket.io server not in the client i.e. in node.js code not in browser javascript that is part of a html page. Also I usually use a wildcard on the port and you can specify multiple allowed origins, just space them out like so:

//in node.js
var app = require('express')();
var io = require('socket.io');
var server = require('http').createServer(app);
var allowedOrigins = "http://localhost:* http://127.0.0.1:*";
var path ='/stomp'; // you need this if you want to connect to something other than the default socket.io path

var sio_server = io(server, {
    origins: allowedOrigins,
    path : path
});

On the client side

var clientSocket = io({path:'/stomp'});

[AlexanderTserkovniy]

So the problem is in that I do not have node.js backend, it is written on Scala and we do use some RabbitMQ and stomp protocol alongside with it, so that's why I am asking how to set the requestHeaders for the xhr, which is done first as a handshake.

In the default example of this RabbitMQ, there is used SockJS and this library sets proper Access-Control-Allow-Origin header and that's why their example does work out of the box. But this SockJS is unknown so that's why I wanted to use more famous and strong SocketIO.

And that is my question, just how to set Access-Control-Allow-Origin header from the client?

[LordMajestros]

As far as I know, access control headers aren't set from the client. They are set on the servers when they serve requests from the clients. You need to add the server that serves rabbit_client.html to the allowed origins of your scala server. Also socket.io uses it's own protocol and most likely won't work with a scala back end. It has numerous client apis (iOS, Boost C++, android, etc) but it needs a socket.io server and so far as I am aware there is only a socket.io server for node.js. You could use pure web sockets on both sides, I'm not certain but I think there is a web socket implementation for scala.
If however you have a socket.io server written in scala then you have to add the domain of the server that serves rabbit_client.html to the allowed origins of your scala server.

[AlexanderTserkovniy]

Thanks a lot for your answer, it sounds reasonable.

Yeah I see, there is not possibility to do that according to this article on Mozilla hacks, but there is such possibility as withCredentials and as I see socket.io does not have possibility to set such, right?

I mean SockJS works out of the box with the same server, but socket.io does not, and the problem seems to be this CORS for sure.

Take a look at their part of code, it looks pretty simple and I think only because of that, it works.

[LordMajestros]

The sockjs code you posted is using xhr polling.
This is similar to ajax polling.
The withCredentials flag does not set CORS on the client side. It is used to detect that if the current browser can handle cross site requests using the XMLHttpRequest object (Firefox 3.5 and in Safari 4 older versions of these browsers fail on cross site requests).
You can use ajax polling or xhr polling if that will fit your use case and if it won't put extra load on your server.

[AlexanderTserkovniy]

The sockjs uses xhr polling only for connection purposes, so just in order to make handshake. Take a look at this screen:

http://joxi.ru/0KAgwZPFedL3Al

As you can see there is only one xhr and then it is websocket connection. So I just want to achieve the same connection but only through the SocketIO.

[jjalonso]

hey mates, Im with the same problem, Im new in websockets and I have a server that is working trying to connects with free websocket clients on internet, but when I use the same URL with socket.IO I get the same error than you.

Any new @AlexanderTserkovniy ?

Thanks

[dwhieb]

Same problem here. I'd like to allow all origins access to my socket, but also allow credentials, because I'll authenticate clients using JSON web tokens. I can't specify allowed origins on the server because I won't know them in advance. Having the option to set withCredentials to false in the XHR would solve this I think.

[dwhieb]

Here's the line of code: https://github.com/socketio/socket.io-client/blob/78f61c3abcc953532ec5c30e1b8cd485b9ea3656/socket.io.js#L1430

Does Socket.IO rely on cookies or the authorization header? If not, couldn't this setting be made optional?

[felipekm]

Are some of you guys running your server @ heroku?
if yes, check this: http://stackoverflow.com/a/16484048/580325 🎯

[williampmb]

Guys,

I have tried a lot with express with no success. However, it works just fine with http.

`var server = require("http").createServer(onRequest);
var io = require("socket.io")(server);

function onRequest(req,res){
res.writeHead(200, {
'Access-Control-Allow-Origin' : '*'
});
};

io.on('connection', function(socket) {
console.log('a user connected');

socket.on('Time Ping', function(data){
	console.log("got here");
});	

});

server.listen(3002, function(){
console.log("Listening to port 3002.");
});`

[turnerhayes]

It appears that Socket.io's definition of "origin" is somewhat different from the normal one (at least the one on MDN): Socket.io doesn't seem to want the scheme to be included. See this block of code which checks the origin against the origins array. It looks for domain + ':' + port. So if you set your origins to be ['https://example.com:6789'], it won't find the origin in your array. If you set origins to ['example.com:6789'], then it should work (at least it did for me when I removed the scheme).

It seems an open question to the project authors whether this constitutes a bug.

[hasanraza-axovel]

I'm using cors extension for google chrome and socket.io for chat application on my nodejs+Angular2 app but it is giving follwing error.
XMLHttpRequest cannot load http://localhost:8000/socket.io/?username=amit&EIO=3&transport=polling&t=LsdeeNk. The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. Origin 'http://localhost:4200' is therefore not allowed access. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.

[herbherbherb]

@hasanraza-axovel Hi dude, I have similar problem, did you end up solve this?

[hasanraza-axovel]

I've added this app.use(function(req, res, next) { res.header("Access-Control-Allow-Origin", 'http://localhost:4200'); //<-- you can change this with a specific url like http://localhost:4200 res.header("Access-Control-Allow-Credentials", true); res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,OPTIONS'); res.header("Access-Control-Allow-Headers", 'Origin,X-Requested-With,Content-Type,Accept,content-type,application/json,Authorization'); next(); }); in app.js. Make sure that this will be added before the api routes.

…

On Sat, Nov 25, 2017 at 11:17 AM, Herbert Wang ***@***.***> wrote: @hasanraza-axovel <https://github.com/hasanraza-axovel> Hi dude, I have similar problem, did you end up solve this? — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#2294 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/Ace0Lu9EPmoeAIql3QfeenpEHf-D5O0Nks5s56nWgaJpZM4GaEen> .

[AlexanderTserkovniy]

Hi guys, sorry, do not work with it anymore. Cannot help :(

[hasanraza-axovel]

Can you send me you code?

…

On Fri, Dec 1, 2017 at 2:31 PM, AlexanderTserkovniy < ***@***.***> wrote: Hi guys, sorry, do not work with it anymore. Cannot help :( — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#2294 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/Ace0LlzOEGY3-d_Ks1Z0QtKZhDIN7F2Tks5s78BegaJpZM4GaEen> .

[FossPrime]

For folks using feathers with socket.io

app.configure(socketio({
  origin: '*',
  transport: ['websocket']
}, io => {}))

[darrachequesne]

@turnerhayes you are absolutely right, the protocol was not taken in account in the origin check (added in #3198)

[darrachequesne]

I'm closing this, as I think the first issue should be resolved by now. If not, do not hesitate to open another issue with all details, thanks!

origins usage:

io.origins(['https://foo.example.com:443']);

[angelxtrme]

add this to your httpd.conf file

Header set Access-Control-Allow-Origin 'origin-list'

https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS/Errors/CORSMissingAllowOrigin

it worked for me