Strapi dashbaord prevented from being displayed by nginx cache

Questions and Answers
1
System Information
  • Strapi Version: 3.2.5
  • Operating System: Ubuntu 20.4
  • Database: Postgres
  • Node Version: >=10.0.0
  • NPM Version: >=6.0.0

My strapi dashboard works fine only when file caching is not enabled on nginx:

 #location ~* \.(js|css|png|jpg|jpeg|gif|ico|svg)$ {
 #        expires 60d;
 #}

When I uncomment these lines, strapi dashboard doesn’t display anything, because of this:

image
image1226×516 28.5 KB

Why does this happen and how can I solve this by allowing to cache my files?

Nginx conf relevant parts:

    server {
        listen 443 ssl http2;
        listen [::]:443 ssl http2;
        server_name example.lt;
        root /var/www/html/example/frontend/dist;
        index index.html;

        if ($request_uri = /index.html) {
            return 301 https://example.lt;
        }

        location / {
            try_files $uri $uri/ /index.html;
        }

        #location ~* \.(js|css|png|jpg|jpeg|gif|ico|svg)$ {
        #       expires 60d;
        #}

        location ~* \.(pdf|docx|pptx|svg) {
            add_header X-Robots-Tag "noindex, nofollow";
        }

        # Strapi API
        location /api/ {
            rewrite ^/api/(.*)$ /$1 break;
            proxy_pass http://strapi;
            proxy_http_version 1.1;
            proxy_set_header X-Forwarded-Host $host;
            proxy_set_header X-Forwarded-Server $host;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header X-Forwarded-Proto $scheme;
            proxy_set_header Host $http_host;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "Upgrade";
            proxy_pass_request_headers on;
        }

        # Strapi Dashboard
        location /dashboard {
            proxy_pass http://strapi/dashboard;
            proxy_http_version 1.1;
            proxy_set_header X-Forwarded-Host $host;
            proxy_set_header X-Forwarded-Server $host;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header X-Forwarded-Proto $scheme;
            proxy_set_header Host $http_host;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "Upgrade";
            proxy_pass_request_headers on;
        }
    }

Upstream conf:
upstream strapi { server 127.0.0.1:1337; }

Thanks for your help.

2

In a case like this you would be better off removing the proxy for the admin and serving it statically with the cache. You can disable the Strapi backend from serving the admin, see the config for that here: https://strapi.io/documentation/developer-docs/latest/concepts/configurations.html#available-options

Set admin.serveAdminPanel to false and construct an nginx location block to serve the build folder of your Strapi application.

3

Thanks, I thought it’ll be enough to write some clever regex in nginx not to cache dashboard/*.js files, but I couldn’t work it out. Anyway, after testing my website, I did not see lots of improvement in speed after enabling it, so I’ll just leave it as it is:)

Thanks again @DMehaffy

1 Like