在nginx中自动版本化CSS / JS

Question

I have a setup where nginx is serving all static content (CSS/JS). Our problem is that when we update the static content the browser doesn't necessarily update them immediately, causing problems when we're pushing new versions.

I would like to have a nginx plugin that basically replaces all calls to CSS/JS and ads a versioning number, like this:

Before:

<link rel="stylesheet" type="text/css" href="/media/css/style.css" />

After:

<link rel="stylesheet" type="text/css" href="/media/css/style.css?3428432" />

And does this automatically based on the latest changed date on the style.css file itself. So I don't have to update the HTML. Is there a plugin for this? I know Googles mod_pagespeed does simliar things in their apache2 module.. but I can't find anyone for nginx.

Answer 1

Generally, this is done in the application itself, not at the webserver level. The webserver generally only knows what to serve, and from where. Both PHP and Rails have the ability to do what you're describing above, but again, that's within the application itself.

From what I can tell, this article is a good step-by-step walk through which is very similar to what you're asking for, but again, this involves application changes. If you search Google for "nginx css versioning" you'll find other articles which discuss the nginx config, but all that I looked at involved application changes as well.

Answer 2

Adding the below to the nginx should serve the file by taking just the filename and ignoring the version info.

location ~ ^/(assets/js|assets/css) {
 root path/to/the/static/files;
 access_log off;
 expires max;
 try_files $uri $1;
}