You already answered your question CTRL+R. If you want more control you have to build it into your application design. You need something like RequireJs. You need dynamic UI elements that know how to refresh in an orderly manner. Your apps browser data structures and state need to persist through a JS and CSS/HTML reload.
How to force browser to update JS and CSS files cache after Deploy
Hi,
Currently, after every deploy, I need to ask my users to press a CTRL+R to force browser to reload my main CSS and JS files.
How can I do something to automatically when I have a new version of css or js files, my user browser automaticaly ask for new files?
My server is an DigitalOcean configured by Laravel FORGE.
CTRL+R is the only answer realy? :/
If you don't want to code your app any differently, as far as I know. I could never find the latest version of 'It Just Works' API kit.
The easiest way for you is to use some kind of versioning, so that the browser automatically downloads the new, refreshed version of your JS.
You can achieve something very easily, just put a random number at the end of your JS file. For example you can take something from the cache like so:
<script type="text/javascript" src="app.js?v={{ Cache::get('js_version_number') }}">
This way the path to your app.js can change every time you push to the server.
You just need some piece of code to run every time you push. You could have a git hook set up that executes a php file, or you could have a custom Laravel Command that does that.
In your code that gets execute you basically need just something like the
Cache::rememberForever('js_version_number', time());
this will change the version number, so thus the the old path that once was app.js?v=111 gets changed to app.js?v=112 and the browser sees that as a new file and re-downloades it
Are you using Laravel Elixir? If so, use mix.version().
As @JeffreyWay said, please refer to https://laracasts.com/series/laravel-5-and-the-front-end/episodes/7
Here's the article in the docs that explains this in detail: https://laravel.com/docs/master/mix#versioning-and-cache-busting
There is easy way to do it,
A. create new static function on you own helper
public static function getAutoVersion($file)
{
$filePath = public_path() . DS . $file;
if (!file_exists($filePath)) {
return '';
}
$version = filemtime($filePath);
return '?v=' . $version;
}
B. call this function on laravel core helper asset (for laravel version 5 or above)
file path /vendor/laravel/framework/src/Illuminate/Foundation/helpers.php
assume that Webapp is your helper class, just search this section on your project and add your function result to the asset return.
if (! function_exists('asset')) {
/**
* Generate an asset path for the application.
*
* @param string $path
* @param bool $secure
* @return string
*/
function asset($path, $secure = null)
{
return app('url')->asset($path, $secure) . Webapp::getAutoVersion($path);
}
}
After those changes all your js and css files will include dynamic version (each time the file will modified).
Old post I know, but this was the solution I found:
<link rel="stylesheet" href="{{ asset('css/app.css?v='.filemtime(public_path('css/app.css'))) }}"
/>
Same applies to the .js file
Please or to participate in this conversation.