Nginx Configuration for Nextjs

nginxnextjs.conf

# Based on https://steveholgado.com/nginx-for-nextjs/

proxy_cache_path /var/cache/nginx levels=1:2 keys_zone=STATIC:10m inactive=7d use_temp_path=off;

upstream nextjs_upstream {
  server nextjs:3000;
  keepalive 2;
}

server {
  listen 80 default_server;

  server_name _;

  server_tokens off;

  # enables gzip
  gzip on; 
  # tells NGINX that any proxied files can be gzipped
  gzip_proxied any; 
  # sets a compression level - 4 is generally good
  gzip_comp_level 4; 
  # sets the types of files to compress
  gzip_types text/css application/javascript image/svg+xml;

  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/static {
    proxy_cache STATIC;
    proxy_pass http://nextjs_upstream;

    # For testing cache - remove before deploying to production
    add_header X-Cache-Status $upstream_cache_status;
  }

  location /static {
    proxy_cache STATIC;
    proxy_ignore_headers Cache-Control;
    proxy_cache_valid 60m;
    proxy_pass http://nextjs_upstream;

    # For testing cache - remove before deploying to production
    add_header X-Cache-Status $upstream_cache_status;
  }

  location / {
    proxy_pass http://nextjs_upstream;
  }
}