Cloudflare：利用 Workers KV 将 cdnjs 迁移到无服务器

小提示：您能找到这篇{Cloudflare：利用 Workers KV 将 cdnjs 迁移到无服务器}绝对不是偶然，我们能帮您找到潜在客户，解决您的困扰。如果您对本页介绍的Cloudflare：利用 Workers KV 将 cdnjs 迁移到无服务器内容感兴趣，有相关需求意向欢迎拨打我们的服务热线，或留言咨询，我们将第一时间联系您！

< ">Cloudflare为cdnjs提供支持，这个开源项目通过利用Cloudflare的网络提供流行的JavaScript库和资源，从而给网站加速。自12月发布重要更新以来，我们专注于改造cdnjs以实现可扩展性和弹性。今天，我们很高兴宣布Cloudflare如何利用Cloudflare Workers以及它的键值存储Workers KV来交付cdnjs（迁移到无服务器基础架构）！

< font-size: 16px;">什么是cdnjs？

< font-size: 16px;">

< font-size: 16px;">对于感觉陌生的人来说，cdnjs是一个描述面向JavaScript（JS）的内容交付网络（CDN）的首字母缩写词。CDN是一个由地理上分散的服务器构成的网络，主要用于提供互联网内容，不论这些内容是回忆、小猫视频还是HTML网页。而本文所说的CDN是指Cloudflare那个由200多个分布于全球的数据中心构成并且依然在不断壮大的网络。

< font-size: 16px;">这与您相关的原因在于：它使页面加载时间快如闪电。您访问的每个网站基本上都需要获取JS库才能加载，也包括本网站。假设您要一个位于悉尼的网站，它包含一个来自jQuery的本地文件。jQuery是一个流行的库，可见于76.2%的网站。如果您位于纽约，那么可能会注意到一个延迟，因为获取这个文件所需的时间轻易会超过300ms，更不用说TLS握手涉及的往返时间了。不过，如果该网站使用cdnjs.cloudflare.com来引用jQuery，您可以从Cloudflare距您最近的布法罗数据中心检索这个文件，将延迟缩短到闪电般的20ms。

< font-size: 16px;">尽管cdnjs在幕后运作，但有超过11%的网站使用它，使互联网变得更加快速、更加可靠。在7月份，cdnjs服务了将近1900亿个请求，涉及的数据量达到了3.46PB。

< font-size: 16px;">文件存储在哪里？

< font-size: 16px;">cdnjs加快了互联网速度，凭借的当然不是魔法！

< font-size: 16px;">在过去，C危机公关 陈先红loudflare某个核心数据中心的若干负载均衡服务器会定期从后备存储中提取cdnjs文件，充当cdnjs.cloudflare.com的源站。有人请求了新文件时，Cloudflare会将它缓存，从而能够从我们的任何数据中心快速获取到这个文件。

< font-size: 16px;">后备存储是JS、CSS和其他Web库的目录，采用开源GitHub存储库的形式。这意味着，包括您在内的任何人都可以出力贡献，但要经过审核和其他流程。

< font-size: 16px;">然而，到最近为止，这些现有操作还是劳动密集型的，并且比较脆弱。

< font-size: 16px;">这篇博客帖子将解释为什么我们改变cdnjs背后的基础架构，以使其更快速、更可靠，并且更容易维护。首先，我们将讨论社区过去如何为cdnjs做出贡献，同时概述旧系统的痛处和问题。接着，我们将探讨迁移到Workers KV的好处。然后，我们将深入解析新架构，以及对网站和cdnjs API的升级。最后，我们将回顾cdnjs的历史，并且展望它的未来。

< font-size: 16px;">如果认为自己知道如何提交PR，请再思考

< font-size: 16px;">

< font-size: 16px;">对于非技术读者，拉取请求（PR）是一种用来合并您对存储库所做更改的请求。往常的话，如果您想将自己的JavaScript库包含到cdnjs中，首先要在GitHub上创建对cdnjs/cdnjs的PR，附上一个描述您的程序包的JSON文件以及您想包括的任何版本的其他文件。在您的PR获得我们旧版机器人的批准，通过了人工审核，并且被维护人员合并后，您的程序包就与cdnjs集成在一起了。

< font-size: 16px;">貌似很简单，对吧？只要复刻存储库，克隆一下并复制粘贴几个文件，不是吗？

< font-size: 16px;">没错。如果您有几个小时的时间来刻录一个区分大小写的文件系统，并且有几百GB的可用磁盘空间来git clone 300GB的存储库，那么贡献很简单。时间不够也没问题，您随时可以利用高阶的git sparse-checkout知识来完成这项工作。不懂git？只需通过GitHub的UI逐个添加文件便可。

< font-size: 16px;">我猜您想到点上了。我当然知道，我可是天真地花了10个小时克隆存储库，结果却发现macOS默认为不区分大小写。

