Can't load local files when using NodeJS server

Question

I'm very new to NodeJS, and I'm currently playing around with it (and websockets), so this question might be a bit dumb. Anyway, I'm following a tutorial which has given me a simple app.js containing the following:

var fs = require('fs')
, http = require('http')
, socketio = require('socket.io');

var server = http.createServer(function(req, res) {
    res.writeHead(200, { 'Content-type': 'text/html'});
    res.end(fs.readFileSync(__dirname + '/index.html'));
}).listen(8080, function() {
    console.log('Listening at: http://localhost:8080');
});

socketio.listen(server).on('connection', function (socket) {
    socket.on('message', function (msg) {
        console.log('Message Received: ', msg);
        socket.broadcast.emit('message', msg);
    });
});

In my index.html I'm trying to load some js and css files, but I can't seem to load them. The files are inside a js folder which is in the same directory as my app.js and index.html, and I'm trying to load them like so:

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

If I look at the response from the request in my browser, it's returning the content of index.html.

Again, sorry if this question is silly, but I'm stuck and have no clue where to look.

Thanks!

jfriend00 · Accepted Answer · 2017-01-15 00:03:19Z

7

A web server in node.js does not serve ANY files by default (unlike some other web servers). So, if you want js files to be served, you have to define a web server route that will serve them. The code you show returns index.html for all incoming requests coming into that http server so, it should be no surpise that when a request comes in for /js/script.js, your web server sends out index.html.

A typical framework to use with node.js for web serving is Express and it has express.static() that can be used to define a route that will cover all your static files or all files in a particular directory. You could, of course, code your own static file handling or find some other module to do that also. The point is that you have to write or configure some code to serve your static resource files. That is not done for you automatically by the node.js http server.

edited Jan 15, 2017 at 0:03

answered Jan 14, 2017 at 23:58

jfriend00

711k104 gold badges1.1k silver badges1k bronze badges

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

1 Comment

Leon Over a year ago

Thanks, that's very helpful, I'll have a look at Express!

terik_poe · Accepted Answer · 2017-01-15 06:44:55Z

1

you can specify to the server in which folder to look for what

for static files such as css, images you can use public directory, you can provide your custom directory, but it's better to use public ,same goes for views

always require

const PATH = require('path')

app.use(express.static(PATH.join(__dirname, 'public')));

for template files such as .ejs, .html, .jade use

app.set('views', PATH.join(__dirname, 'views'));

answered Jan 15, 2017 at 6:44

terik_poe

5336 silver badges17 bronze badges

2 Comments

Henock Bongi Over a year ago

app.use('/main/static', express.static(path.join(__dirname, 'public'))); "main" is the main uri defined in node js selector. This solved my issue.

Quentin Over a year ago

This will error because app, express, and PATH are all undefined.

Henock Bongi · Accepted Answer · 2023-06-22 13:42:29Z

-1

I used this.

app.use('/main/static', express.static(path.join(__dirname, 'public')));

"main" is the default uri defined in node js selector. This solved my issue

answered Jun 22, 2023 at 13:42

Henock Bongi

2855 silver badges16 bronze badges

3 Comments

Quentin Over a year ago

This will error because app, express, and path are all undefined.

Henock Bongi Over a year ago

This is how i solved my issue. I created nodde js app in cpanel and i am able to serve static files like this

Quentin Over a year ago

Your issue is not the same as the one being asked about then.

Collectives™ on Stack Overflow

Can't load local files when using NodeJS server

3 Answers 3

1 Comment

2 Comments

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

2 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related