WHAT - CDN - Content Delivery Network

已于 2024-05-11 10:05:48 修改
阅读量1.2k 收藏 19
点赞数 29
分类专栏： 前端网络学习专栏 文章标签： 前端 javascript 面试 网络 流量运营
于 2024-05-11 09:57:41 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_58540586/article/details/138698395
版权

目录

参考阅读：

一、介绍

CDN stands for Content Delivery Network. It’s a network of servers distributed across various locations to deliver web content more efficiently to users.

CDN是内容交付网络的缩写。它是由分布在各个地点的服务器组成的网络，可以更高效地将网站内容交付给用户。当用户访问网站时，其位置与网站服务器的物理位置之间的距离会影响加载时间和性能。为了提高网站的加载速度、降低延迟并减少网络拥塞，CDN应运而生。

目前互联网业务在网络层面可能存在的问题：

  1. 业务服务器接入互联网的带宽有限
  2. 地域问题导致用户到服务器的物理距离会比较远，传输时延非常高
  3. 不同运营商之间的互联问题使得业务要考虑多运营商分布问题

适用场景：

  1. 站点加速，包括资讯、内容为主的站点
  2. 点播
  3. 直播
  4. …

将网站的内容发布到最接近用户的网络边缘，CDN 能够实时根据 用户的距离、网络流量 和 负载状况 等综合信息将用户的请求路由至离用户最近的服务节点上，提高用户访问网站的响应速度和成功率。

二、CDN 原理

CDN的原理是将网站的静态资源（如图片、视频、CSS、JavaScript文件等）复制到位于世界各地的服务器上。当用户访问网站时，CDN会根据用户的位置将内容从距离最近的服务器发送给用户，而不是直接从原始服务器发送。这样可以减少数据传输的时间和距离，提高网站的加载速度。

具体来说：

  1. 当用户输入网站上的 URL，经过本地 DNS 域名解析，DNS 域名解析最终会将域名的解析权交给 CNAME 指向的 CDN 专用 DNS 域名解析服务器
  2. CDN 的 DNS 域名解析服务器将 CDN 的全局负载均衡设备 IP 地址返回用户
  3. 用户向 CDN 的全局负载均衡设备发起 URL 访问请求
  4. CDN 全局负载均衡设备根据用户IP地址，以及用户请求的内容 URL，选择一台用户所属区域的区域负载均衡设备，告诉用户向这台设备发起请求
  5. 区域负载均衡设备会为用户选择一台合适的缓存服务器（这样源服务器就不必一遍又一遍地传递相同的内容）提供服务，选择的依据包括：根据用户 IP地址，判断哪一台服务器距用户最近；根据用户所请求的 URL 中携带的内容名称，判断哪一台服务器上有用户所需内容；查询各个服务器当前的负载情况，判断哪一台服务器尚有服务能力。基于以上这些条件的综合分析之后，区域负载均衡设备会向全局负载均衡设备返回一台缓存服务器的IP地址
  6. 全局负载均衡设备把缓存服务器的 IP 地址返回给用户
  7. 用户向缓存服务器发起请求，缓存服务器响应用户请求，将用户所需内容传送到用户终端。如果这台缓存服务器上并没有用户想要的内容，而区域均衡设备依然将它分配给了用户，那么这台服务器就要向它的上一级缓存服务器请求内容，直至追溯到网站的源服务器将内容拉到本地

三、作用

3.1 改善网站加载时间

CDN 的全球分布可以缩短用户与网站资源的距离，CDN 可以使用户连接到一个地理位置更近的数据中心；另外，CDN 使用最小化和文件压缩等策略来减小文件大小，从而减少传输的数据量；最后，CDN 还通过优化连接重用和启用 TLS 假启动来加速使用 TLS/SSL 的站点。

3.2 跨运营商、跨地域的全网覆盖

CDN 的核心是一个服务器网络，CDN 会将服务器放置在不同网络之间的交换点，这些互联网交换点（IXP）是不同互联网提供商连接的主要位置，以便彼此提供来自其不同网络的流量的访问，通过连接到这些服务器，CDN 加速可以覆盖全球的线路，充分利用带宽资源，平衡源站点的流量/减少源服务器每次响应请求时消耗的带宽成本。了解 CDN （例如 Cloudflare CDN ）如何减少对源服务器的请求并降低带宽成本。

3.3 可靠性：负载均衡、智能故障切换

对于拥有互联网资产的任何人来说，正常运行时间都是至关重要的组成部分。恶意攻击或只是受欢迎程度增加所致的硬件故障和流量激增，都有可能使 web 服务器停机并阻止用户访问站点或服务。完善的 CDN 具备一些可最大程度减少停机时间的功能：负载均衡可以在多个服务器之间平均分配网络流传，从而更容易应对流量的快速增长。

