Assets cached on production despite having file changes.

[codebykenny]

Is there a way to make it so browsers force reloading of asset files such as Javascript and CSS files upon there being changes?

Particularly referring to production.css/js

[gavinbunney]

I've fixed that issue in our app by appending a ?v=<buildNumber> to the assets in sails-linker.js

i.e. edit tasks\config\sails-linker.js, read in some build file (or use a timestamp maybe - less cache friendly), then append it to the fileTmpl as below:

prodJs: {
    options: {
        startTag: '<!--SCRIPTS-->',
        endTag: '<!--SCRIPTS END-->',
        fileTmpl: '<script src="%s?v='+buildDetails.buildNumber+'"></script>',
        appRoot: '.tmp/public'
    },
    files: {
        '.tmp/public/**/*.html': ['.tmp/public/min/production.min.js'],
        'views/**/*.html': ['.tmp/public/min/production.min.js'],
        'views/**/*.ejs': ['.tmp/public/min/production.min.js']
    }
},

[codebykenny]

Worked like a charm, thank you gavinbunney!

[hasnainvbase]

Hi ..
can you please help me for clearing the cache problem in my app.
i want to clear cache specially js every first time when page load.

i try this method in my gruntfile.js like code below.
but its not working. its clear cache second time when we refresh page not first time.
can you please help ?

watch: {
api: {

    // API files to watch:
    files: ['api/**/*']
  },
  assets: {
    options: {
        startTag: '<!--SCRIPTS-->',
        endTag: '<!--SCRIPTS END-->',
        fileTmpl: '<script src="%s?v='+buildDetails.buildNumber+'"></script>',
        appRoot: '.tmp/public'
    },
    files: {
        '.tmp/public/**/*.html': ['.tmp/public/js/step1.js'],
        'views/**/*.html': ['.tmp/public/js/step1.js'],
        'views/**/*.ejs': ['.tmp/public/js/step1.js'],
    },
    // Assets to watch:
    //files: ['assets/**/*'],

    // When assets are changed:
    tasks: ['compileAssets', 'linkAssets']
  }
}

[sashasochka]

How did you actually make use of cache initially? For me nothing is cached in browser, even though server returns 304 code - there still is a round-trip request.

[gavinbunney]

@sochka a 304 will always make a round-trip request as it is validating that the content hasn't been modified.

In our app instance, we also have middleware that adds cache headers to various requests (depending on what is being requested, cache headers are different), something along the lines of:

var limit = 60 * 60 * 24 * 1000; /* one day */
res.header('Cache-Control', 'public, max-age='+ (limit / 1000));
res.header('Expires', new Date(Date.now() + limit).toUTCString());

[sashasochka]

@gavinbunney thanks, I've made it work using express.static and maxAge option.