CDN 部署频繁更改的静态资源有什么工具可以让流程更方便?

题叶
  • 17.3k

出于网速的原因, 我们遇到前端代码通过 CDN 存放, 几乎是全部的代码, CSS, JS, 图片, 都是从 CDN 加载的而不是服务器本身,

问题随之而来了, 我们的 JS, CSS, 图片, 都有一部份是要频繁更改的.

结果就是每次上线发布都需要重命名 JS CSS 甚至一些图片, 形成了比较繁琐的流程. 首先自己也写了一些工具, 自动化 JS 和 CSS 重命名的步骤, 但部分问题并没有解决:

  • CSS Spirites 维护的文件需要手动维护, 并且文件名因为 CDN 缓存需要更改
  • 服务器需要保存多版本的 JS 和 CSS 文件, Git 仓库内容比较复杂

是否有相关工具可以对 CDN 相关的前端部署做一些优化呢?

回复
阅读 8.6k
2 个回答

我们是这么做的。发一次版本就加一次前端打包版本号,就算只改项目里的一个文字。项目使用的AWS的CDN(cludfront),没有清除CDN缓存功能

CSS 中用到的图片资源使用相对路径,不使用绝对路径。 我使用 Grunt 来打包,Grunt 中的打包逻辑是这样的:

  1. 创建当前日期的文件夹(201308201623,yyyymmddhhMM) 格式
  2. 压缩合并js,css,压缩 html
  3. 将 html 中的引用地址(css,js)改成预期的 cdn 地址 (cdn.com/201308201623/style.css,cdn.com/201308201623/main.js)

有人提到担心同一个域名,过多连接数会影响加载速度。我的解决办法是,添加两个域名,一个域名负责js,一个域名负责css&images

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
宣传栏