背景:

2021 年 12 月 20 日,jsDelivr 团队主要负责人 Dmitriy Akulov 在 官方 GitHub 仓库发布说明。jsDelivr 的 ICP 被吊销,短时间内,无法也不会提供基于国内节点的托管服务。现在 jsDelivr 国内线路也是从国外绕的,这令在中国大陆地区的速度相较于此前慢了很多。

许多人发现了 jsDelivr 在速度、同步等方面的巨大优势,开始滥用,甚至托管魔法安装脚本。到后来 jsDelivr 更新了它的可接受使用政策(AUP),但滥用者是不会理睬的。在一个提供国内网络加速的开源 CDN 上托管某些【不可描述】的脚本,则是一种更加不负责任的表现。此外还有各种原因的加持下,jsDelivr 备案被吊销,国内 CDN 提供商移除其账号。

现在 jsDelivr 又可以正常访问了,网站 Ping 出来黄绿相间,但速度仍然较慢,且说不准什么会不会再寄,因为滥用者不会管那么多,只管满足一己之利。


前言

由于 jsDelivr 被吊销 ICP ,如今虽恢复但仍存在不稳定的风险;然而这个平台是很不错的,例如有些引入项目,它的源更新比较全且及时。网上找了许多替代品,可要么更新不及时,要么稳定性不高……

保险方法是更换 CDN,可现在我手头已经有个域名了,何不尝试给其套上一层反向代理?

准备工作

  • Cloudflare 账户
  • 域名(由于.worker.dev域名也受到了和 jsDelivr 类似的遭遇,故需自备域名)

注:理论上该方法适用于任意网站。

做法

登录到 Cloudflare 控制台,点击侧栏的Workers 和 Pages进入概述,点击创建应用程序蓝色按钮。进入后点击创建 Workers。部署”Hello World”脚本页面,可自行设置名称,设置完后拉到最下方找到部署按钮并点击。如果已经部署过,可以从图中步骤 6开始操作。

等待部署完成后点击编辑代码,将里面内容全部删除后,添加以下内容:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
// 替换成你想镜像的站点,该站点需有 https 支持
const upstream = 'cdn.jsdelivr.net'

// 除非那个站点有专门的移动适配站点,否则保持和上面一致
const upstream_mobile = 'cdn.jsdelivr.net'

// 希望暂停服务的国家或地区
const blocked_region = [ 'KP', 'SY', 'PK', 'CU']

// 希望阻止使用该服务的 IP 地址
const blocked_ip_address = ['0.0.0.0', '127.0.0.1']

const replace_dict = {
'$upstream': '$custom_domain',
'//cdn.jsdelivr.net': ''
}

//以下内容无需更改
addEventListener('fetch', event => {
event.respondWith(fetchAndApply(event.request));
})

async function fetchAndApply(request) {

const region = request.headers.get('cf-ipcountry').toUpperCase();
const ip_address = request.headers.get('cf-connecting-ip');
const user_agent = request.headers.get('user-agent');

let response = null;
let url = new URL(request.url);
let url_host = url.host;

if (url.protocol == 'http:') {
url.protocol = 'https:'
response = Response.redirect(url.href);
return response;
}

if (await device_status(user_agent)) {
upstream_domain = upstream
} else {
upstream_domain = upstream_mobile
}

url.host = upstream_domain;

if (blocked_region.includes(region)) {
response = new Response('Access denied: WorkersProxy is not available in your region yet.', {
status: 403
});
} else if(blocked_ip_address.includes(ip_address)){
response = new Response('Access denied: Your IP address is blocked by WorkersProxy.', {
status: 403
});
} else{
let method = request.method;
let request_headers = request.headers;
let new_request_headers = new Headers(request_headers);

new_request_headers.set('Host', upstream_domain);
new_request_headers.set('Referer', url.href);

let original_response = await fetch(url.href, {
method: method,
headers: new_request_headers
})

let original_response_clone = original_response.clone();
let original_text = null;
let response_headers = original_response.headers;
let new_response_headers = new Headers(response_headers);
let status = original_response.status;

new_response_headers.set('access-control-allow-origin', '*');
new_response_headers.set('access-control-allow-credentials', true);
new_response_headers.delete('content-security-policy');
new_response_headers.delete('content-security-policy-report-only');
new_response_headers.delete('clear-site-data');

const content_type = new_response_headers.get('content-type');
if (content_type.includes('text/html') && content_type.includes('UTF-8')) {
original_text = await replace_response_text(original_response_clone, upstream_domain, url_host);
} else {
original_text = original_response_clone.body
}

response = new Response(original_text, {
status,
headers: new_response_headers
})
}
return response;
}

async function replace_response_text(response, upstream_domain, host_name) {
let text = await response.text()

var i, j;
for (i in replace_dict) {
j = replace_dict[i]
if (i == '$upstream') {
i = upstream_domain
} else if (i == '$custom_domain') {
i = host_name
}

if (j == '$upstream') {
j = upstream_domain
} else if (j == '$custom_domain') {
j = host_name
}

let re = new RegExp(i, 'g')
text = text.replace(re, j);
}
return text;
}

async function device_status (user_agent_info) {
var agents = ["Android", "iPhone", "SymbianOS", "Windows Phone", "iPad", "iPod"];
var flag = true;
for (var v = 0; v < agents.length; v++) {
if (user_agent_info.indexOf(agents[v]) > 0) {
flag = false;
break;
}
}
return flag;
}

复制粘贴完后点击右边保存并部署按钮,等待生效。【由于 Cloudflare 界面调整,原本进入触发器的流程需增加点击设置这一步,图片界面如有不同以文字为准】

由于 Workers 的域名被拦截,目前只能通过绑定其他域名的方式来解决访问问题。

回到概述界面,点击【Worker 名称】->设置->触发器,按要求填入域名。输入后保存,等待一栏证书变为绿色有效二字,即可使用自定义域名访问。

使用

例如原来的链接是:

1
https://cdn.jsdelivr.net/npm/jquery@3.7.1/dist/jquery.min.js

那么之后可以使用以下地址进行访问(www.example.com替换为前面绑定的域名):

1
https://www.example.com/npm/jquery@3.7.1/dist/jquery.min.js

Workers 挂载单页

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
addEventListener('fetch', event => {
event.respondWith(handleRequest(event.request))
})

// HTML 代码
let html = `
<!DOCTYPE html>
<html>
<head>
<title>Hello</title>
</head>
<body>
<div>Hello world</div>
</body>
</html>
`;

/**
* Respond to the request
* @param {Request} request
*/
async function handleRequest(request) {
return new Response(html, {
headers: {
'Content-Type': 'text/html; charset=UTF-8'
},
status: 200
})
}