< font-size: 16px;">但是，更新cdnjs不仅对贡献者来说很困难，对维护人员来说也不容易。在过去，社区能够直接贡献版本文件，这些文件有可能是恶意的。这给维护人员带来许多工作，他们需要手动检视每个文件，与官方库源文件进行比较，并运行恶意软件检查。

< font-size: 16px;">那么，程序包在cdnjs中后如何更新？在描述每个程序包的JSON文件中，有一个可选的自动更新定义，它会告诉机器人在哪里寻找库的新版本。如果存在这个定义，那么您的程序包从npm或GitHub发布新版本时，机器人会下载新版文件，并推送至cdnjs/cdnjs，同时将计算的子资源完整性（SRI）哈希推送到cdnjs/SRIs。如果缺少自动更新属性，那么您要负责手动提交PR，从而用任何新的版本更新cdnjs。

< font-size: 16px;">cdnjs的警示

< font-size: 16px;">今年4月，在维护我们一个核心数据中心的过程中，技术人员不慎断开了一些电缆，它们提供了连到我们其他数据中心的所有外部连接，因此导致该数据中心离线约四个小时。这个事故是向cdnjs发出的第一个警示，特别是因为受影响的数据中心承载了主要的cdnjs源站Web服务器。在这一事件中，我们确实有在外部提供商那里运行的备份，但真正救了我们的是Cloudflare的全球缓存，它最大程度地减少了停机的影响，只有未缓存的资产才无法加载。

< font-size: 16px;">我们开始思考如何才能改进cdnjs服务的可靠性和性能。目光直接投向了Cloudflare Workers这个我们自己为边缘网络上开发提供的平台。Workers内置了功能强大的工具Workers KV，它是一个针对高读取应用程序进行了优化的低延迟、全球分布的键值存储。

< font-size: 16px;">我们通过推理发现，不用拉取cdnjs/cdnjs存储库并从磁盘提供文件，而可以彻底告别物理服务器，将数据分布到全球并直接从边缘提供文件。这样，cdnjs将能够从任何原始数据中心故障中恢复，同时还可以提高其可扩展性。

< font-size: 16px;">Workers KV前来拯救

< font-size: 16px;">

< font-size: 16px;">乍一看，决定使用Workers KV是件明摆着的事。既然cdnjs中的文件永不更改，但需要频繁读取，那么Workers KV就非常适合。

< font-size: 16px;">但是，在计划迁移时我们开始担心，cdnjs中的资产数量有700万多，无疑会存在超过Workers KV 10MiB限值的文件。经过调查，我们发现数百个cdnjs文件大小超限，其中大多数是JavaScript源映射。

< font-size: 16px;">后来，我们想到了一个主意。将Cdnjs文件的压缩版本存储在Workers KV中，这不仅能解决文件大小超限问题，还可优化文件的服务方式。

< font-size: 16px;">如果您支付过互联网账单，就会知道带宽有多么昂贵！因此，所有现代浏览器都会尽可能获取压缩的Web内容。同样在Cloudflare，我们经常试验通过即时压缩来减小我们的带宽，只要被接受，我们就将压缩后的内容提供给浏览者。结果，我们决定提前压缩所有cdnjs文件，并将它们以最佳的Brotli和gzip形式写入Workers KV。这样，我们可以使用比即时压缩时更高的压缩级别，因为不再有延迟方面的要求。

< font-size: 16px;">如此一来，我们可以更快的速度提供更小的cdnjs文件！

< font-size: 16px;">全面改造cdnjs

< font-size: 16px;">

< font-size: 16px;">现在，如果您要将自己的JavaScript库包含在cdnjs中，首先在GitHub上创建一个对我们新存储库cdnjs/packages的PR。这个存储库很容易克隆，大小仅为50MB，由数千个JSON文件构成，各自描述一个cdnjs程序包并说明如何从npm或git自动更新。当您的文件获得我们新版自动CI的验证（由新版机器人提供支持），并由维护人员进行合并后，您的程序包就会自动登记到我们的自动更新服务中。

< font-size: 16px;">新系统优先考虑了安全性和可维护性。首先，cdnjs版本文件由我们的机器人创建，最大程度降低了合并新版本时出现人为错误的可能。虽然JSON文件是由易错的人类添加到cdnjs/packages中的，但会经过机器人的检查，然后再由维护人员审批。每个文件都会对照JSON架构自动验证，另外也会检查在npm或GitHub上流行程度。

< font-size: 16px;">当机器人发现新版本时，它会将文件的Brotli和gzip压缩版本推送到Workers KV中的文件命名空间。对于每个条目，机器人会在Workers KV中写入一些元数据，用于ETag和Last-Modified HTTP标头。与之前类似，机器人也会计算未压缩文件的子资源完整性（SRI）哈希，但现在将它们推送到Workers KV中的SRI命名空间。

