Shira
Shira

Reputation: 424

Node js Express returns error 404 after refresh

I upload my project (NodeJS +Express + ReactJs) to a Windows machine on AWS. If I'm using the specific path to access the website (for example demo.co.il) everything works as expected. But if I'm using something like: demo.co.il/login it returns a 404 respond: enter image description here

This is my app.js:

var createError = require("http-errors");
var express = require("express");
var path = require("path");
var cookieParser = require("cookie-parser");
var logger = require("morgan");
var cors = require("cors");

var costRouter = require("./routes/Dashboard/Cost/cost");
var programRouter = require("./routes/Dashboard/Program/program");
var projectRouter = require("./routes/Dashboard/Project/project");
var portfolioRouter = require("./routes/Dashboard/Portfolio/portfolio");
var settingRouter = require("./routes/Settings/setting");
var userRouter = require("./routes/User/user");
var filterRouter = require("./routes/Filter/filter");
var topHeaderRouter = require("./routes/TopHeader/topHeader");
var utilsRouter = require("./routes/Utils/utils");
var passwordRouter = require("./routes/Password/password");

var app = express();

// view engine setup
app.set("views", path.join(__dirname, "views"));
app.engine("html", require("ejs").renderFile);
app.set("view engine", "html");

app.use(logger("dev"));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, "public")));
app.use(cors());

app.use("/api/cost", costRouter);
app.use("/api/program", programRouter);
app.use("/api/project", projectRouter);
app.use("/api/portfolio", portfolioRouter);
app.use("/api/settings", settingRouter);
app.use("/api/user", userRouter);
app.use("/api/filter", filterRouter);
app.use("/api/top-header", topHeaderRouter);
app.use("/api/utils", utilsRouter);
app.use("/api/password", passwordRouter);

// catch 404 and forward to error handler
app.use(function (req, res, next) {
  next(createError(404));
});

// error handler
app.use(function (err, req, res, next) {
  // set locals, only providing error in development
  res.locals.message = err.message;
  res.locals.error = req.app.get("env") === "development" ? err : {};

  // render the error page
  res.status(err.status || 500);
  res.render("error");
});

What could be the issue?

Upvotes: 1

Views: 1021

Answers (1)

yeya
yeya

Reputation: 2204

You need to serve the index.html.

I guess your react build files are under the public folder of express so tr to add this lines, adjust to the react build files location:

app.use((req, res, next) => {
  res.sendFile(path.join(__dirname, "public", "index.html"));
});

Upvotes: 3

Related Questions