Chartjs with Node.js : Unexpected token <

Question

I am trying to use Chart.js with node.js. I downloaded Chart.js from the following git source: https://github.com/nnnick/Chart.js and tested it with php and things worked fine.

Now I am working with node.js but I have an issue:

Resource interpreted as Script but transferred with MIME type text/html: "url/Chart.js/Chart.js" localhost/:3 Uncaught SyntaxError: Unexpected token < /Chart.js/Chart.js:1

debug.html

<html><head>
  <script src="Chart.js/Chart.js"></script>
</head></html>

index.js

var http=require('http');
var fs=require('fs');

var fichier=fs.readFileSync('debug.html', 'utf-8');

var server = http.createServer(function(req,res){
    res.writeHead(200, {'Content-Type': 'text/html'});

    res.write(fichier);

    res.end();
});
server.listen(80);

I know that the path is good, node can find it so what is the problem?

Thank you for helping.

What if you use a valid HTML page (with a doctype and everything) and write type="text/javascript" on the script tag — Germain
– Germain, Commented Jan 29, 2014 at 16:15
Try to access http://localhost/Chart.js/Chart.js, you should see that your server always serves the same page for each request, without taking into account the path. — Paul Mougel
– Paul Mougel, Commented Jan 30, 2014 at 9:37
Paul you're rigth, I'm a novice with node.js and didn't thought about that. I will handle the request url, thank you for your help. — user3224275
– user3224275, Commented Jan 30, 2014 at 11:01

Paul Mougel · Accepted Answer · 2015-01-19 09:42:44Z

1

Your HTTP server doesn't look at the requested URL and always sends back the same page:

$ curl http://localhost/
<html><head>
  <script src="Chart.js/Chart.js"></script>
</head></html>

$ curl http://localhost/Chart.js/Chart.js
<html><head>
  <script src="Chart.js/Chart.js"></script>
</head></html>

$ curl http://localhost/random/url
<html><head>
  <script src="Chart.js/Chart.js"></script>
</head></html>

The solution is then to look at req.url and serve the correct file:

var server = http.createServer(function(req,res){
    if (req.url === 'Chart.js/Chart.js') {
        res.writeHead(200, {'Content-Type': 'application/javascript'});
        fs.createReadStream('./Chart.js/Chart.js').pipe(res);
        return;
    }
    res.writeHead(200, {'Content-Type': 'text/html'});
    res.write(fichier);
    res.end();
});

Note that this code snippet isn't a generic solution at all, and will not fit your needs nor will it scale easily to multiple files. You can look at some projects to have a better understanding of the solutions:

http-framework by Raynos, which is a collection of very simple HTTP servers based only on the http module;
the static middleware of connect

edited Jan 19, 2015 at 9:42

answered Jan 30, 2014 at 11:05

Paul Mougel

17.1k6 gold badges59 silver badges65 bronze badges

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

1 Comment

user3224275 Over a year ago

Yes as Paul said in the comment I didn't handle the request url. Thank you for helping !

Collectives™ on Stack Overflow

Chartjs with Node.js : Unexpected token <

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related