前言

之前我在建站备忘录这篇文章里面说过，我现在在用的静态网站托管方案是CloudFlare Pages，因为我的域名是托管在CloudFlare的。我当时还在文章里大言不惭地说:

当然也有人说Cloudfrare会比较慢， 但是我觉得还好啊。虽然Clondflare主机在洛杉矶，但是我感觉我的网站也不比其他人的慢，基本上十秒钟之内能加载完首屏，可能是因为我文章比较少吧。再说每次打开我的网站数据都要跑到对面的美国去转一圈这件事我感觉还是挺浪漫的。还有一点Cloudflare改DNS的速度是真的快，它说最多需要48小时，但有两次我改完后不到2分钟网址就可以访问了，这一点我还是挺惊讶的。

但是当我申请友链的时候收到了iflux-art的站长发来一封邮件说我网站打不开的时候我知道我和别的妄自尊大认为自己可以轻松驾驭CloudFlare的大冤种一样中它的圈套了。确实我的博客现在已经发展到了一种需要靠运气或者VPN才能访问的状态了，连我自己想看我的个人博客的时候第一选择居然不是去浏览器里输blog.star-lake.world，而是在git bash里面输入hexo s直接在localhost:4000端口里面访问（不是我真是个神人）。我本来还以为是免费版的流量用光了，然后在看到Umami统计的年访问量的时候我立刻放弃了这个想法，因为我从建站以来一个多月的时间访问量也才刚刚超过一百。更主要的是我的CloudFlare仪表盘一个下午根本就打！不！开！
Umami统计（数据统计截止至2025.5.18）

众所周知CloudFlare的一个很大的特性就是慢，尤其是在国内，特别慢。在国外那些网站人机验证的时候CloudFlare那个复选框能比网站本身慢个整整两分钟出来（当然还有可能它根本就不出来）。当你的网站首页需要加载两分钟的时候你就立马不会觉得数据跑去美国绕一圈浪漫了，所以我马上作出决定：是时间换服务商了！
在群里面找到的一张梗图哈哈哈哈笑死我了

那么既然不用CloudFlare，那么用啥呢？我首先第一个就排除了Github Pages，因为我之前试过，我这个网站Github Pages出来就是一堆乱码，我也不知道为什么。所以我就去网站上搜有几个服务商提供网站托管服务（毕竟买服务器是不可能的😛)。哐哐敲一顿键盘我锁定了两个目标，一个是GitLab Pages，另一个就是Vercel。

我本来是想用GitLab Pages的，因为我听别人说GitLab Pages原生支持Hexo，据说可以不用输入hexo g hexo d，真正做到提交即发布。但是可能是因为我看的是十年前的文章（是的你没听错，2016年4月8号发布的，那时候我才5岁），所以我去GitLab官网的时候并没有找到对此的相关描述（也可能是我没看懂？）而且GitLab Pages的配置实在繁琐，我一看头就晕，所以说我最后还是选择了目前相对来说更流行和更成熟的方案：用Vercel。

Vercel因为我之前做Waline和Umami的时候用到过，所以我对它的页面整个来说也是比较熟悉，我也有账号（又在说废话），最重要的是网上对于Vercel的教程也比较详细，所以我立即决定：开搞！

在这里硬塞进去一个Vercel简介

（2025.5.22更新）
（资料是网上找的所以可能会有点不自然，大家将就看看吧(๑• . •๑)）

什么是Vercel呢？

Vercel是一个云计算和部署平台，它提供了一系列工具和服务，旨在帮助开发者更轻松地构建、部署和管理他们的应用程序。这使得开发团队能够更专注于应用程序的开发和创新，而无需过多关注基础设施管理。

Vercel有什么特点？

  1. 部署的便利性：Vercel 简化了部署网站和网络应用程序的过程。开发者可以直接从多种版本控制系统（包括 GitHub、GitLab 和 Bitbucket）部署他们的项目。
  2. 无服务器函数：Vercel 支持无服务器函数，允许在不管理服务器基础设施的情况下响应事件执行后端代码。这一功能特别适用于构建具有最小开销的动态应用程序。
  3. 性能优化：Vercel 默认进行性能优化。它采用了自动静态优化、智能 CDN 缓存和服务器端渲染（SSR）等技术，尤其有利于使用 Next.js 构建的项目。
  4. 实时全球部署：当你在 Vercel 上部署一个项目时，它会自动将应用程序分发到全球多个数据中心。这确保了更快的加载时间和全球受众更好的用户体验。
  5. 与开发工具的集成：Vercel 与各种开发工具和工作流程集成良好，提供了预览部署等功能，允许开发者在上线前实时预览更改。
  6. 自定义域名和自动 SSL：它支持自定义域名，Vercel 上的每个站点都自动用 SSL 保护，确保安全、加密的连接。

想要了解更多？

你可以阅读知乎专栏的一篇文章：

引用站外链接
vercel 介绍 by 沙尘尘
来自专栏 · 暴躁前端

前置要求

（2025.6.3更新）
请确保你的博客文件现在托管在Github，如托管在其他平台请自行摸索如何将仓库导入Vercel。

注册账号

这一部分我就不说了，注册账号只要玩博客的都会吧。我建议是通过GitHub注册，这样既省力后续操作也会更方便。

