Twikoo 本地成功、上线失败:真正的问题在网络链路

这是这次最值得记录的坑。

我的初始配置是:

1
2
3
4
5
6
comments:
service: twikoo

twikoo:
js: 'https://gcore.jsdelivr.net/npm/twikoo@1.7.15/dist/twikoo.all.min.js'
envId: 'https://example-project.vercel.app'

本地评论正常,线上打开代理也正常,但关闭代理后评论失败,其他访客同样无法发表评论。这说明:

  • Twikoo 前端脚本已经加载。
  • 页面评论配置基本正确。
  • 云函数本身很可能也在运行。
  • 真正不稳定的是访客浏览器到 *.vercel.app 的网络连接。

换句话说,“我的电脑能成功”只能证明我的这条网络路径可用,不能证明所有访客都能访问后端。

解决方案:给 Twikoo 绑定自己的子域名

我为评论后端准备了:

1
twikoo.example.com

正确流程是:

  1. 在 Vercel 项目的 Settings → Domains 中添加子域名。
  2. 记下 Vercel 页面给出的 CNAME 目标值。
  3. 进入域名真正使用的权威 DNS 控制台。
  4. 在根域名 example.com 下添加记录,而不是新建一个独立 DNS 区域。
  5. 主机记录填写 twikoo,类型选择 CNAME。
  6. 记录值填写 Vercel 显示的值,不要凭印象猜测。
  7. 等待 Vercel 显示 Valid Configuration 并自动签发 HTTPS 证书。

第一步:去Vercle中添加子域名

alt text
选择Domain,在这个里面添加子域名

第二步:添加域名服务器

alt text
前缀最好选择twikoo,后面加上你本地服务器的域名

第三步:获取配置资料

alt text

可以使用CNAME记录配置子域名。每个项目都有一个唯一的 CNAME 记录,例如:d1d4fc829fe7bc7c.vercel-dns-017.com

第四步:去域名后台添加解析

你需要进入购买或管理 example.com的平台。

常见平台入口名称:

  • 腾讯云:DNSPod / DNS 解析
  • 阿里云:云解析 DNS
  • Cloudflare:DNS → Records
  • 其他平台:域名解析、DNS 管理、解析设置

找到:

  • example.com

点击:

解析设置

然后点击:

添加记录

填写:

记录类型:CNAME 主机记录:twikoo 记录值:粘贴 Vercel 显示的 Value TTL:默认或者 600 线路类型:默认

注意主机记录只写:

twikoo

不要写完整的:

twikoo.example.com

例如,假设 Vercel 显示:

Type: CNAME
Name: twikoo
Value: d1d4fc829fe7bc7c.vercel-dns-017.com

域名后台就填写:

类型:CNAME 主机记录:twikoo 记录值:d1d4fc829fe7bc7c.vercel-dns-017.com

第五步 解析成功之后回到Vercel界面

保存 DNS 记录后,回到刚才的 Vercel 页面:

twikoo8 项目 → Settings → Domains

等待状态从:

Invalid Configuration

变成:

Valid Configuration

如果页面有:

Refresh

或者:

Check DNS Records

可以点击检查。
绑定成功后,把配置改成:

第六步 检查Vercel 提供的域名

在浏览器中输入域名,如果显示
Twikoo 云函数运行正常
那么就是解析部署成功
最后修改配置文件

1
2
3
4
5
6
comments:
service: twikoo

twikoo:
js: 'https://gcore.jsdelivr.net/npm/twikoo@1.7.15/dist/twikoo.all.min.js'
envId: 'https://twikoo.example.com'

然后重新生成和部署:

1
2
3
hexo clean
hexo generate
hexo deploy