I'm trying to serve a HTML page with raphael.js script inside using node.js.
My index.html file is:
<!DOCTYPE html>
<head>
<title>Raphael testing html</title>
<script src="raphael-min.js"></script>
<script>
// Initialize container when document is loaded
window.onload = function () {
paper = Raphael(0, 0, 640, 720, "container");
paper.circle(100,100,50).attr('fill','red');
};
</script>
</head>
<body>
<div id="container"></div>
</body>
</html>
and my server.js file is:
var httpServer = require('http');
var fs = require('fs');
var index = fs.readFileSync('index.html');
var httpServer = httpServer.createServer(function(request, response) {
console.log((new Date()) + ' Received request for ' + request.url);
response.writeHead(200, {'Content-Type': 'text/html'});
response.end(index);
return;
});
httpServer.listen(8080, function() {});
Running the index.html file within a browser - works fine (ie., draws a circle). However, when trying to serve this using node:
$ node server.js
I get no circle when pointing my browser to localhost:8080/ Instead I get the following error in the console:
Resource interpreted as Script but transferred with MIME type text/html:
"http://localhost:8080/raphael-min.js". localhost/:6
Uncaught SyntaxError: Unexpected token < :8080/raphael-min.js:2
Uncaught ReferenceError: Raphael is not defined localhost/:12
What am I doing wrong?
these modules can make your routing job easy: express and connect.
Your code is fine, but your http server ONLY send the info with 'Content-Type': 'text/html'
and the browser takes your js as html.
Here you have a gist with a example static node server:
https://gist.github.com/jmingov/5894964
And here express info about static content.