I couldn't find an answer to my question from other similar questions.
So, I have two docker containers:
- Next.JS web-app
- nginx reverse proxy
If I'll connect to nginx container via docker exec -it...
I can see my static files bound from the shared volume.
I run them with docker-compose:
volumes:
nextjs-build:
version: '3.9'
services:
nginx:
image: arm64v8/nginx:alpine
container_name: nginx
ports:
- "80:80"
- "443:443"
networks:
- blog
restart: unless-stopped
depends_on:
- website-front
volumes:
- type: volume
source: nextjs-build
target: /nextjs
read_only: true
- type: bind
source: /etc/ssl/private/blog-ssl
target: /etc/ssl/private/
read_only: true
- type: bind
source: ./nginx/includes
target: /etc/nginx/includes
read_only: true
- type: bind
source: ./nginx/conf.d
target: /etc/nginx/conf.d
read_only: true
- type: bind
source: ./nginx/dhparam.pem
target: /etc/nginx/dhparam.pem
read_only: true
- type: bind
source: ./nginx/nginx.conf
target: /etc/nginx/nginx.conf
read_only: true
website-front:
build: ./website
container_name: website-front
ports:
- "3000"
networks:
- blog
restart: unless-stopped
volumes:
- nextjs-build:/app/.next
networks:
blog:
external:
name: nat
my nginx configs:
upstream nextjs_upstream {
server website-front:3000;
}
server {
listen 443 http2 ssl;
listen [::]:443 http2 ssl;
server_name website_url;
ssl_certificate /etc/ssl/private/chain.crt;
ssl_certificate_key /etc/ssl/private/server.key;
ssl_trusted_certificate /etc/ssl/private/ca.ca-bundle;
# access_log /var/log/nginx/host.access.log main;
# security
include includes/security.conf;
include includes/general.conf;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_cache_bypass $http_upgrade;
location /_next {
proxy_pass http://nextjs_upstream/.next;
}
location / {
proxy_pass http://nextjs_upstream;
}
}
Tried multiple nginx configurations for static route:
localhost /_next {
root /nextjs;
}
NextJS dockerfile:
FROM node:alpine AS deps
# this ensures we fix simlinks for npx, Yarn, and PnPm
RUN apk add --no-cache libc6-compat
RUN corepack disable && corepack enable
WORKDIR /app
COPY package.json yarn.lock ./
RUN yarn install --frozen-lockfile
# builder
FROM node:alpine AS builder
WORKDIR /app
COPY . .
COPY --from=deps /app/node_modules ./node_modules
RUN yarn build
# runner
FROM node:alpine AS runner
WORKDIR /app
ENV NODE_ENV production
COPY --from=builder /app/public ./public
COPY --from=builder /app/.next ./.next
COPY --from=builder /app/node_modules ./node_modules
COPY --from=builder /app/package.json ./package.json
COPY --from=builder /app/yarn.lock ./yarn.lock
RUN chown -R node:node /app/.next
USER node
EXPOSE 3000
CMD [ "yarn", "start" ]
With that config I can see my website, but for static files I got 404 through upstream.