1

First a Heads Up! I am very new to the world of node.js and socket.io I have a json file which contains following data for example:-

{
"football": {

            "id": 1,
            "home": "Liverpool",
            "away": "Chelsea",
            "score": "1-0",
            "last scorer":"Gerrard"
             }
}

This file is updated live on few seconds basis.

What i really want to achieve is to parse this json and update the same to html on client side, in addition to that i want to listen for any changes in json file and update the same again to html client side. How can i achieve this, sorry if the question seemed dumb enough, but any suggestion can help.

Ashwin Sinha
  • 85
  • 2
  • 9

2 Answers2

5

i finally found something and with a little tweak and researching other answers i have finally made a working code First a brief review of what this code does watches your json file (in this case sports.json) if change detected then only reads the json file (in this case sports.json) then emits the read json file to connected clients

on the client side the magic begins as soon as you make changes to your json file

PS: There is a discussion regarding fs.watch firing twice on manual editing and saving (i will come up with a workaround soon and update here)

Server Side

var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);
var jf = require('jsonfile'); //jsonfile module
var fs = require('fs'); //require file system

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



io.sockets.on('connection', function(socket) {
fs.watch("sports.json", function(event, fileName) { //watching my        sports.json file for any changes
    //NOTE: fs.watch returns event twice on detecting change due to reason that editors fire 2 events --- there are workarounds for this on stackoverflow

    jf.readFile('sports.json', function(err, data) { //if change detected read the sports.json 

        var data = data; //store in a var
        console.log('sent') //just for debugging
        socket.volatile.emit('notification', data); //emit to all clients
    });

});

});

http.listen(3000, function() { //listen to 3000
console.log('listening on *:3000');
});

Client Side:

<!doctype html>
<html>
  <head>
    <title>Socket.IO data</title>
<body>


<p id ="data">A data will appear here on change</p>

<script src="https://cdn.socket.io/socket.io-1.2.0.js"></script>
    <script src="http://code.jquery.com/jquery-1.11.1.js"></script>
 <script>
       var socket = io.connect('http://localhost:3000'); //you can replace localhost with your public domain name too!!

    socket.on('notification', function (data) {

        $('#data').text(data.football.home); //Liverpool

    });

    </script>
</body>

sports.json File

{
"football": {

            "id": 1,
            "home": "Liverpool",
            "away": "Chelsea",
            "score": "1-0",
            "last scorer":"Gerrard"
             }
}
Ashwin Sinha
  • 85
  • 2
  • 9
  • 1
    Because you seem new to SO: if an answer helps you, even if it's not one to your own question (which I believe is relevant here, as you said you referenced other answers), it's helpful to upvote that answer so that users know that it is helpful. – Blubberguy22 Jun 23 '15 at 20:20
2

(Sorry for the little-detailed answer, I'm having computer problems and it's hard to do much; I'll edit it after they're resolved and everything stops crashing)

To look for a change in the file, try something like: Monitor file change through AJAX, how? or Check if file has changed using HTML5 File API

Server file:

var EventEmitter = require('events').EventEmitter;
var footballWatcher = new EventEmitter();

io.on('connection', function (client) {

//
//Existing Code
//

//Node.js Event listener:
footballWatcher.on('update', function(){
    io.emit('footballUpdate', footballData);
});

//Code to look for a change in the file, use this in it:
if(updated){
    footballWatcher.emit('update');        
});

Client File:

//
//Existing Code (connections, methods, emits and responses, etc.)
//

socket.on('football', function(footballJSONData){
    //JSON interpretation
});
Community
  • 1
  • 1
Blubberguy22
  • 1,344
  • 1
  • 17
  • 29
  • I'm assuming you're having trouble with the node.js and socket.io parts of this, as you said you are new to them, so I'll try to help you more with those. – Blubberguy22 Jun 19 '15 at 13:58
  • i took note of file watching idea of yours and implemented somthing i found elsewhere, thanks for your help!!! – Ashwin Sinha Jun 20 '15 at 16:03
  • No problem, I hope everything works out. Be sure to select an answer to your question if one of them solved your problem so that others don't attempt to solve an already solved problem. – Blubberguy22 Jun 22 '15 at 13:08