Disable nginx cache for JavaScript files

Question

Ok  I m almost giving up on this  but how can I disable the caching from Nginx for JavaScript files  I m using a docker container with Nginx  When I now change something in the JavaScript file  I need multiple reloads until the new file is there   How do I know it s Nginx and not the browser docker   Browser  I used curl on the command line to simulate the request and had the same issues  Also  I m using a CacheKiller plugin and have cache disabled in Chrome Dev Tools   Docker  When I connect to the container s bash  and use cat after changing the file  I get the correct result immediately   I changed my nginx conf for the sites-enabled to this  which I found in another stackoverflow thread   location          jpg jpeg gif png ico css zip tgz gz rar bz2 pdf txt tar wav bmp rtf js flv swf xml html htm           clear all access log directives for the current level     access log off      add header Cache-Control no-cache        set the Expires header to 31 December 2037 23 59 59 GMT  and the Cache-Control max-age to 10 years     expires 1s      However  after rebuilding the containers  and making sure it s in the container with cat   it still didn t work  This here is the complete  conf  server       server name app      root  var www app web         Redirect to blog     location      blog           proxy set header Accept-Encoding             sub filter  https   testproject wordpress com     blog            sub filter once off          rewrite   blog        1 break          rewrite   blog   break          proxy pass     https   testproject wordpress com               Serve index html only for exact root URL     location             try files  uri  app dev php is args args             location      app app dev config   php                fastcgi pass php-upstream          fastcgi split path info       php                 include fastcgi params          fastcgi param SCRIPT FILENAME  document root fastcgi script name          fastcgi param HTTPS off            Prevents URIs that include the front controller  This will 404            http   domain tld app dev php some-path           Remove the internal directive to allow URIs like this         internal             location          jpg jpeg gif png ico css zip tgz gz rar bz2 pdf txt tar wav bmp rtf js flv swf xml html htm               clear all access log directives for the current level         access log off          add header Cache-Control no-cache            set the Expires header to 31 December 2037 23 59 59 GMT  and the Cache-Control max-age to 10 years         expires 1s              error log  var log nginx app error log      access log  var log nginx app access log

User · Accepted Answer

I have the following nginx virtual host (static content) for local development work to disable all browser caching:

server {
    listen 8080;
    server_name localhost;

    location / {
        root /your/site/public;
        index index.html;

        # kill cache
        add_header Last-Modified $date_gmt;
        add_header Cache-Control 'no-store, no-cache, must-revalidate, proxy-revalidate, max-age=0';
        if_modified_since off;
        expires off;
        etag off;
    }
}

No cache headers sent:

$ curl -I http://localhost:8080
HTTP/1.1 200 OK
Server: nginx/1.12.1
Date: Mon, 24 Jul 2017 16:19:30 GMT
Content-Type: text/html
Content-Length: 2076
Connection: keep-alive
Last-Modified: Monday, 24-Jul-2017 16:19:30 GMT
Cache-Control: no-store
Accept-Ranges: bytes

Last-Modified is always current time.

User · Answer

The expires and add header directives have no impact on NGINX caching the files  those are purely about what the browser sees    What you likely want instead is   location stuffyoudontwanttocache         don t cache it     proxy no cache 1        even if cached  don t try to use it     proxy cache bypass 1       Though usually  js etc is the thing you would cache  so perhaps you should just disable caching entirely

User · Answer

Remember set sendfile off  or cache headers doesn t work  I use this snipped   location              index index php index html index htm          try files  uri  uri   404    s  el  index html para html5Mode de angular            s  kill cache  use in dev         sendfile off          add header Last-Modified  date gmt          add header Cache-Control  no-store  no-cache  must-revalidate  proxy-revalidate  max-age 0           if modified since off          expires off          etag off          proxy no cache 1          proxy cache bypass 1

User · Answer

I know this question is a bit old but i would suggest to use some cachebraking hash in the url of the javascript  This works perfectly in production as well as during development because you can have both infinite cache times and intant updates when changes occur   Lets assume you have a javascript file  js script min js  but in the referencing html php file you do not use the actual path but    lt script src   js script  lt  php echo md5 filemtime   js script min js       gt  min js  gt  lt  script gt    So everytime the file is changed  the browser gets a different url  which in turn means it cannot be cached  be it locally or on any proxy inbetween   To make this work you need nginx to rewrite any request to  js script  0-9a-f  32  min js to the original filename  In my case i use the following directive  for css also    location       css js                     expires max                  add header Pragma public                  etag off                  add header Cache-Control  public                   add header Last-Modified                     rewrite            style script   min     d w  32     js css      1  2 min  4 break              I would guess that the filemtime call does not even require disk access on the server as it should be in linux s file cache  If you have doubts or static html files you can also use a fixed random value  or incremental or content hash  that is updated when your javascript   css preprocessor has finished or let one of your git hooks change it   In theory you could also use a cachebreaker as a dummy parameter  like  js script min js cachebreak 0123456789abcfef   but then the file is not cached at least by some proxies because of the

User · Answer

I have the following Nginx virtual host static content  for local development work to disable all browser caching       upstream testCom                    server localhost 1338                 server                        listen 80              server name  lt your ip or domain gt               location                    proxy cache   datacache              proxy cache key  scheme host request method request uri              proxy cache valid       200     60m              proxy cache min uses    1              proxy cache use stale   updating               proxy pass header Server              proxy set header Host  http host              proxy redirect off              proxy set header X-Real-IP  remote addr              proxy set header X-Forwarded-For  proxy add x forwarded for              proxy set header X-Scheme  scheme               proxy ignore headers    Set-Cookie               userid          on              userid name       uid              userid domain    lt your ip or domain gt               userid path                    userid expires  max              userid p3p       policyref   w3c p3p xml   CP  CUR ADM OUR NOR STA NID                  add header Last-Modified  date gmt              add header Cache-Control  no-store  no-cache  must-revalidate  proxy-revalidate  max-age 0               if modified since off              expires off              etag off               proxy pass http   testCom

User · Answer

What you are looking for is a simple directive like   location         manifest appcache html  xml json         expires -1      The above will not cache the extensions within the     You can configure different directives for different file types

[javascript] Disable nginx cache for JavaScript files

Examples related to javascript

Examples related to caching

Examples related to nginx