socket.io in django template - node.js not service socket.io.js

Question

i have Django app which need to use real time push to client.
i want to use node.js and socket.io (which i understood is the easiest platform to do it today..).
to implement it i put the socket.io framework code on the template:

{% extends "base.html" %}

{% block content %}
{% if error %}
  <div id="error">
        <h3>{{ error }}</h3>
  </div>
{% endif %}
<div id="reply">

<script src="http://localhost:8889/socket.io/socket.io.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script>

        var socket = io.connect('http://localhost:8889');

        socket.on('connect', function(){
                socket.emit('addOrder', 99, {{ reply_id }});
        });

</script>
Thank you for your reply
</div>
{% endblock %}

my node.js runs on 8889 as you can see.. so i need to call "script src" to import it from localhost:8889/socket.io/socket.io.js (the Django server and the node.js server is the same server. this is why i am using localhost).

the issue is that when i calling to this template (render it from view), and using F12 on chrome, i see "CAUTION: Provisional headers are shown.".
i tried to check here what is means but i only saw talks about AdBlocks, so i uninstalled it, but i still getting this error...

after more investigation i saw that even on apache (native HTML files) i cannot get the js file (same error).

it looks like the reason is i have to use node.js http server (express) to serve this file, and cannot call it from any other web server.

Does anyone have any idea what can be the reason or how to fix it?

Node.js Server code:

var express = require("express");
var app = express();
var io = require('socket.io').listen(app.listen(8889));
app.get('/', function (req, res) {
  res.sendfile(__dirname + '/index.html');
});
app.get('/menu.css', function (req, res) {
  res.sendfile(__dirname + '/menu.css');
});
var branches = {};
ojson = {"count":1,"orders":[{"id":100,"state":"ok"}]};
io.sockets.on('connection', function (socket) {
        socket.on('connectBranch', function(branchID) {
                //save ID info on the socket
                socket.branchID = branchID
                // save the socket of the branch by ID
                branches[branchID]=socket;
                // ask the client to run getAll function with orders JSON
                branches[branchID].emit('getAll', ojson);
        });

        // clear - for test
        socket.on('clearOrders', function(branchID) {
                branches[branchID].emit('clearOrders');
        });

        // when the client emits 'addOrder', this listens and executes
        socket.on('addOrder', function(branchID, orderID){
                console.log(branches);
                branches[branchID].emit('addOrder', orderID);
        });

        // when the user disconnects.. perform this
        socket.on('disconnect', function(){
                // remove the branch from global branches list
                delete branches[socket.branchID];
        });
});

Answer 1

unless you are running this on a localhost

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

needs to be changed to

<script src="http://SERVER_IP:8889/socket.io/socket.io.js"></script>

better yet, if your frontent HTTP server is NGINX or similar, you can proxy calls to socket.io.js to port 8889, and then change your page to

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

this way you dont have to specify IP, it will be the same as the one where original HTML page came from