socket.io in django template - node.js not service socket.io.js
Problem
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 %}
{{ error }}
{% endif %}
Thank you for your reply
{% 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];
});
});
Solution
unless you are running this on a localhost
needs to be changed to
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
this way you dont have to specify IP, it will be the same as the one where original HTML page came from
Discussion
View additional discussion.