我们目前正在将Webpack与HtmlWebpackPlugin结合使用,以为我们的网页生成JavaScript版本。
new HtmlPlugin({
template: 'www/index-template.html', //source path - relative to project root
filename: 'index.html', //output path - relative to outpath above
hash: true,
cache: true //only emit new bundle if changed
}),
这会导致将哈希添加到捆绑的javascript文件的查询字符串中。
<script type="text/javascript" src="/build/vendor.min.js?4aacccd01b71c61e598c"></script><script type="text/javascript" src="/build/client.min.js?4aacccd01b71c61e598c"></script>
当使用任何标准的台式机或移动浏览器时,新的构建都将正确地缓存清除,并且无需用户的任何努力即可加载该网站的新版本。但是,我们还有一个chrome Web应用程序实现,我们将其称为:
在此应用程序中,由于某种原因,javascript构建末尾的哈希不会破坏高速缓存。我们必须手动右键单击页面上的某个位置,然后单击重新加载(或按F5键)。由于某种原因,缓存未在Web应用程序中清除。
我当时在想,这可能是在缓存index.html文件吗?这可能会导致该应用永远不会在构建中收到更新的哈希值。如果是这种情况,我不确定如何解决该问题。
我还注意到,如果我们的本地主机服务器关闭,该页面仍会像服务器正在运行一样加载。这向我指示了某种脱机缓存。我检查了manifest.json parameters,找不到任何可以重新加载的内容。
我还尝试了这些chrome命令行开关,但这些开关均无济于事:--disk-cache-size = 0,--aggressive-cache-discard,--disable-offline-auto-reload。
另一个警告是,我们需要保留localStorage数据及其cookie。在标准浏览器窗口或与此相关的任何浏览器中,它都可以正常工作,但在Chrome Web应用程序内部时则不能正常工作。
最佳答案
您是否正在与服务人员谈论“渐进式Web应用程序”?如果是这样,则html文件可以(并且应该)在第一次下载时被缓存。您需要在客户端上进行某种积极的更新过程,以确保正确加载新文件。
也许进行一次api调用来检查服务器上的某种脏标志可能会起作用,并且如果返回true,它应该重新加载模板文件。或者更复杂的事情是,它从服务器获取了一系列脏文件,因此它知道要重新加载哪些文件,而不是加载所有文件。只是一些想法。