Cloudflare真好玩

在nisama强烈的推荐下我怀着好奇的心态开始了cloudflare的疯狂踩坑，无非是这一个月挺多了nisama关于‘啊无服务器实在是太爽啦’，‘白嫖真爽啊’，‘嗯，白嫖下次还白嫖’，Cloudflare（NYSE：NET）是一家总部位于旧金山的美国跨国科技企业，以向客户提供基于反向代理的内容分发网络（Content Delivery Network, CDN）及分布式域名解析服务（Distributed Domain Name Server）为主要业务。利用 Cloudflare 全球任播网络，Cloudflare可以帮助受保护站点抵御包拒绝服务攻击等网络攻击，确保该网站长期在线，同时提升网站的性能、加载速度以改善访客体验。嗯cloudflare是最富盛名的cdn服务商，不过虽然它很香但抵不住它贵啊，cloudflare上很多体验良好的服务都是收费的，当然一提到cdn最优秀的服务商当然是cloudflare（？当然对于cloudflare上提供的免费cdn当然没有逃过可爱的勤劳的中国人民撸羊毛的机会，于是你会简单不管是网站，各种稀奇古怪的应用甚至是各种梯子都在用cloudflare做CDN，毕竟入口带宽也是有限的，这就导致在用网高峰期甚至是日常使用的响应速度不尽如人意，当然也是因为毕竟也是国外的节点啦，下图为我2021年3月8日的测试结果。

ping 1.1.1.1

1.1.1.1是一款免费的域名解析服务，也就是域名服务器，由CloudFlare与APNIC共同拥有与维护。该服务于2018年4月1日发表启用且被Cloudflare称为“互联网最快、以隐私优先的消费者端DNS服务”（the Internet’s fastest, privacy-first consumer DNS service）

当然做为一个正经人我并没有怎么薅过cloudflare的羊毛，当然让我对cloudflare直呼真香的也并他们的cdn而是他们的Cloudflare Workers！！不过在疯狂踩坑之前有必要了解一下和Cloudflare Workers有关的无服务器计算

关于这点我想cloudflare的文档提供了详细的解释

无服务器计算是一种按需提供后端服务的方法。无服务器架构允许用户编写和部署代码，而不必担心底层基础设施。从无服务器提供商获得后端服务的公司将根据其计算量来付费，而不必保留和支付固定数量的带宽或服务器，因为该服务可自动扩展。请注意，尽管称为无服务器，但它仍使用了物理服务器，只是开发人员不需要考虑它们的存在。

在Web早期，任何想要构建Web应用程序的人都必须拥有运行服务器所需的物理硬件，这是一项繁琐而昂贵的工作。

之后是云，可以远程租用固定数量的服务器或一定数量的服务器空间。租用这些固定服务器空间单元的开发人员和公司通常会过度购买，以确保流量或活动的激增不会因为超过每月限额而中断其应用程序。这意味着通常支付的大部分服务器空间都浪费了。云供应商已经引入了自动扩展模型来解决该问题，但是即使是自动扩展，也可能因为恶意活动激增（例如 DDoS 攻击）而产生非常昂贵的成本。

无服务器计算允许开发人员在灵活的“按需付费”的基础上购买后端服务，这意味着开发人员仅需为使用的服务付费。这就像从每月固定限额的手机数据套餐切换到只为实际使用的每个字节数据收费的套餐一样。

“无服务器”一词在某种程度上具有误导性，因为它仍然有服务器提供这些后端服务，但是所有服务器空间和基础设施问题都由提供商处理。无服务器意味着开发人员可以完全不用担心服务器。

什么是后端服务？前端和后端之间有什么区别？

应用程序开发通常分为两个领域：前端和后端。前端是用户看到并与之交互的应用程序部分，例如视觉设计。后端是用户看不到的部分。其中包括应用程序文件所在的服务器以及持久存储用户数据和业务逻辑的数据库。

