Question

I’m building a tracking system in Node and need some help understanding how 3rd parties using the tracking script will connect to the Node app.

Initially I had setup a page to connect to the app using Socket.io but that solution only seems to work if the client side pages are hosted on the Node server. So for example on a 3rd party site they would have:

http://node.appserver.com:8080/tracker.js

That script would collect data from the site then connect to the app via socket.io, but I couldn’t seem to get any response back because the app was listening for a request from an index.html file with in the app itself, not from the tracker.js script.

Here is the flow that I want to run the app through:

http://www.evernote.com/shard/s7/sh/56f88de2-f1c0-470b-9169-c7aca1479037/92b00f81ff86eebd4add6f6f68053a50

The tracker.js would connect using the follow:

$.getScript('/socket.io/socket.io.js', function(data){
  var socket = io.connect('http://node.appserver.com:8080');
  socket.emit('adTracker', 
    { adServer: 'datalunk', zone : 'top_home', referingURL : 'comple.com' } 
  );
});

Then the app looks like this:

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

app.listen(8080);

io.configure(function () {
    io.set('authorization', function (handshakeData, callback) {
        if (handshakeData.xdomain) {
            callback('Cross-domain connections are not allowed');
        } else {
        callback(null, true);
        }
    });
});


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

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

io.sockets.on('connection', function (socket) {
  socket.on('adTracker', function (data) {
var adRequestData = data;
var pass = ["bigbooks"];
var databaseUrl = "username:[e-mail]:10006/node-test";
var collections = ["cmnads"]
var db = require("mongojs").connect(databaseUrl, collections);

db.cmnads.insert({adRequest : adRequestData}, {$set: {password: pass}}, function(err, updated) {
    if( err || !updated ) console.log("User not updated");
    else console.log("User updated");
    });
  });
});

Can someone give me some insight on how I should connect our network sites to the actual Node app?

Answer 1

your 3rd party client sites need to include your tracker.js (and they need to include socket.io + jQuery because of your $.getScript).

another solution would be to load socket.io from a CDN in your tracker.js (should be http://cdn.socket.io/stable/socket.io.js) and remove your jQuery-dependency: your code could then look like this (load socket.io and do your stuff when it is loaded):

(function(document, onload){

  var io = document.createElement('script');
  io.src = "//cdn.socket.io/stable/socket.io.js";
  io.setAttribute('async', 'true');
  if ( typeof onload === 'function') {
    io.onloadDone = false;
    io.onload = function() {
        io.onloadDone = true;
        onload();
    };
    io.onreadystatechange = function() {
        if ( "loaded" === io.readyState && !io.onloadDone ) {
            io.onloadDone = true;
            io.onload();
        }
    };
  }
  // head exists -> append to head, otherwise to body
  (document.getElementsByTagName('head') || document.getElementsByTagName('body'))[0].appendChild(io);

})(document, function(){
  // here socket.io should be ready
  var socket = io.connect('http://node.appserver.com:8080');
  // ...
});

put this inside your tracker.js, host it somewhere and then your clients could just include the tracker.js:

<script src="yourhost/tracker.js"></script>

but usually tracking-systems are not build using socket.io (i think socket.io is about 100k compressed, and for a tracking-solution pretty big)

usually tracking-systems are done by creating an request and sending the variables as parameters.

on the client:

var img = new Image();
img.src = "http://node.appserver.com:8080/tracking.gif?param1=value1&param2=value2";

on the server (host a gif 1×1 px and name it tracking.gif):

var http = require("http");
var url = require("url");
var trackingGif = fs.readFileSync("./tracking.gif");
http.Server(function (req, res) {
  var params = url.parse(req.url, true)).query;
  res.writeHead(200);
  res.end(trackingGif, "binary");
});

hope it helps a bit. hint: all my code is untested, but should it should be clear what i mean.