生成一个有趣的链接
前言
前两天上网冲浪发现了一个有趣的项目 ooo ,这个项目的有趣的地方在于可以将你的一个链接重新编码为一个全是 “o”的新链接,你可以将这个链接发给别人整蛊一下。虽然说这个项目实际来说意义不大,但是本着好奇他妈给好奇开门(bushi)的精神,我还是想自己部署一个玩一玩,于是就有了这篇文章,于是又诞生了一个全是 e 的站点 eeeeeeeeeeee.ee。
域名
既然是一个小的 web 服务,还是一个基于域名跳转的 web 服务,这个域名选择就相当重要了,我直接跳过读源码阶段就准备先拿下一个域名,需求很简单,全都是一个字母就行,然后统计了一下目前已知顶级域后缀相同的有 .ooo(infibeam注册局)
、.ee(爱沙尼亚)
、.cc(可可群岛)
、.gg(格恩西岛)
、.tt(特立尼达和多巴哥)
、.bb(巴巴多斯)
、.xxx(用于成人网站)
。我之前的个人域名就是 ee 后缀的,所以我先去看了下 ee… ee. ee 这个域名,在输入 12 个 e 的时候终于是可以用了,也去看了下别的几个都是前缀 15 个字母起步,而且价格还不便宜,所以还是选择了 ee 后缀的,主要是便宜,一年 69 人民币确实香。于是下单了 eeeeeeeeeeee.ee 。
部署
读源码
在简单读了一下 ooo 的源码后,大概实现过程是先在前端将给定的 URL 编码为一个特殊的字符串,并能够将这个特殊的字符串解码回原始的 URL。编码过程使用了一种基于特殊字符 “o” 的表示法,将 URL 编码成包含四种不同 “o” 字符的字符串。后端仅通过 Cloudflare Worker 服务,将经过 OOO 编码的 URL 重定向到原始的 URL。在处理请求时,该 Worker 会将请求的 URL 中的路径部分解码,并将其作为经过 OOO 编码的字符串传递给 OOO 类的 decodeUrl 方法进行解码。解码后得到的字符串即为原始的 URL,然后使用 Cloudflare 的 Response.redirect 方法将请求重定向到原始的 URL。
读了源码其实我才发现,原来那些 o 并不是全部相同的 o,而是 4 个同形字符,四个不同的 “o” 字符(对应不同的 Unicode 编码)。
同形字符
所以现在我需要去找几个 e 的同形字符,幸运的是有人整理过相关内容的文章,这里不得不感慨下光计算机字符里的学问还挺多的,前几天刚看到一个将用户名无形地插入到具有零宽度字符的文本中的文章,也很有意思,有兴趣的朋友可以去看看。这里我选择了0065,0435 : eе 和0275,04E9 : ɵө 虽然后面两不太像,但也凑合。
前端页面
将项目克隆到本地,前端页面其实要改的也不多,将 ooo.js
里的 OOO 对象里的四个“o”的字符换成我们自己的其实前端服务就能正常跑了,剩下就是改一些相应的内容样式。这里唯一需要注意的是,我们需要务必需要修改 currVer = "eeee"
改值为与你域名字母相同,这是一个前缀用来我们后端进行路由识别,我们修改完成后将其上传到 Cloudflare Pages 服务中部署,并且绑定自定义域名为你购买的同字母域名(需提前将域名转入 Cloudflare)。
后端服务
前文有说到项目的后端服务是部署在 Cloudflare Worker 上的,后端涉及的代码为 worker.js
,在 Cloudflare 控制面板左侧选项中,找到 Workers 和 Pages 新建一个 Workers 并将 worker.js
中的代码粘贴到点击 Worker 设置面板快速编辑按钮后出现的页面中。此步务必需要注意粘贴的代码中的解码对应的字符需要与前端编码字符对应,自行修改。修改完成点击设置面板的触发器选项,在路由处添加一个路由用来解析 URL,示例如下:
现在你可以去访问你的域名看看出现编码后的链接能否跳转到目标地址了。如果不能正常跳转,可能是你的域名没有开启 Cloudflare CDN,也就是那朵小黄云我们需要打开,因为 worker 的自定义路由跳转需要先通过 CDN 劫持到访问的链接,不然是不可用的。
Just enjoy it!