Node.JS, Socket IO: Same Origin Policy error

Question

I am having an hard time making server and client interact.

Here is the relevant code:

var mongodb = require('mongodb');
var fs = require('fs');
var http = require('http');
var express = require('express');
var io = require('socket.io');
var cors = require('cors');
var app = express();

app.use(function (req, res, next) {

    // Website you wish to allow to connect
    res.setHeader('Access-Control-Allow-Origin', 'http://localhost:8888');

    // Request methods you wish to allow
    res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE');

    // Request headers you wish to allow
    res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With,content-type');

    // Set to true if you need the website to include cookies in the requests sent
    // to the API (e.g. in case you use sessions)
    res.setHeader('Access-Control-Allow-Credentials', true);

    // Pass to next layer of middleware
    next();
});


app.use(express.static('./public'));

app.get('/', function(req, res) {
    res.send('/index.html')
});


var server = http.createServer(app)
io = io.listen(server); 


server.listen(8000);

The website loads the io.js script with:

<script src="http://localhost:8000/socket.io/socket.io.js"></script>

If I remove the port number I get a plain not found error and undefined io.

However, I get the following error, in Chrome:

GET http://localhost/socket.io/?EIO=3&transport=polling&t=1441274392959-0 

XMLHttpRequest cannot load http://localhost/socket.io/?EIO=3&transport=polling&t=1441274392959-0. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8000' is therefore not allowed access. The response had HTTP status code 404.

In Firefox:

GET XHR http://localhost/socket.io/ [HTTP/1.0 404 Not Found 2ms]

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://localhost/socket.io/?EIO=3&transport=polling&t=1441275119628-17. (Reason: CORS header 'Access-Control-Allow-Origin' missing).

Searching for the Cross-Origin error, I tried a couple of sulutions:

The setHeader section I used in the code,
https://stackoverflow.com/a/21622564 tried on app, server and io.

Neither of them worked, and I don't understand why.

Can someone help me sort this out? Thanks.

What does your client code look like? You're trying to connect to port `80` whereas your server is being served on port `8000`. You're also allowing CORS to `http://localhost:8888`, which makes no sense since your server is on `8000`. — Ben Fortune, Sep 03 '15 at 10:21
Sorry, where are you getting these port numbers from? I point my browser to localhost:8000 and did not specify port 8888 for cors anywhere. Shouldn't the app.use line set cors to the port being used by app? Client connects like this: var socket = io.connect("/"); — Ferduun, Sep 03 '15 at 10:49

score 0 · Answer 1 · answered Sep 03 '15 at 10:38

0

You can set the CORS header on your server like so :

var io = require('socket.io').listen( ... );
io.set("origins", "*:*");

Please note that in a production environment you should replace the wildcard with expected origins

answered Sep 03 '15 at 10:38

k1dbl4ck

176
1
7

io.set("origins", "*:*"); ^ TypeError: undefined is not a function – Ferduun Sep 03 '15 at 10:46

score 0 · Answer 2 · answered Sep 03 '15 at 11:00

0

Seems, you need change listen from socket.io to server. You add cors policy to your express listener so port must be listened by http server itself

server = require('http').Server(app);

io = require('socket.io')(server);
server = server.listen(8000)

answered Sep 03 '15 at 11:00

vmkcom

1,630
11
17

change client code, now it's connecting to `http://localhost/socket.io/`, but needs to connect `http://localhost:8000/socket.io/`. Like that: `var socket = io('http://localhost:8000/');`. And your headers must be without port `'Access-Control-Allow-Origin', 'http://localhost'` – vmkcom Sep 03 '15 at 13:47

score 0 · Accepted Answer · answered Sep 03 '15 at 12:35

0

i thinks its because your ports are different

res.setHeader('Access-Control-Allow-Origin', 'http://localhost:8888');

and

server = server.listen(8000)

answered Sep 03 '15 at 12:35

electrowiz

219
1
3

try this in your headers, just to be sure: (this would allow all calls, so remove the old one and check) res.header("Access-Control-Allow-Origin", "*"); res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept"); next(); – electrowiz Sep 03 '15 at 13:00

Node.JS, Socket IO: Same Origin Policy error

3 Answers3