Connect to Socket.io server from a Rails server

Question

[update 1] i found out that io.connect('http://xxxxx.herokuapp.com') actually send out a request on xxxxx.herokuapp.com port 3000: the connection works if the request is WITHOUT port number. I didn't specify a port in my io.connect, How can i get rid of that?

  Request URL:http://xxxxx.herokuapp.com:3000/socket.io/1/?t=1360853265439
  Request Headersview source
  Cache-Control:max-age=0
  Origin:http://localhost:3000
  Referer:http://localhost:3000/about
  User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_2) AppleWebKit/537.17 (KHTML, like      Gecko) Chrome/24.0.1312.57 Safari/537.17
  Query String Parametersview sourceview URL encoded
  t:1360853265439

[update 2] for comparison here is the HEAD of a successful connect when i run the java script from local file system

 Request URL:http://xxxxx.herokuapp.com/socket.io/1/?t=1360854705943
 Request Method:GET
 Status Code:200 OK
 Request Headersview source
 Accept:*/*
 Accept-Charset:ISO-8859-1,utf-8;q=0.7,*;q=0.3
 Accept-Encoding:gzip,deflate,sdch
 Accept-Language:en-US,en;q=0.8
 Cache-Control:max-age=0
 Connection:keep-alive
 Host :xxxxx.herokuapp.com
 Origin:null
 User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_2) AppleWebKit/537.17 (KHTML, like      Gecko) Chrome/24.0.1312.57 Safari/537.17

[update 3] set port to 80 seems to be working

    var socket = io.connect('http://xxxxx.herokuapp.com',{port:80});

[Question] I intend to have socket.io set up on one host to talk to a Rails app on another host. It all works fine when the client side Javascript was hosted on localhost:3000 to connect to Socket.io hosted on a node.js server on localhost:5000. It works as well when both client side Javascript and Socket.io hosted on Heroku on the same port.

socket_server.js hosted on XXXX.herokuapp.com

               var app = require('http').createServer(handler)
              , io = require('socket.io').listen(app)
              , fs = require('fs')
              , i = 0


            io.configure(function () {
              io.set("origin = *");
              io.set("transports", ["xhr-polling"]);
              io.set("polling duration", 100);
            });

            var port = process.env.PORT || 5000; // Use the port that Heroku provides or default to 5000
            app.listen(port, function() {
              console.log(">>>>>>socket server up and running on port: "+port);
            });


            function handler (req, res) {
              fs.readFile(__dirname + '/socket.html',
              function (err, data) {
                if (err) {
                  res.writeHead(500);
                  return res.end('Error loading socket.html');
                }

                res.writeHead(200);
                res.end(data);
              });
            }

            io.sockets.on('connection', function (socket) {
                console.log(">>>>>>client connected through socket");
              socket.emit('news', '>>>>>>server say hello to client', i);
              console.log('>>>>>>server say hello to client' +'['+i+']')
              socket.on('my other event', function (data) {
                socket.emit('news', i);
                i++;
                console.log(data +'['+i+']');
              });
            });

if I put client side javascript in socket.html on XXXX.herokuapp.com same as socket.io it behave as expected.

                    <div id='sandbox'>sandbox</div>

        <script src="/socket.io/socket.io.js"></script>

        <script>

          var socket = io.connect('window.location.hostname');
          $('#sandbox').append('<div> lora </div>');
          socket.on('news', function (data, index) {
            $('#sandbox').append('<div>' + data + ' ' + index + '</div>');
            console.log(data);
            socket.emit('my other event', { my: 'data' });
          });
        </script>

However if I put client side Javascript on Rails server on YYYY.herokuapp.com and try to connect to Socket.io server on xxx.herokuapp.com, it doesnt work. it managed to retreive socket.io.js on the server but io.connect('http://xxxxx.herokuapp.com') doesnt not get any response from the server.

                    <div id='sandbox'>sandbox</div>

        <script src="http://xxxxx.herokuapp.com/socket.io/socket.io.js"></script>

        <script>

          var socket = io.connect('http://xxxxx.herokuapp.com');
          $('#sandbox').append('<div> lora </div>');
          socket.on('news', function (data, index) {
            $('#sandbox').append('<div>' + data + ' ' + index + '</div>');
            console.log(data);
            socket.emit('my other event', { my: 'data' });
          });
        </script>

I read a few post point the solution to set io.set("origins = *") but this seems not working in this case as well.

Answer 1

Origins are set to * by default in socket.io. And it would be io.set("origin", "*"); but as this is the default value, you can just ignore this function.

I do notice that you also have var socket = io.connect('window.location.hostname') in your client side code, you problably ment: var socket = io.connect(window.location.hostname) without the single quotes. The heroku docs do recommend the use of io.set("polling duration", 100); But you set it to 100 instead of the advised 10.Other then that I don't see anything wrong with your code and it should just work.

If these fixes don't help then I would blame it on your hosting. Heroku is a really restrictive platform when it comes to deploying real-time applications. So it could be that they are messing something up here. I would suggest trying to deploy somewhere else like on nodejitsu.com which also supports WebSockets and does not impose any limits to polling to see if it works there for you.