06月21, 2018

在缓存上小踩一坑

最近自己做了个新系统,叫做ultron,第一次独自完成一个项目,中间也遇到一些问题,想分享一下今天遇到的一个小问题。

代码发布上线的时候,经常会因为浏览器缓存所以要强刷才能生效,所以就在项目里加了 HtmlWebpackPlugin ,设置了hash等于true来避免这个问题。

alt

不准备说因为第一次做这个遇到的各种问题,主要是想说,配置好了之后,偶尔还是会出现刷新不成功的问题。

之前偷偷的测了一下,结果没有复现,因为项目已经交接了,所以中间也不太方便去做测试。这周刚好对方的前端妹子休假了,让我帮着照顾一周。中间做一些改动的时候又复现了这个问题,就仔细的研究了一下。

情况是这样的,上线代码之前,就记录了一下当前文件的hash值,上线之后,刷新页面,发现hash值并没有改变,页面未更新。强刷页面后,页面更新了,但hash值仍没有改变。

我以为是生成的hash出了问题,我在本地测试了一下,生成的hash没有问题,于是猜测是服务器上的webpack的版本可能不太对,所以生成的有问题(这里我应该先看一下服务器的log的)。

结果服务器也是很诡异,看不到webpack的版本,重装了webpack,成功了,但还是看不到。换成root用户,看不到。删掉所有的包重新装,看不到。在这纠结了一阵,没有研究明白,试了一下别的包,都看不到,就没有继续死磕(希望知道的大佬可以告诉我,虽然我的博客没有留言功能……)

alt

这时候回到页面上,随手刷新了一下,发现之前上线完没有变的hash居然改变了??

和师兄分享了这个惊奇的发现之后,才知道原来编译后生成的js的名称就是index.js,之前一直以为后面是有hash的只不过被隐藏了我看不到…………

再确认了一下jenkins的log,果然hash是更新了的,所以,是因为nginx没有配置好,每次没有加载最新的html,从而没有拿到新的hash来重新加载js,导致了这样谜一样的问题。

然后师兄这时候抛出了前两天随口说的截图来怼我,好气,怎么办

alt

本文链接:http://crystalmiao.com/post/hash-error.html

-- EOF --

Comments

评论加载中...

注:如果长时间无法加载,请针对 disq.us | disquscdn.com | disqus.com 启用代理。