reactjsnginxnext.jsdeployment

Nextjs deployment using Nginx: 403 forbidden on chunks script files

I'm using Nginx to deploy my Next app.
I see many resources to config my Nginx correctly, but after all, the js files inside the _next/static/chunks get 403 forbidden error.

enter image description here

something that is confusable is that only js files in the chunks directory get 403 errors and other ones do not, for example, the two js files(_buildManifest.js, _ssgManifest.js) in AkIOTV9_ZRaGvsXBvXd8E directory have no errors and load with a 200 status code.

enter image description here

There are some similar questions, but none of them help me.
deploy nextjs with nginx with 403 forbidden
403 Forbidden Nginx

the permission of chunks directory and it's file shows as below
1st one is js file & 2nd one is chunks directory

enter image description here

enter image description here

here is my Nginx config

server {

    listen 80;
    server_name shahbazism.ir www.shahbazism.ir;

    gzip on;
    gzip_proxied any;
    gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/java$
    gzip_comp_level 6;
    gzip_buffers 16 8k;
    gzip_min_length 256;

    access_log /var/www/lawyer/logs/nginx-access.log;
    error_log /var/www/lawyer/logs/nginx-error.log;

    root /var/www/lawyer/interface/build;

    location /_next/static/ {
        alias /var/www/lawyer/interface/build/.next/static/;
        expires 365d;
        access_log off;
    }


    location / {
        proxy_pass http://127.0.0.1:3000;
        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;
    }


}

the 403 errors will solve if I use VPN!

Solution

  • I faced the same problem, and it was confusing because it worked on some networks but not others. I configured the HTTPS protocol in Nginx, and that resolved the issue.