1

让用户使用最新版本的单页应用程序的最佳方法是什么?如何确保用户不必按ctrl+F5来获取最新的页面资源(JS+CSS)

4

3 回答 3

1

使用构建器编号为对静态文件的所有引用添加前缀。

而不是/js/app.js你应该指向/js/123/app.js123 是内部版本号。

在每次部署时,增加内部版本号。

然后你需要做一些重写,以便服务器app.js在路径中找到假文件夹。

当然,静态文件不会重新加载,直到有人关闭浏览器并再次访问该页面或按 F5)。

要解决这个问题,可以使用 AJAX 请求app.js,看看是否被修改:

$.ajax({
    type:"GET",
    url:'/js/123/app.js',
    cache:true,
    ifModified:true,                  
    success:function(data,textStatus,jqXHR){
        console.debug(data);     // Returns undefined when response is 304 Not Modified
    }
});
于 2013-01-16T08:13:21.937 回答
1

这是我的解决方案:

PHP:

ob_start(function($data) {
    return preg_replace_callback(
        "(/(?:js|css|img)/.*?\.(?:js|css|png|jpg|gif))",
        function($m) {
            if( file_exists(substr($m[0],1))) return $m[0]."/t=".filemtime(substr($m[0],1));
            else return $m[0];
        },
        str_replace(array_keys($rep),array_values($rep),$data)
    );
});

.ht 访问:

RewriteRule (.*)/t=[0-9]+$ /$1

这会自动为所有图像、样式和脚本附加一个特定的时间戳:它的修改时间。然后,.htaccess再次将其剥离。

这意味着无论何时更新这些文件之一,缓存的版本都会立即有效地失效。经测试可在所有浏览器中完美运行。

于 2013-01-16T08:16:02.930 回答
0

使用内部版本号为静态内容折叠添加前缀是一种很好的方法。为了确保他们总是在构建后获取最新的,您需要将该技术与一个服务器端标签结合起来,该标签呈现 html 和静态内容的位置,并考虑构建号。当然,如果你正在做一个 100% 的角度范式,那么就没有服务器端标签之类的东西,所以你需要违反解决方案的纯度,并有一个用户在登录后登陆的 jsp 页面或类似的东西(欢迎page),然后引用您的静态内容。然后,如果您愿意,您可以在那里结束您的服务器端代码并​​从那时起生活在纯静态布局世界中。

于 2016-03-30T18:40:24.143 回答