静态资源上线问题。
有学员出去面试,面试官问了一个问题:如果你真的没有做过前端的资源的上线发布,还真的不好回答。
正常前端要上线的时候,打完包之后会生成一个dist的文件夹,dist文件夹里面会扔到服务器上。这时候上完线之后,比如去请求页面的时候,基本上有js,对于用户来说,这时候有新的东西要更新。
可以看一下,有些资源是走的缓存的,比如js资源,包括图片资源,看走的缓存。所以对用户来说,如果不去强制刷新页面,不清缓存,访问其实还是旧的业务逻辑。
打完包之后会有一个index.html,但是这里面的东西通常index.html文件本身很少去做缓存的,所以它里面index.html去上线,上完线之后放到静态服务器上,就是它。上完之后,这里面外链的js是这个版本的。
比如这次更新完了之后要上线,有可能js变了,后缀名也变了,这时候要去上线。要去上线之后,用户访问网页的时候,加载的index.html里面还是旧的js文件。对于旧的js文件来说,有可能对于远端的复习上把旧的文件删掉了,还有可能会导致前面出错,因为请求不了js了。
因为上完线之后,js已经删掉了。这时候一般的方案就是要不就是index.html不做缓存,每次都请求最新的。像首页没有缓存,每次刷新页面都是请求新的,看到没有?但这种方式不是特别好。
这种方式怎么做?一般在index.html里面可以加上这样的请求头,加上标签,就是强制不让它缓存。再一个就是服务是部署在nginx,在nginx里面也可以加上不让它缓存。但是这种方法还不是最好的。
一般不管是js这种资源,还是图片,CSS还是index.html,基本上都会做缓存的。
比如静态资源,index.html还是图片,都会上到cdn服务上,每一次发包的时候,它会把原来的上一个版本的静态资源留着,也不会去删除。像会做一个备份,根据日期做一个备份。
对于用户来说,这个网站如果用户没有清缓存,访问index.html,那么它里面那种东西还是旧的内容,js文件名也是旧的,但是在这个服务器上,我给它保留备份。
如果这时候用户清缓存,或者打包之后,index.html的过期时间已经到了,过期时间到了,它会去请求新的,请求新的就去请求新的js文件,也就是在上线的时候,旧的静态资源,比如在这个里面的js,都会做备份的。
但是这样也有一个弊端,备份的内容会非常多,从二零二年的到现在的二零二四年了,都还在备份当中,因为不知道用户什么时候去刷新页面,有可能访问的是旧的,一般都设置缓存时间的,index.html可能缓存个30天。
如果面试官在问你的时候,可以以这种方式给面试官聊。