type
status
date
slug
summary
tags
category
icon
password
NotionNext默认使用的是Notion图床。Notion在国内没有服务器,所以通过Notion.so域名请求的图片资源文件在国内的访问速度不是很好,我们可以通过使用Caddy反向代理的方式加快Notion.so的图片访问,从而提高使用NotionNext的博客在国内的访问速度与用户体验。
这个问题也是昨天突然博客国内用户的访问量增加,我在Cloudlfare Web Analytics里面发现的。因为Notion在国内没有服务器,访问速度不算很好,所以大部分图片的LCP延迟都在5秒左右,在一篇包含很多张图片的文章里,整体的加载速度更堪称灾难级,为了优化国内的访问体验,所以尝试寻找解决方案,在《Nginx设置Notion反代加速NotionNext图片资源访问》这篇文章中,作者提到可以通过使用Nginx反向代理方式进行解决。我没有使用Nginx作为Web服务器,而是使用的Caddy这个更轻量化的解决方案,所以就在这篇文章的基础上,提供一份基于Caddy的反向代理解决方案。
目前Notion.so在国内的访问情况如下:
📝 配置前提
你需要一台云服务器,境内境外均可,我所使用的小鸡是在香港,国内访问速度在ITDOG上查询还不错。平常只作为RSS服务和Docker加速使用。如果不使用Cloudflare的话,需要自行在云服务器为用于反向代理的域名申请证书。
我没有使用Cloudflare Worker进行反向代理的原因是担心会被Ban。
📝 安装Caddy
Caddy的安装很简单,由于不使用其他第三方插件,所以可以直接通过系统的包管理器进行安装,例如我使用的是Debian系统:
📝 修改Caddy配置文件
这里我所使用的域名是
notion.dolingou.com
,即通过notion.dolingou.com
域名替代notion.so
域名从而实现反向代理。安装完Caddy之后,配置文件位于/etc/caddy/Caddyfile
,你可以使用你喜欢的编辑器进行编辑,例如我使用的是Vim
,添加如下内容:配置要点
拒绝所有非博客域名请求
涉及代码段:
这部分主要是避免这个反向代理被恶意使用,造成反向代理服务器的负载过高出现问题。所有非博客域名的请求均会返回
403
错误。你可以将*.dolingou.com
替换为你的域名处理根目录请求
涉及代码段:
这部分主要用于当用户直接访问根目录及根目录下
/image
时,返回200
请求,并设置响应头的Content-Type
为text/plain
;一方面为特定路径提供简单的占位符响应,另一方面可以快速测试服务器的响应。代理转发配置
涉及代码段:
用于将匹配特定路径的请求代理转发到目标服务器
https://www.notion.so
,并在转发过程中设置一些请求头和SSL/TLS配置。具体如下:
- 定义匹配器
@imagePath
: @imagePath
是一个匹配器(matcher),用于匹配特定的请求路径。path_regexp image ^/image.*$
:使用正则表达式匹配路径。^/image.*$
:匹配以/image
开头的所有路径,例如/image
、/image/123
、/image/test.jpg
等。- 这个匹配器会捕获所有路径符合正则表达式
^/image.*$
的请求。
- 反向代理配置:
reverse_proxy
是一个指令,用于将请求代理转发到指定的后端服务器。@imagePath
:指定匹配器,表示仅对匹配@imagePath
的请求生效。https://www.notion.so
:目标服务器的地址,所有匹配的请求都会被转发到这里。
- 设置请求头:
header_up
是一个指令,用于设置转发到后端服务器的请求头。Host www.notion.so
:将Host
头设置为www.notion.so
,确保后端服务器知道请求的目标主机。Referer https://www.notion.so
:将Referer
头设置为https://www.notion.so
,模拟请求来源。User-Agent {http.request.header.User-Agent}
:将User-Agent
头设置为客户端原始请求的User-Agent
,确保后端服务器能够识别客户端类型。X-Real-IP {http.request.remote.host}
:将X-Real-IP
头设置为客户端的真实 IP 地址,用于后端服务器记录或处理。Accept-Encoding ""
:清空Accept-Encoding
头,防止后端服务器返回压缩内容(如果需要)。Accept-Language {http.request.header.Accept-Language}
:将Accept-Language
头设置为客户端原始请求的Accept-Language
,确保后端服务器返回正确的语言内容。X-Cache {http.reverse_proxy.header.X-Cache-Status}
:将X-Cache
头设置为反向代理的缓存状态(如果有)。
- SSL/TLS配置:
transport http
:定义 HTTP 传输配置。tls
:启用 TLS(HTTPS)加密,确保与后端服务器的通信是安全的。tls_server_name www.notion.so
:设置 TLS 的服务器名称为www.notion.so
,用于 SNI(Server Name Indication)验证。
完成以上配置后,直接访问反代域名,这时候浏览器应该会显示一个
200 OK!
,即表示配置成功。📝 配置Vercel环境变量
完成以上配置后,在Vercel中的NotionNext项目下添加环境变量,用于替换默认的Notion Host(
https://notion.so
),位置位于Settings
→ Environment Variables
中,新增环境变量:注意需要携带https,否则无法正常使用。添加完成后,对NotionNext进行重新部署即可生效。
🤗 总结归纳
因为我最终还是将反代域名使用Cloudflare CDN服务,也就是开启小黄云,所以为反代域名配置了SaaS回源使用Cloudflare优选IP,优化国内的访问速度。同时由Cloudflare提供缓存,故未在反代服务器的Caddy配置中添加缓存配置。目前的国内访问情况如下:
📎 参考文章
有关Notion安装或者使用上的问题,欢迎您在底部评论区留言,一起交流~