websocket socket.io sails.js sails.io.js

API request from front-end using sails.io.js

I have a basic front-end (html, css, jquery) and I'd like to use sails.io.js to communicate with an API server (developped with sails, with cors enabled). The API is running on localhost:10000 but it will be on an another domain than the one of the webclient later on.

Directly from jquery, I can issue some get request to this API and get the expected results.

When it comes to websocket, I have some problems... In the index.html (just to test), I put the following:

<script src="js/sails.io.js"></script>
<script type="text/javascript">
    io.sails.url('http://localhost:10000');
    io.socket.get('/data', function serverResponded (body, sailsResponseObject) {
      // body === sailsResponseObject.body
      console.log('Sails responded with: ', body);
      console.log('with headers: ', sailsResponseObject.headers);
      console.log('and with status code: ', sailsResponseObject.statusCode);
    });
 </script>

But Chrome's developer tools tell me

ReferenceError: io is not defined

Any idea ?

UPDATE

I'm serving index.html with a web server (python -m SimpleHTTPServer)
I've installed sails.io.js using bower.

I've try to make this test as simple as possible:

index.html

<!DOCTYPE html>
<html lang="en">
  <head>
  </head>
  <body>
    <script src="bower_components/sails.io.js/dist/sails.io.js"></script>
    <script src="index.js"></script>
  </body>
</html>

index.js:

window.onload=function(){
    io.sails.url = 'http://localhost:10000';
    io.socket.get('http://localhost:10000/data', function (body, response) {
      console.log('Sails responded with: ', body);
    });
};

My sails (0.9.16) API is only returning a json object on the GET /data route.

I have implemented a dummy __getcookie function in the api:

'get /__getcookie': function(req, res, next){
    res.json({ok: 123});
}

And commented the line 481 in interpret.js (Scott comments below).

I have also modify config/socket.js with:

 authorization: false,

=> I can now get the result from the /data route of my API :)

But... on each request I have the following error:

error: Error: No valid session available from this socket.

Solution

First of all, sails.io.js includes the code for socket.io.js, so there is no need to try and include that separately. You should remove this line:

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

Next, if you're just loading index.html from disk (rather than serving it from a web server), you'll need to tell the Sails socket client what URL to connect to:

io.sails.url = 'http://localhost:10000';

Put this anywhere before you start making socket calls; the library is smart enough to wait until its connected before trying to make the calls. So, altogether:

window.onload=function(){
    io.sails.url = 'http://localhost:10000';
    io.socket.get('http://localhost:10000/data', function (body, sailsResponseObject) {
        console.log('Sails responded with: ', body);
        console.log('with headers: ', sailsResponseObject.headers);
        console.log('and with status code: ', sailsResponseObject.statusCode);
    });
};

should work. You should be able to see in the console whether or not the socket connected by looking for the "io.socket connected successfully." message.