cdn缓存采坑---无法更新文件(之前的文件无法删除)

简单讲下cdn吧

CDN的全称是Content Delivery Network,及内容分发网络.其基本思路是尽可能避开互联网上有可能会影响数据传递速度的稳定性和瓶颈的环节,使内容传输的跟快,更稳定.通过在网络各处防止节点服务器所构成的吸纳有的互联网基础之上的一层只能虚拟网络.CDN系统能够实时地根据网络流量和各节点的连接、负载状况以及到用户的距离和响应时间等综合信息将用户的请求重新导向离用户最近的服务节点上。其目的是使用户可就近取得所需内容,解决 Internet网络拥挤的状况,提高用户访问网站的响应速度。

由于cdn使用的是缓存技术,而我们在访问cdn的时候使用的唯一表示恰巧又是我们的url也就是说如果我们的内容更新了但是url没有变化,那我们访问到的数据依然是一起拿的数据.所以在更新cdn上面的文件之前需要我们将cdn上的缓存清空.

我遇到的坑

我把js文件放到了本地的服务器上,该服务器是接有cdn服务的,所以上面的文件会自动的伤处难道cdn上进行加速,一开始我在服务器上更改了js文件但是我访问该文件的到的结果依然是没有更改的之前的数据.
之后上网查了一下是cdn的问题,更改了一下请求连接,结果确实这样的.
这里写图片描述
这里写图片描述
上图发现该资源是通过cdn获取的.

解决问题

简单的查询了下cdn的原理发现,cdn就好像是我们使用的redis一样.
将需要的数据上传到redis进行缓存,当我们需要的时候我们会先上redis上进行查询,如果reids上存在该文件,那么我们可以直接获取该文件,如果redis上没有该文件,我们这会上mysql中进行查询

联系了下运维,运维把我获取文件的ip放到服务器上从新推送了一次,再次访问之前的url,数据更新,问题解决

对于解决 `chunk-vendors.js` 文件过大的问题,你可以考虑以下几个方面: 1. **代码优化和分割**:检查你的代码,确保没有不必要的依赖或重复的代码。确保你只导入需要的库和组件,而不是整个库。使用 Webpack 的代码分割功能,将代码分割成更小的模块,这样可以避免将所有代码打包到一个文件中。 2. **按需加载**:使用动态导入(dynamic import)功能,按需加载需要的模块。这样可以减少初始加载时需要下载的代码量。例如,你可以使用 `import()` 函数来异步加载某些模块。 3. **使用 CDN 加速**:将一些第三方库或公共资源文件托管到 CDN 上,这样可以利用 CDN 的优势来提高文件的加载速度和稳定性。CDN 可以提供全球分布的服务器节点,减少用户访问时的延迟。 4. **压缩和混淆代码**:使用压缩工具(如 UglifyJS、Terser)来压缩和混淆你的代码,以减小文件大小。这些工具可以删除空格、注释和不必要的字符,并简化变量名,从而减小文件体积。 5. **使用 Tree Shaking**:如果你使用的是 ES6 模块系统(import/export),可以使用 Tree Shaking 来自动移除未使用的代码。这样可以进一步减小打包后的文件大小。 6. **使用 Gzip 或 Brotli 压缩**:在服务器端启用 Gzip 或 Brotli 压缩,以减小传输文件的大小。这样可以提高文件的下载速度,并减少用户的流量消耗。 7. **使用缓存**:在服务器设置适当的缓存策略,让浏览器缓存静态资源文件。这样可以减少重复的网络请求,并提高页面加载速度。 通过以上的优化措施,你应该能够减小 `chunk-vendors.js` 文件的大小,并提升网页的性能。请根据你的具体项目需求和实际情况选择适合的优化方法。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值