另外，即使一台或多台 CDN 服务器由于硬件故障而脱机，智能故障切换也可提供不间断的服务，故障转移可以将流量重新分配给其他正常运行的服务器；如果整个数据中心都遇到技术问题，那么 Anycast 路由会将流量转移到另一个可用的数据中心，以确保所有用户都能继续访问网站。

3.4 数据安全性

信息安全是 CDN 不可或缺的一部分。CDN 可以使用新的 TLS/SSL 证书保护站点的安全，这将确保高标准的身份验证、加密和完整性。

3.5 减少运维成本

使用 CDN 加速厂商的一站式服务，可以实现网站的全网铺设，不用考虑购买服务器以及后续的托管运维。另外，CDN 加速厂商还有配套的云存储、大数据服务、视频云服务等，而且一般会提供7x24小时运维监控，可以更专注自身业务上。

三、减少 “带宽” 成本和收费模式

使用CDN可以减少带宽成本的主要方式包括：

  1. 减少源服务器负载： CDN会缓存网站的静态资源并分发给用户，减轻了源服务器的负载。因为许多用户直接从CDN服务器获取内容，而不是从源服务器获取，所以源服务器的带宽使用量会减少。

  2. 节省网络传输成本： CDN的服务器分布在世界各地，用户可以从距离最近的服务器获取内容。这减少了跨越长距离的网络传输，从而降低了数据传输成本。

  3. 缓存优化： CDN提供商通常会使用缓存技术来优化内容交付。它们会根据用户的需求和访问模式智能地缓存内容，减少了对源服务器的请求，进一步降低了带宽成本。

  4. 带宽费用结构： 某些CDN提供商可能会提供较为灵活的计费方案，例如基于流量的付费模式。这样，用户只需支付实际传输的数据量，而不是整体带宽容量，从而节省了带宽成本。

综上所述，使用CDN可以通过减少源服务器负载、优化网络传输和采用灵活的计费方式等方式来降低带宽成本。

关于第四点，CDN 这种 Web 托管服务一般对传入或传出源服务器的数据收费（这通常称为“带宽”）。如果网站的大部分内容都缓存在 CDN 中，那么需要传入和传出网站主机服务器的数据就会少得多，从而降低带宽成本。

注意，这里说的"带宽"实际上不是实际意义上的带宽。当人们在 CDN 网络托管环境中说"带宽"时，他们真正的意思是“数据传输”，这是往返于网页主机的数据量。

带宽：实际上表示一段时间内可以通过网络上某个点的最大数据量

四、使用或构建CDN

要使用或构建CDN，通常需要以下步骤：

  1. 选择CDN提供商： 选择一家信誉良好的CDN提供商，例如Cloudflare、Akamai或Amazon CloudFront。

  2. 设置CDN： 将网站的静态资源上传到CDN提供商的服务器，并配置CDN以使其知道如何将请求路由到最近的服务器。

  3. DNS设置： 更新网站的DNS设置，以便将网站的域名解析到CDN提供商的服务器。

  4. 测试和优化： 测试CDN以确保它能够有效地提高网站的性能。根据测试结果进行优化，可能需要调整缓存设置或添加更多的CDN节点来覆盖更广泛的地理区域。

通过使用CDN，网站可以实现更快的加载速度、更高的可靠性和更好的用户体验。

上述只是简单的流程，更具体的配置前往不同CDN提供商官网。

五、缓存内容更新策略

CDN把资源放在不同缓存服务器上，是如何实现实时更新的？

关键在于缓存控制机制和内容更新策略。主要有以下几种方法：

5.1 缓存过期和验证

CDN会为缓存的内容设置过期时间，当内容过期时，CDN会向源服务器发送验证请求，检查内容是否已更新。如果内容已更新，CDN会从源服务器获取最新的内容并更新缓存。这个过程称为缓存验证，它确保用户获取到的始终是最新的内容。

5.2 主动刷新和预加载

CDN提供商通常会提供主动刷新和预加载功能，使网站管理员能够手动触发内容的更新。管理员可以通过CDN的管理界面或API发送刷新请求，强制CDN立即更新特定的缓存内容。

5.3 事件驱动的更新

某些CDN提供商支持事件驱动的更新机制，例如当源服务器上的内容发生变化时，CDN可以通过Webhooks或其他方式收到通知，并自动更新相关的缓存内容。

5.4 自动更新策略

CDN可以根据源服务器上内容的更新频率和重要性，自动调整缓存的更新策略。对于频繁更新的内容，CDN可能会采用更短的缓存时间或实时更新策略，以确保用户获取到最新的内容。

综合利用以上方法，CDN能够在保持高性能的同时，实现对缓存内容的实时更新，确保用户能够获取到最新的网站内容。

