Nextjs Routes are not working when deployed to Azure App Service Linux Instance

Question

I wanted to deploy a nextjs app to Azure App Service with Linux instance.

I followed the instructions here: https://developinjay.com/deploying-nextjs-app-to-azure-app-service-linux-77a43353e761 The app is live here https://interviewramp.azurewebsites.net and https://interviewramp.herokuapp.com. Routes work in Heroku. So if user goes here https://interviewramp.herokuapp.com/books/interviewramp/introduction it works. Routes don't work in Azure App service. So, if user goes here https://interviewramp.azurewebsites.net/books/interviewramp/introduction, I get 404 document not found error, which means code is trying to serve an introduction.html file in Azure and returning 404 because there is no html file like that.

All links work locally when I npm run start or npm run dev. Pasting url like this to browser gives 404 : https://interviewramp.azurewebsites.net/login

I have never done next export in my code. I was wondering if you could help me?

Below is my server.js

const express = require('express');
const session = require('express-session');
const mongoSessionStore = require('connect-mongo');
const next = require('next');
const api = require('./api');

require('dotenv').config();

const dev = process.env.NODE_ENV !== 'production';
const MONGO_URL = dev ? process.env.MONGO_URL_TEST : process.env.MONGO_URL;

const port = process.env.PORT || 8000;
const ROOT_URL = getRootUrl();

const URL_MAP = {
  '/login': '/public/login',
  '/my-books': '/customer/my-books',
};

const app = next({ dev });
const handle = app.getRequestHandler();

app.prepare().then(async () => {
  const server = express();

  server.use(helmet({ contentSecurityPolicy: false }));
  server.use((req, res, next) => {
    res.header('Access-Control-Allow-Origin', '*');
    next();
  });
  server.use(express.json());

  // give all Nextjs's request to Nextjs server
  server.get('/_next/*', (req, res) => {
    handle(req, res);
  });

  api(server);
  routesWithSlug({ server, app });

  server.get('*', (req, res) => {
    const url = URL_MAP[req.path];
    if (url) {
      app.render(req, res, url);
    } else {
      handle(req, res);
    }
  });

  server.listen(port, (err) => {
    if (err) throw err;
    logger.info(`> Ready on ${ROOT_URL}`);
  });
});

Answer 1

I was able to solve this problem and I am leaving this answer in case it is helpful to someone else. The Azure web app is showing correct paths now. I used node server.js instead of next start in my startup command in Azure and it fixed the issue.