10

I am performing messaging via websockets between a HTML5 client and server running on node.js. Naturally I chose JSON as the message format and as such created common javascript code, defining the various message content types and transformation operations. The javascript code is shared between both projects.

I created my web client as one git project and my server as another git project. Partly because I am using phonegap to build a webkit based client for various touch based environments. It's also a nice separation of the various logic.

To share the common code I created a separate project for the common logic and used git's subprojects to 'import' the code into the other two projects.

Now this works fine for the html5 based project, as I can just do the following to include the code:

<script src="common/js/comms.js" type="text/javascript"></script>

However with node I've had problems trying to get the code. to get the code, I've ended up doing the following:

var fs = require('fs');
eval(fs.readFileSync('./common/js/comms.js').toString());

While the approach I have taken works, I've noticed that it's starting to get very messy when I have dependencies (as in, I need x.js, y.js and x.js if I want a.js), and I have to do it for every single node.js js file that wishes to use any of these entities.

I'm also not comfortable using the eval approach. I don't have a security issue with it, though I would like to use strict mode and it's my understanding that eval and strict mode go together like oil and water.

So my question is, what is the best method to include shared js files between html projects and node.js projects? I would prefer something that follows strict.

I should note that while there are several questions that are kinda around this topic, I could not find any that address the specific issues I'm raising. I should also add that I do not wish to 'serve' the files from the 'server'. The HTML5 client is to be 'standalone'.

To clarify, what I have in the 'common js files' is something like the following:

var Comms = function (options) {
   ...
}

In HTML5 I can then just reference is via new Comms(), which is what I desire to do in node.js as well.

Improve this question
4
  • possible dup of stackoverflow.com/questions/7310176/… Commented Jan 25, 2013 at 23:45
  • Yes I would say these questions are very similar and I think it definitely answers his question. Commented Jan 25, 2013 at 23:48
  • If not you could always use grunt to concat the files. Commented Jan 25, 2013 at 23:49
  • If I use exports in a js file used by html, will I not get an error because exports is not defined? @mpm it doesn't solve my problem as it changes the js file to work with node.js, which afaict will cause it to break with the html code. Commented Jan 25, 2013 at 23:55

2 Answers 2

Reset to default
6

Have you researched how Node modules work? If you're developing using this pattern, it's fairly simple to use require('./common/js/comms') on the server while still including it on your client as well.

This article should point you in the right direction: https://caolan.org/posts/writing_for_node_and_the_browser.html

The following is the code that Tyler linked to in his comments below.

The example (example.js):

if(typeof exports == "undefined"){
    exports = this;
}

Example = function() {
    this.init();
};

Example.prototype = {
    init: function() {
         console.log('hello world');
    }
};

exports.Example = new Example();

The node.js usage of example.js (app.js):

example = require('./example');

The html usage of example.js (index.html):

<html>
    <head>
        <title></title>
    </head>
    <body>
        <script src="./example.js"></script>
    </body>

The change by the OP was to assign exports.Example to Example instead of to an new instance. Thus the node.js logic can use the following:

var Example = require('./example.js').Example;
var foo = new Example();

Thus the original question is solved.

Improve this answer
Sign up to request clarification or add additional context in comments.

7 Comments

Thanks Tyler, that helps. I updated my question to show what I'm currently doing. With the example I gave, would that then change my code in the html side to be something like new <modulename>.Comms() within the html side of things and node.js side of things? In this case the module name would almost always be the same as the entity name (as I like to seperate everything out into separate js files), so I would end up with things like new Foo.Foo() and new Bar.Bar()? If so then this seems kinda odd imho. Is there a way to get around this?
Here's a repo with a quick example: github.com/TylerLH/shared_module_example -- example.js is the module and app.js is the Node.js script that requires it. index.html just uses a simple script tag to include the module which is accessible in the global namespace. You could also wait to instantiate it if you want to pass in some options.
thanks for the quick example but it's not working for me, in that I want to be able to use var x = new Example(). I think you have pointed me in the right direction however, so thank you.
Figured it out, thanks to your response. My problem was understanding how the whole exports and the import statement in node behaves. again, thanks Tyler, it's been very helpful. Btw, I'm editing your answer to include your code. :-)
ooops. That link from Caolan McMahon went dead. New link here....
|
1

Take a look at nodeJS modules.

Would be in comm.js:

module.exports = function(/* any dependency? */){
   // things
   // you can return some object
}

In the files you need comm.js

require('./common/js/comm.js')();
// or you can assign it to a variable if it returned something

Hope that helps!

Improve this answer

5 Comments

So adding module.exports causes no problems with the js that is included in the html?
test if module is defined first , then export your module , that's the way to go
@Metalskin NodeJS runs on the server. Script inside HTML files runs on the client. You don't include server code on the client. Instead, you can send messages to the server code from the client, and interpret the results.
@talabes a common approach within programming is to reuse code. When code is common between different projects generally the approach is to write libraries. It doesn't matter if one is a client and one is a server, common code should be reused and thus shared between each project. Otherwise we create instability whereby someone forgets to update code in x when it was updated in y.
@Metalskin No need to mention DRY, you asked if module.exports causes problems in the html, and I was just responding 'yes', because module.exports comes from node (server code).

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.