@PHARAOH
关注
  • 29
    点赞
  • 踩
  • 19
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
asset-cdn:从内容交付网络 (CDN) 提供 Laravel 资产
05-31
从内容交付网络 (CDN) 提供 Laravel 资产 介绍 通过此软件包，您可以向，从选定的CDN推送，同步，删除资产和提供资产，例如，AWS Cloudfront。 它添加了辅助方法mix_cdn()和asset_cdn() 。 简单的说明 >>> env( ' ...
内容分发网络 - Content Delivery Network 学习笔记
SAP 资深技术专家 Jerry Wang 的技术分享
08-31 349
缓存是将文件副本存储在缓存或临时存储位置的过程，以便可以更快地访问它们。从技术上讲，缓存是文件或数据副本的任何临时存储位置，但该术语通常用于指代 Internet 技术。 Web 浏览器缓存 HTML 文件、JavaScript 和图像以更快地加载网站，而 DNS 服务器缓存 DNS 记录以加快查找速度，CDN 服务器缓存内容以减少延迟。 要了解缓存的工作原理，请考虑真实世界的食物和其他补给缓存。 1912 年，探险家罗尔德·阿蒙森 (Roald Amundsen) 从南极之旅返回途中，他和他的手下靠沿途储
unity cdn_企业游戏CDN：一个小时即可开始使用Unity的Cloud Content Delivery
culiao6493的博客
09-18 1044
unity cdnWe’re launching Cloud Content Delivery – a powerful end-to-end content management solution for developers to help you get your game content to the right users at the right time. 我们正在启动Cloud ...
网络协议 18 - CDN：家门口的小卖铺
dianfuquan4988的博客
01-02 108
【前五篇】系列文章传送门： 网络协议 13 - HTTPS 协议：加密路上无尽头 网络协议 14 - 流媒体协议：要说爱你不容易 网络协议 15 - P2P 协议：小种子大学问 网络协议 16 - DNS 协议：网络世界的地址簿 网络协议 17 - HTTPDNS：私人定制的 DNS 服务     到现在为止，我们基本上已经了解了网络协议中的大部分常用协议，对于整个 HTTP 请求...
What is a CDN?
FeelTouch Labs
09-11 685
What is a CDN? A content delivery network (CDN) refers to a geographically distributed group of servers which work together to provide fast delivery of Internet content. A CDN allows for the quick tr...
webpack4-cdn-plugin:上传 webpack 资源到 cdn，允许重命名散列资源
05-31
webpack4-cdn-插件 将您的 webpack 生成的资产上传到 CDN，允许重命名/重新哈希。 要求和重要说明 Node 8+ （支持async/await ）是必需的推荐。 此插件尚未在Windows平台上进行测试。 此插件仅支持webpack@4 。 ...
gulp-qiniu-cdn
05-16
gulp-qiniu-cdn Guiniu的Gulp插件可以上传文件流。安装用安装 npm install --save-dev gulp-qiniucdn用法以下示例将显示gulp-qiniu-cdn的最小用法 var gulp = require('gulp'), qiniuCDN = require('gulp-qiniu-cdn'...
grunt-fetch-from-cdn
07-14
从 CDN 中 grunt-fetch-from-cdn 这个 grunt 插件可以从 CDN 获取单个文件（比如 jquery.js）。 与 bower 不同，它只获取单个文件而不是整个项目。入门这个插件需要 Grunt ~0.4.4 如果您以前没有使用过 ，请务必查看...
aliyun-java-sdk-cdn-2.6.3.jar
01-11
aliyun-java-sdk-cdn-2.6.3.jar
WEB转Flutter基础学习笔记（内含vue和flutter对比）
小易不止于搬砖的博客
05-17 816
笔者是一名web前端，记录在转栈flutter时的学习笔记，内涵和vue的对比，能够辅助前端同学更容易理解flutter
【Web】CISCN 2024初赛 题解(全)
最新发布
uuzeray的博客
05-21 1061
这里注意细节，靶机发了两次请求，第一次我们就返回一个正常的图片，第二次请求就发一个302，php代码块要用html标签包裹。注意下面这段报错，因为加不了引号，开头是数字的话，就会将类型识别为数字，若后续出现了字符串就会报错。再打sqlite，指定tableName，加载写入的恶意so文件，反弹shell。最后注意要将获取的变量元组转字符串，再用逗号分隔，依次输出，从而绕过seed。考的python栈帧沙箱逃逸，获取到外部的栈帧，就可以用。因为ban了引号，考虑hex2bin，将数字转为字符串。
Nodejs util file getpost web express child_process mogodb
ooo
05-18 941
Nodejs util file getpost web express child_process mogodb
Web Speech API（2）—— SpeechSynthesis
LiangRZ
05-21 453
Web Speech API 有两个部分：SpeechSynthesis 语音合成（文本到语音 TTS）和 SpeechRecognition 语音识别（异步语音识别）。语音合成 (也被称作是文本转为语音，英语简写是 tts) 包括接收 app 中需要语音合成的文本，再在设备麦克风播放出来这两个过程。其中包含了将由语音服务朗读的内容，以及如何朗读它（例如：语种、音高、音量）。语音合成服务的控制器接口，可用于获取设备上可用的合成语音，开始、暂停以及其他相关命令的信息。控制器，从而获取语音合成功能的入口。
前端-移动端布局
Kongfutu的博客
05-21 178
可以在浏览器里打开检查 点击一下移动端按钮 然后选择一下对应的手机型号可以切换到对应的手机端。进阶学习建议 Vue.js 和 微信小程序。如何在PC端模拟移动端设备。
springboot+vue2+elementui实现时间段查询
2301_76604664的博客
05-20 407
将前端传来的时间数组，赋值给对应的属性；
【VueRouter 的基本使用】
2302_76611599的博客
05-17 253
完成Vue Router 安装后，就可以使用路由了，路由的基本使用步骤，首先定义路由组件，以便使用Vue Router控制路由组件展示与 切换，接着定义路由链接和路由视图，以便告知路由组件渲染到哪个位置，然后再项目中创建路由模块，最后导入并挂载路由模块。为了在页面中将路由对应的组件显示出来，还要在App组件中定义路由视图。路由视图标签定义，该标签会被渲染成当前路由对应组件，另外，为了方便在不同组件之间切换，可以通过标签定义路由链接，该标签的to属性表示链接地址，与路由匹配规则中的path属性对应。
性能监控系统搭建——node_koa实现性能监控数据上报（第一章）
编程知识分享，主打前端
05-19 812
大家好，我是yma16，本文分享node_koa实现性能监控数据上报（第一章）。为了实现前端性能耗时的数据监控，前端对外发布js的sdk，sdk的功能主要是性能耗时计算和数据上报。同时使用vue3和node开发一个数据监控的后台管理系统，主要功能是展示数据，提供一个api_key和token对外暴露的api接口去添加数据监控数据。对外暴露性能上报接口，用户通过api_key请求上报数据到后台。
笔记：前端知识梳理
weixin_46691179的博客
05-17 233
让JavaScript能够在目标机器上能够正常运行的一种实现方式，浏览器不同，JavaScript引擎的实现也不同，如：谷歌的v8、火狐的spidermonkey、IE的chakra、Edge的chakracore。：在v8引擎的基础上又新增了很多js库，换句话说：Node.js内置了自身实现的js变量和函数，功能类似C/C++的标准库。：脚本语言的标准，不同版本的标准称为ESx，如：ES5、ES6。：对ES标准的一种实现，ES标准的其他实现还有JScript。：Node.js的包（库）管理工具。
vite-plugin-cdn-import包的使用
05-21
vite-plugin-cdn-import 是一个 Vite 插件，用于将第三方依赖库从 CDN 引入到你的项目中，从而加速页面加载速度。以下是使用该插件的步骤： 1. 安装依赖 ```bash npm i vite-plugin-cdn-import -D ``` 2. 在 vite.config.js 中配置插件 ```javascript import { defineConfig } from 'vite' import vue from '@vitejs/plugin-vue' import cdnImport from 'vite-plugin-cdn-import' export default defineConfig({ plugins: [ vue(), cdnImport({ // 配置需要从 CDN 引入的依赖库 libs: [ { name: 'vue', var: 'Vue', path: 'https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.min.js' }, { name: 'element-plus', var: 'ElementPlus', path: 'https://unpkg.com/element-plus/lib/index.full.js' } ] }) ] }) ``` 3. 在 HTML 模板中使用引入的依赖库 ```html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>My App</title> <!-- 引入样式文件 --> <link rel="stylesheet" href="https://unpkg.com/element-plus/lib/theme-chalk/index.css" /> </head> <body> <div id="app"></div> <!-- 引入脚本文件 --> <script src="/@modules/vue"></script> <script src="/@modules/element-plus"></script> <script src="/src/main.js"></script> </body> </html> ``` 4. 在代码中使用引入的依赖库 ```javascript import { createApp } from 'vue' import App from './App.vue' // 使用从 CDN 引入的 Vue const app = createApp(App) app.mount('#app') // 使用从 CDN 引入的 Element Plus const elButton = new ElementPlus.Button() elButton.$mount('#elButton') ``` 这样就可以使用 vite-plugin-cdn-import 插件将第三方依赖库从 CDN 引入到你的项目中了。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值