< font-size: 16px;">然后，有人从cdnjs.cloudflare.com请求新文件时，Cloudflare Worker会检查客户端的Accept-Encoding标头，并从Workers KV中获取Brotli或gzip压缩版本及其ETag和Last-Modified元数据。当压缩文件通过Cloudflare返回时，它将缓存下来以备日后请求时使用，同时也根据需要即时解压缩。

< font-size: 16px;">目前，仍有少数文件超过了Workers KV的大小限制。因此，如果Cloudflare Worker未能从Workers KV检索到文件，它会从原始git存储库支持的源站中获取文件。在接下来几个月中，我们计划逐步移除此基础架构。

< font-size: 16px;">扩展网站和API

< font-size: 16px;">除了核心cdnjs基础架构之外，它的许多其他组件也得到了升级！

< font-size: 16px;">在cdnjs项目的主页上，您会看到一个漂亮的新Beta网站。这个Beta网站由Matt开发，采用了Vue和Nuxt，全部通过cdnjs API提供支持。因此，它始终会更新最新的程序包信息，而且为网站服务时需要使用的资源也较少（加载第一页之后完全在客户端一侧运行），这有助于我们随着cdnjs的不断成长而扩展。

< font-size: 16px;">实际上，cdnjs API也从采用无服务器架构中获益，加强了可扩展性，这个架构与我们在cdnjs和Workers KV中看到的非常接近。

< font-size: 16px;">在迁移到Workers KV之前，cdnjs API依赖于一个定期计划的流程，这个流程会生成大约300MB元数据。然后，cdnjs API的后端会将这个巨大的“package.min.js”文件提取到内存中，并使用它来运行该API。如果您好奇的话，该文件仍托管在此处，但请注意，它可能会拖累您的浏览器！同样，文件SRI推送到了cdnjs/SRIs，由API在本地克隆以服务SRI响应。

< font-size: 16px;">在所有cdnjs文件（在允许的大小限制内）转移到Workers KV之后，这些旧流程变得不可持续，因为需要数百万次读取和不合理的时间。因此，我们决定将找到的所有元数据上传到Workers KV中。我们将元数据分拆到四个名称空间中：一个用于程序包级元数据，一个用于版本特定元数据，一个包含聚合元数据，另一个则用于文件SRI。

< font-size: 16px;">与cdnjs的无服务器设计类似，Cloudflare Worker驻留在metadata.speedcdnjs.com上，使用多个公共端点推进精准营销来提供Workers KV中的数据。目前，cdnjs API已经和这些端点完全集成，能够随着cdnjs的继续扩展而提供优雅的解决方案。

< font-size: 16px;">公开透明和cdnjs的未来

< font-size: 16px;">自2011年1月诞生以来，cdnjs一直深深扎根于公开透明，从社区汲取力量。即使cdnjs在规模上暴增，并且其创始人Ryan Kirkman和Thomas Davis与我们在2011年6月确立合作关系后，这个项目依然在GitHub保持完全开源。

< font-size: 16px;">随着时间流逝，创始人越来越难以保持活跃，因此这个项目重度依赖于社区的支持。由于几乎没有任何预算，对存储库的访问也极少，核心cdnjs维护人员每天都面临着项目存续的挑战。

< font-size: 16px;">去年，这样的局面促使我们联系了创始人，他们愉快地接受了我们对项目的协助。随着Cloudflare发挥更大的作用，cdnjs变得与往常一样稳定，拥有来自Cloudflare和社区的多位活跃成员。

< font-size: 16px;">但是，由于我们不再依赖旧系统，而且也将文件存储到了Workers KV中，人们开始担心cdnjs日后会转变为专有性质。不用担心，我们正在努力确保cdnjs保持尽可能透明和开源。为了帮助社区审核对Workers KV的更新，我们建立了一个新的存储库cdnjs/logs，供机器人用于记录所有与Worker KV相关的事件。此外，任何人都可通过从cdnjs API提取SRI来验证cdnjs文件的完整性。

< font-size: 16px;">结论

< font-size: 16px;">总体而言，去年对cdnjs来说是一个动荡的时期，但所有缺点成为了帮助我们构建更好系统的警示信号。最近，我们将免费的推广cdnjs迁移到了无服务器基础架构，并将它的文件存储在Workers KV中，缓解了依赖于单一位置上物理服务器的风险。

< font-size: 16px;">今天，cdnjs运作良好，不会在短期内消失。在此，我们向维护人员Sven和Matt表示感谢，谢谢他们给予这个项目巨大的力量，处理从扩展cdnjs到编辑这篇帖文等一切工作。

< font-size: 16px;">展望未来，我们会致力于使cdnjs尽可能公开透明。在继续改进cdnjs的过程中，我们也会发表更多帖文，让社区掌握最新的消息。如果您有兴趣，请订阅我们的博客。毕竟，是社区造就了cdnjs！特别感谢我们活跃的GitHub贡献者和cdnjs社区论坛成员，感谢你们一直与我们同甘共苦！