CDN 相关

2024-11-26 12:50:02 204人阅读

为了提高网页应用的加载速度，我们会使用到浏览器缓存，然而浏览器缓存只能提升二次访问的速度。对于加速首次访问的速度，我们最常见的手段则是使用 CDN 加速。

CDN 的全称是 Content Delivery Network，即内容分发网络。通过将静态资源缓存到离用户很近的相同网络运营商的 CDN 节点上，使用户可以就近取得所需的内容，解决网络拥塞状况，提高用户访问网站的响应速度。

技术分享

事实上，在一些较大型的公司来说，通常是由公司的运维开发人员来负责部署 CDN 服务的，前端人员只需要了解使用 CDN 服务的大致流程即可。

1 选择 CDN 供应商

事实上，现在还有许多的 CDN 服务厂家，我们需要根据需求的情况去选择相应的厂商。现阶段 CDN 云服务商的竞争已经由技术逐渐取代价格成为 CDN 厂商在客户谈判时最关键因素，技术更高的 CDN 服务能够降低带宽成本、提升用户体验。

如今 CDN 各大厂商都会提供十分详尽的接入文档，使我们接入的开发成本变得更低。这里列举国内比较出名的 CDN 厂商：

通常购买了 CDN 服务后，该 CDN 服务会提供相应的接口让我们去上传和部署我们的资源。这部分的工作通常是由我们运维人员去负责的，对于一些小公司可能则需要前端或者后台人员去负责连接 CDN 服务，使业务能够部署静态资源到相应的服务器上。

使用 CDN 服务，对前端工程产生了一定的影响，我们需要对静态资源的部署做两项改变：

由于用户的网络线路有很多种，如网通、电信、移动等，为了让不同地区的用户会访问到离自己最近的相同网络线路上的 CDN 节点。因此我们需要将我们的资源部署到不同的网络线路的服务器中，然后通过这些服务器同步到不同线路的 CDN 节点上。

使用不同的域名来加载 CDN 服务的静态资源，一方面便于接入为 CDN 时设置 DNS 的智能解析。另一方面当静态资源和主页面使用不同的域名，在加载静态资源时 HTTP 请求并不会带上主域页面的 Cookie 等数据，较少了请求时的数据传输量，进一步加快网络访问。

通常情况下，我们的资源都是在本地，比如有个 JS 文件，我们在 HTML 里面按照相对目录引用它：

<script src=http://www.mamicode.com/"js/script.js"></script>

使用了 CDN 的话，资源都部署到了 CDN 服务器上去咯，这个时候我们必须用绝对路径来引用：

<script src=http://www.mamicode.com/"http://xxx.xxx.xxx/js/script.js"></script>

所有啊，必须有个修正资源路径的过程，而这个过程当然不能手动，通常都是在工程化里面解决这个问题。

如今 CDN 服务基本上已经成为现代大型网页应用的标配。这项技术是一种十分常用的网络性能优化手段。在未来的前端开发中，我们会经常与 CDN 打交道。因此如果能够清楚了解了 CDN 服务的相关原理和概念，将会让我们在将来的开发中能够更加得心应手。