Doum
Doum

Reputation: 397

Node.js Express serving index.html instead of static file

Im starting a node.js with express app, using angular. Everything was working fine while creating the app on cloud9.

I just released the app on my ec2 instance and now node always deliver index.html instead of my static file... When i look in chrome debug network, i see all js files loaded (status 200) but when i preview them, its my index.html file... The type of my js files is also set to text/html...

Here is my little server.js (no routing as i fake my angular data, so no call to the server for now...)

var express = require('express'),
path = require('path'),
http = require('http'),
fs = require('fs');

var app = express();

var logFile = fs.createWriteStream('./logger/express.log', {flags: 'a'}); //use {flags: 'w'} to open in write mode

app.configure(function () {
    app.set('port', process.env.PORT || 3000);
    app.use(express.logger({stream: logFile}));
    app.use(express.bodyParser()),
    app.use(express.static(path.join(__dirname, 'public')));
});

 /*app.get('/events', eventRoute.getEvents);
app.post('/events', eventRoute.saveEvent);*/

http.createServer(app).listen(app.get('port'), function () {
    console.log("Express server listening on port " + app.get('port'));
});

As i said previously, everything is working fine on cloud9 (cannot try on local for now...).

Does anyone has a clue about what is going wrong?

Thanks

Dominic

PS: I forgot to mention that it is the same with my CSS file!

Edit: Here a little picture of what i mean! enter image description here

And when i look at the preview of any file i get enter image description here

Edit2: I just deleted all my files and uploaded them again. Same problem! I really need help on this one please!

Fo live demo of the problem, hit that site

Upvotes: 2

Views: 6390

Answers (3)

Prerna Tulsiani
Prerna Tulsiani

Reputation: 1

In your root folder having server.js / index.js file, add the following code -

const express = require("express");
const app = express();
const path = require("path");

Sometimes the server.js file is not able to understand the location of build folder hence add the static location of build folder

app.use(express.static('client/build'));

// This will render your frontend at http://localhost:PORT/
app.get('*', (req, res) => {
res.sendFile(path.resolve(__dirname, 'client', 'build', 'index.html'));
});

// To serve you api at http://localhost:PORT/api
app.get("/api", (req, res) => {
  res.send("This is API");
});

// After this add the required the port number

const PORT = process.env.PORT

app.listen(PORT, () => {
  console.log("✅ Server running on port:",PORT);
});

Make sure the commands of calling functions are in this order -

  1. app.use
  2. app.get
  3. app.listen

Command to run - node server.js

Upvotes: 0

Doum
Doum

Reputation: 397

Well after a few hours of research about what can cause it, i finally found it!

The problem was not code related at all! I was hitting a new ec2 instance and i didnt route port 80 to my node.js app (81**).

I basically just runned this command and everything started working just fine.

iptables -t nat -A PREROUTING -p tcp --dport 80 -j REDIRECT --to 81**

Thanks you all

Upvotes: 1

ilmatic
ilmatic

Reputation: 565

Can you elaborate on what you mean by your 'static file' ?

on this line:

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

you have express routed to serve all files in the 'public' dir as static files. By default, express.static will serve 'index.html' if that directory is called. since you're serving the 'public' dir to '/', it's delivering index.html.

EDIT: I'm not sure if this is the problem, but this part of the code is redundant:

http.createServer(app).listen()

you can just say:

app.listen([port], [callback]);

since calling express() created a server. hope that helps.

Upvotes: 4

Related Questions