![

例如，我们可以想象一个卖音乐会门票的网站。当用户在浏览器窗口中键入请求时，浏览器会将请求发送到后端服务器，后端服务器以网站数据作为响应。然后，用户将看到网站的前端，该前端将包括文本、图像和供用户填写的表单字段。然后，用户可以与前端上的表单字段之一进行交互，以搜索他们喜欢的音乐表演。当用户单击“提交”时，这将触发另一个对后端的请求。后端代码检查其数据库，以查看是否存在具有该名称的表演者，如果存在，则会反馈下次表演的时间以及有多少可售的票。然后，后端会将数据传递回前端，前端将以用户能理解的方式显示结果。同样，当用户创建一个帐户并输入财务信息以购买票时，前端与后端之间将发生另一次来回通信。

无服务器计算可以提供什么样的后端服务？

大多数无服务器提供商都为其客户提供数据库和存储服务，并且许多无服务器提供商还具有功能即服务（FaaS）平台，例如 Cloudflare Workers。这些平台可以在不存储任何数据的情况下在边缘执行代码。

无服务器计算的优势是什么？

  • 降低成本 – 无服务器计算通常具有很高的成本效益，因为传统的后端服务（服务器分配）云提供商经常导致用户为未使用的空间或空闲的 CPU 时间付费。
  • 简化可扩展性 – 使用无服务器架构的开发人员不必担心扩展其代码的策略。无服务器供应商可按需处理所有扩展。
  • 简化后端代码 – 使用 FaaS，开发人员可以创建简单的功能，这些功能独立地执行单个目的，例如进行 API 调用。
  • 加快周转时间 – 无服务器架构可以大大缩短产品上市时间。开发人员无需通过复杂的部署过程实施错误修复和新功能，而是逐个添加和修改代码。

Cloudflare Workers 是什么？

Cloudflare Workers 是一个平台，用于使无服务器功能尽可能接近最终用户运行。本质上，无服务器代码本身是“缓存”在网络上的，并在收到正确类型的请求时运行。Cloudflare Workers 是根据 service workers API 用 JavaScript 编写的，这意味着它们可以使用 service workers 提供的所有功能。它们利用 Chrome V8 引擎执行。Cloudflare Workers 代码托管在 Cloudflare 遍布全球的庞大数据中心网络中。

Chrome V8，也称为“ V8”，是 Google 为编译、优化和执行 JavaScript 开发的 JavaScript 引擎。使用 V8 进行 JavaScript 代码执行，可大大减少 JavaScript workers 的启动时间，因此消除了大多数情况下的“冷启动”问题。V8 还进行了详细的安全漏洞分析，因此是安全运行 JavaScript 代码的理想选择。

什么是无服务器 JavaScript？

无服务器 JavaScript 是包含全部或部分应用程序的 JavaScript 代码，仅在请求时运行，不在专有服务器上托管。它使开发人员能够构建在网络中运行的高性能、低延迟的无服务器应用程序，并避免了许多与其他无服务器应用程序相关的问题，例如冷启动。

无服务器 JavaScript 托管在边缘网络中或由 HTTP 缓存服务托管，后者存储内容以快速响应 HTTP 请求。开发人员可以编写和部署处理 HTTP 请求的 JavaScript 函数，在处理后再将请求一直传递到源站。

使用无服务器 JavaScript，可以通过在边缘运行代码来扩展现有应用程序的功能并改善用户体验，或者创建一个快速且高度可扩展的、全新的、完全无服务器的应用程序。Cloudflare Workers 就是无服务器 JavaScript 平台。

边缘计算是一种致力于使计算尽可能靠近数据源、以减少延迟和带宽使用的网络理念。简而言之，边缘计算意味着在云端运行更少的进程，将这些进程移动到本地，例如用户的计算机、IoT 设备或边缘服务器。将计算放到网络边缘可以最大程度地减少客户端和服务器之间必须进行的长距离通信量。

什么是 Varnish？

Varnish 是一个 Web 加速器，旨在加速 Web 应用程序并提高网站性能。它是一个缓存 HTTP 反向代理 ，这意味着它位于任何 Web 服务器的前端，并通过缓存或存储 Web 客户端经常请求的任何内容来加速往返于该服务器的 HTTP 流量。将 Varnish 配置语言（简称 VCL）与 Varnish 结合使用，开发人员就可以自定义 Varnish 如何管理 Web 请求。

在无服务器架构中使用 JavaScript 代替 VCL 有什么优势？

VCL 是一种配置语言，旨在使 Varnish 缓存易于配置；它不是一种成熟的编程语言。VCL 不够灵活，无法构建或扩展强大的应用程序。与 JavaScript 相比，它的功能有限。此外，VCL 不在 Varnish 实施之外使用，因此大多数开发人员都不熟悉 VCL。而 JavaScript 则应用广泛，并且已经广泛用于构建应用程序。在无服务器架构中使用 JavaScript 可使开发人员以他们熟悉的语言构建完整的应用程序。

无服务器 JavaScript 使更广泛的开发人员群体能够利用边缘上的无服务器计算，并允许这些开发人员构建更多种类的应用程序。

为什么使用无服务器 JavaScript 构建应用程序可以减少延迟？

无服务器 JavaScript 在 HTTP 缓存网络中运行，该网络比源站上托管的代码更接近最终用户。因此，请求不必一路传递到源站再一路回传，应用程序对用户交互的响应速度更快。缓存网络在地理上分布的边缘位置越多，延迟时间就越短。

无服务器 JavaScript 何时运行？

在无服务器模型中，应用程序被分解为函数，并且函数代码在响应某些事件时运行，在其他情况下不会运行。触发无服务器 JavaScript 执行的事件是 HTTP 请求。开发人员可以自定义其 JavaScript 函数响应的 HTTP 请求的类型，以及如何更改或实现 HTTP 请求。

什么是 HTTP 缓存？

HTTP 缓存是指服务器或浏览器保存对用户 HTTP 请求的响应的副本，以便更快答复以后的请求。CDN 服务器就是 HTTP 缓存的例子。一些 HTTP 缓存服务使开发人员可以自定义 HTTP 缓存如何为其应用程序运行。

Cloudflare 是一个 HTTP 缓存边缘网络，其中包含遍布世界各地的数据中心，它允许开发人员在网络边缘编写和部署自己的 JavaScript。在 Cloudflare 网络中，HTTP 缓存不在任何特定服务器中进行，而是在最接近 HTTP 请求来源的数据中心内进行。

与 service workers 相比，Cloudflare Workers 有何独特之处？

使用 Cloudflare Workers 和使用 service workers 的一个主要区别是，service workers 是在客户端运行的，必须由用户的浏览器下载，而 Cloudflare Workers 在 Cloudflare 网络的边缘运行，介于用户和 Internet 的其余部分之间，有效地在网络内部运行。

什么是 service workers？

Service workers 是浏览器下载并运行以为用户创建自定义体验的脚本。Service workers 使在浏览器中实现推送通知、后台同步和脱机运行等功能成为可能。它们使用 JavaScript 编写，可以在 HTTP 请求到达 Internet 之前拦截、修改和响应请求。

Service worker 可以通过两种方式处理 HTTP 流量：

Service workers 可以响应 HTTP 请求而无需联系 Web 服务器

Service workers 可以修改 HTTP 请求和响应

cloudflare worker使用教程

没有比官方文档更加详细的东西了，cloudflare文档本身内容就非常的详实，所以只需要仔细阅读cloudflare文档就能非常轻松的达到上手的程度，另一方面cloudflare worker本身使用就非常的简单，官方提供了多种语言可以供编写，JavaScript，rust，c，c++，python等等，所以对于绝大部分使用者来说语言都不会成为他们的障碍，当然官方首推是是JavaScript。

关于额度问题

关于这点我的回答是完全够用，

  • 每天免费提供100000个请求

  • 每天 100,000 次读取操作

  • 每天 1,000 次写入、删除、列出操作

  • 提供大概1GB的kv储存空间

另外付费版也就每月5dollar啦（，但是对于个人使用来看免费额度已经非常非常够用了，其次主要还是白嫖能带来满满的满足感（一拳一个白嫖怪）。

hello cloudflare worker

接下来我们可以基于以上来写一个非常非常简单的栗子。

API

比如说我们现在想要写一个每日可以返回bing壁纸的动态api，首先我们需要获取bing壁纸的url，打开f12就能很简单的获取到壁纸链接，这里我们就直接粗暴的直接打开worker，当然你也可以按照官方文档安装Workers CLI，按照官方的步骤一步一步的来，这里仅仅进行一个非常简单的演示，我们很容易就能编写到以下代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
async function handleRequest(request) {
    const req = request
    const urlStr = req.url
    const urlObj = new URL(urlStr)
    const path = urlObj.href.substr(urlObj.origin.length)
    const domain = (urlStr.split('/'))[2]
    let day = 0
    let destinationURL = ""
    try {
        if (path.startsWith('/bing')) {
            let day = urlObj.searchParams.get('day')
            const destination = await JSON.parse(await (await fetch(`https://cn.bing.com/HPImageArchive.aspx?format=js&idx=${day}&n=1`)).text())["images"][0]["url"]
            destinationURL = `https://cn.bing.com/${destination}`
            return fetch(destinationURL)
        } finally{
            console.log("error")
        }

这里的fetch()是 XMLHttpRequest 的升级版，用于在 JavaScript 脚本里面发出 HTTP 请求。

然后直接吧这段代码粘贴到worker里面就行啦

创建worker的时候会自动分配一个子域名，当然支持自定义域名，具体请参考文档

然后访问子域名/bing就好啦，可以看到状态码是200，这里我的子域名是https://empty-credit-b440.youmingsama.workers.dev/ 于是就可以得到https://empty-credit-b440.youmingsama.workers.dev/bing 就得到了我们想要的图片啦

于是下面几个api，实现几乎的原理和bing大同小异

cloudflare大法好

worker加上kv储存可玩性可拓展性非常强，这里演示的API仅仅是一种最简单的使用方法，不仅仅是网站，各种快速搭建的应用，cloudflare更让我们看到了无限的可能。

所以白嫖大法好