检测单页应用程序上的应用程序版本更改

时间:2014-04-14 09:42:09

标签: javascript angularjs versioning single-page-application

今天提出了一个问题,我没有明确的答案。

假设我们连接并缩小所有资源文件(CSS和Javascript)并在“Master-Page”中声明它们。

在多页应用中,如果CSS文件发生变化,则会在下一次整页加载时重新充值。

在单页应用程序中,用户可以继续工作数天,并且永远不会为声明CSS文件的主页面充电。在发出Ctrl-F5之前,用户永远不会看到更改。

我确信有人已经想到了这一点并且有经验可以分享:)

对我来说,使用WebSockets不是一种选择。首先是因为它太过分,因为并非所有客户都支持这项技术。同样的原因适用于所有WebSocket后备......因此我不会继续打我的服务器。

那么,有什么想法吗? :)

顺便说一句,我们正在使用AngularJS,如果这对特定的解决方案有帮助的话。

谢谢!

3 个答案:

答案 0 :(得分:28)

我遇到了同样的问题。我的解决方案已被提出并且可能无法回应您的标准:

当我打包我的前端应用程序和我的服务器应用程序时,我共享一个包含当前版本的前端应用程序的配置文件。

正面:我的路线中有75%隐含地更改了Web服务(路由更改解析)。因此,每当我调用我的服务器时,我都会包含一个包含前端应用程序客户端版本的自定义HTTP标头(或GET / POST参数)。

服务器端:我将前端应用版本(用户浏览器中的版本,上次用户刷新/加载SPA时加载的版本)与共享配置文件的前端应用版本进行比较:

  • 如果版本匹配:我什么都不做。
  • 如果版本不匹配,我发送自定义HTTP状态错误代码(例如418)

然后正面:我添加了一个响应拦截器拦截任何418错误代码并对整个应用程序进行强制刷新

就是这样。基本上,“检查”前端应用程序版本是否为最新版本的事件是路由更改(通过ajax调用WS)。但你可以添加一些无限的$ interval,每隔5分钟左右调用一次专用的WS ... 如果需要,我可以添加一些代码。

希望这会有所帮助;)

答案 1 :(得分:2)

假设您通过$ route service和provider使用AngularJS的路由,那么如果需要更改重大更改,您可以使用$routeChangeSuccess事件来执行服务器请求;如果有,那么你可以做一个window.location.reload()刷新页面并获取所有更新的资源和htmls。

可以根据您的实施方式更改以下过程:

<强> 1 即可。在服务器中设置配置文件,指示应用程序的版本。您也可以选择为不同的文件分配不同的版本,但由于您已连接所有资源文件,我猜您可能会限制配置中的版本选项。

<强> 2 即可。创建一个服务,其中包含所有必要信息(来自服务器的文件版本)以及对服务器执行服务器请求以检查服务中存储的当前文件版本的方法。

第3 即可。使用$routeChangeSuccess事件使用您在步骤 2 中创建的服务执行服务器请求,如果请求返回了有效更改,确认存在更改,则通过{{重新加载强制页面1}}。

答案 2 :(得分:1)

我决定在最后添加我的最终想法:

我们现在寻求减少解决方案。

因为我们有一个&#34;代理服务&#34;这是(现在再次)唯一一个与此应用程序交互的应用程序,我们在所有响应的http标头上添加了应用程序版本。如果我们收到更新的版本,会出现一个弹出窗口,通知用户并发出整页刷新...

这个解决方案不适用于那些没有自己的&#34;私人&#34;服务。