引用站外链接
vercel官网
vercel.com

Vercel个人首页
这个就是我的账户了，可以看到我现在只有部署Umami和Waline。

安装 hexo-cli

安装

直接在git bash里运行npm install hexo-cli -g。

检查

输入hexo -v检查，出现的信息和我差不多就算成功。
执行hexo -v返回

创建项目

点击右上角 Add New 中的 Project 按钮，进入新建项目页面
新建项目在这里
然后选择左边的Github仓库，我的就是Personal-Blog-Solitude，点击Import。
新建项目页面

部署

这里没什么好改的，直接点Deploy。
部署页面
出现以下页面即代表成功。
成功
点Continue to Dashboard进入配置页面。

自定义域名

这里可以看到Vercel自动给我分配了三个三级域名，分别是
https://personal-blog-solitude.vercel.app
https://personal-blog-solitude-yangle-qs-projects.vercel.app
https://personal-blog-solitude-git-gh-pages-yangle-qs-projects.vercel.app
这三个域名既长又难记，而且最主要的是在国内还被墙了，所以我们要自定义一个域名。
配置页面
点击上面导航栏的Settings，然后点击左侧栏里面的Domains，进入页面管理页面。
域名管理页面
点击Add Domain，进入新增域名页面，在框里输入你的域名，我这边就是blog.star-lake.world，（这里我输成bolg.star-lake.world了后来才发现）
新增域名页面
点击Add Domain，进入访问方式选择页面。这里有两种选择，第一种是连接到一个工作平台（Connect to an environment） ，就是直接通过此域名访问你的网站。第二种是重定向（Redirect to Another Domain），就是让这个域名跳转到其他域名访问。你可以根据你的需要自己选，我在这里选择Connect to an environment。
访问方式选择页面
点击Save，进入配置DNS页面。这里选择Continue manually（手动配置）或者Continue automatically（自动配置）都可以，一般来说自动配置会更省力一些。
配置DNS页面

配置DNS

自动配置

点击Continue automatically之后它会自动找到你的DNS服务商（我的就是CloudFlare）并自动添加DNS记录，你只要点击确认即可。
CloudFlare添加DNS记录
这里正在检查DNS记录是否正确，一般需要一分钟左右，等到上面的状态显示变成Configured Correctly即可关闭。
检查DNS记录-进行中
检查DNS记录-配置正确

手动配置

（2025.6.1更新）
如果自动配置不成功的话就要手动配置了。点击Continue manually进入配置信息页面
配置信息页面
找到你的DNS服务商，我的就是CloudFlare，然后在DNS页面按照Vercel的指示添加一个CNAME记录
CloudFlare DNS页面
CloudFlare添加DNS
注意：Vercel配置信息页面上的Proxy：Disabled代表不通过DNS服务商代理流量，操作时请根据DNS服务商的指示关闭“通过DNS服务商代理流量”（CloudFlare是代理状态下面的开关关掉。
然后返回配置信息页面，点击I’ve added my records即可。

大功告成！

现在输入你绑定的新域名即可访问网站啦！ヾ(●゜▽゜●)♡

Vercel加速

（2025.5.29更新）
Vercel用了一段时间之后感觉还是有点慢，跟那些大博主们比起来那还是差得远了，主要是我进自己博客在那等它加载我着急啊，所以我又翻出来了我的“祖传秘法”，翻家（就是字面意思上的翻家，把几个大佬的博客全都翻了一遍(〃∀〃)）
当当当当，看我在叶泯希哥哥的博客里面看到了什么！


OK，那这个当然得要啦，开搞！
第一步：在source文件夹（放文章那个，不是主题的source文件夹）里面新建一个Vercel.json文件，直接新建一个txt文件然后连着后缀名一起改就好啦
第二步：在Vercel.json里面添加以下内容：

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
{
    "headers": [
      {
        "source": "/sw.js",
        "headers": [
          {
            "key": "Cache-Control",
            "value": "public, max-age=0, must-revalidate"
          }
        ]
      },
      {
        "source": "(.*)",
        "headers": [
          {
            "key": "Cache-Control",
            "value": "public, s-maxage=86400, max-age=86400"
          }, {
            "key": "Vercel-CDN-Cache-Control",
            "value": "max-age=31536000"
          }
        ]
      }
    ]
  }

然~ 后~ 就~ 好~ 啦~（不要在本地看，在本地当然看不出来的啦！）
虽然说我也不知道是什么原理，但是真的有用诶！

写在最后

用上Vercel之后确实觉得比CloudFlare Pages快多辣！我选择用Vercel是因为它已经是一个比较成熟的方案了所以非常简单，所以今天这篇文章可以说有点水，我也是一时兴起才临时写的，没有加在我的个人博客待写文章目录里。不过虽然没什么技术含量但是我也是写+弄了整整两个小时哒，希望大家多多支持噢( *¯ ³¯*)♡ㄘゅ

参考文章

（2025.5.22更新）

引用站外链接
如何使用 vercel + hexo 搭建博客
知乎
引用站外链接
Vercel 加速，快，不止更快
Mystic Stars
引用站外链接
什么是Vercel？
腾讯云开发者社区

我的个人博客可以通过以下几个地址访问：