3

I have a multistage docker build for my nextjs frontend app. It looks like this:

# Do the npm install or yarn install in the full image
FROM mhart/alpine-node AS builder
WORKDIR /app
COPY ./package.json ./
RUN npm install
COPY . .
RUN npm run build
RUN npm run export

FROM nginx
EXPOSE 3000
COPY ./nginx/default.conf /etc/nginx/conf.d/default.conf
COPY --from=builder /app/out /usr/share/nginx/html

The problem is now I have dynamic routes. Therefore I cannot run the command next export, which builds my app as a static app. NextJS states clearly that not every app can be deployed as a static app. If your app needs to generate dynamic pages at the runtime, you can't deploy it as a static app. https://nextjs.org/learn/excel/static-html-export

Now the problem is that in my docker deployment I depend on an entry index.html file to be copied from my nextjs exported folder into /usr/share/nginx/html folder in nginx. Is there a way for me to export 3000 from nextjs to nginx, but not build static files and still have it sit behind nginx, what do i need to copy over to nginx if not the index.html file?

The nginx webserver that routes the traffic to either the client or the server is as follows:

upstream client {
  server client:3000;
}

upstream api {
  server api:4000;
}

server {
  listen 80;

  location / {
    proxy_pass http://client;
  }

  location /sockjs-node {
    proxy_pass http://client;
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection "Upgrade";
  }

  location /api {
    rewrite /api/(.*) /$1 break;
    proxy_pass http://api;
  }
}
4
  • You need to figure out how you can run your application behind nginx first. Since you can't generate static pages, you would have to run your nodejs app which also runs some webserver. After that case you can set up nginx to proxy all requests to your nodejs app. So in the end your container would have to run two webservers: nodejs app on port 3000 (this is the port you tried to export I guess) and nginx. Feb 27, 2019 at 20:41
  • @IgorNikolaev I do have another webserver in it's own container but talking to either the client or the api containers through the same network. I'll update my answer so you can see the other nginx configuration
    – Shaun Chua
    Feb 27, 2019 at 23:32
  • Are you able to ping your client and api servers from nginx if you log into it? How do you run containers? The name of the container defines it's hostname within a network. Do you actually try to run nginx and next.js in the same container as the other answer suggests? Mar 1, 2019 at 7:52
  • I was able to solve this by removing the nginx server for my client to handle static pages. Subsequently i had another nginx container sitting in front of both my client and server and routing traffic depending on the url pattern
    – Shaun Chua
    Mar 1, 2019 at 8:29

1 Answer 1

1

Run nginx and the next.js on different containers.

1
  • but in that case how to call to backend api from next.js node server ? I'm getting net::ERR_FAILED for api calls which are going through frontend container. Nov 11, 2022 at 14:28

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.