CODEWITHSUNDEEP
javascriptajaxnode.jsmongodbsocket.io
HjalmarCarlson
HjalmarCarlson

Reputation: 868

Connecting client side JS to server side NodeJS app

I'm a complete noob to NodeJS and i'm trying to understand the app structure. I have a basic app using Socket.IO and MongoJS, it's essentially a tracking system that pulls variables from a client side script and stores them in Mongo.

Here is how I imagined it would work:

This seems very straight forward but here is where my confusion lies. In all of the documentations and examples i've seen the the connections to socket.io have been through an HTML page that lives in the app. In my case the only client side file is a single javascript file that collects the tracking info.

Here is how I would like to connect to the server with socket.io the client side JS:

$.getScript('/socket.io/socket.io.js', function(data){
  console.log(data);
});

    var cmnPub = "Publishers.com"
    var socket = io.connect(document.location.href);
        socket.emit('adTracker', { 
            publisher: cmnPub, time : timeStamp, referingURL : document.location.href 
        });

Here is my server side code:

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

app.listen(1337);

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:[email protected]: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");
    });
  });
});

I know the code above will populate my MongoDB collection if the app is local but as soon as I try to access it from another site i'm seeing the following error:

Uncaught SyntaxError: Unexpected token - myapp.js:1 <

After further research it appears my server configuration are wrong because my app is loading the index.html page, but i'm not sure what my configurations should be. How should my server be setup if I want to load the client side JS from an external URL and then connect to my server to pass the tracking into my app??

Upvotes: 1

Views: 3069

Answers (1)

Luis Ramos
Luis Ramos

Reputation: 121

JS files are just code containers, you should think about runtimes where the code in these JS files is executed. This code you are showing is client side code that is downloaded from the server and executed on the browser. So, you are not "connecting" to socket.io in your code, you are connecting to the server.

If you connect to "document.location.href", depending on your server side code, you will just get this js file back again. You need to connect to the correct server url that will contain the server side logic, like exemplified on http://socket.io/

Please post your server side code and detailed error log for more detailed solution.

Upvotes: 2

Related Questions