Vercel国内无法访问解决方案

2021-05-26 约 2 分钟读完搬砖秘籍

之前把博客转成Hugo，然后整个托管到Vercel上面了（参考文章：Typecho博客迁移到Hugo），本来访问还是好好的，结果最近有朋友和我说已经不能访问了。本来以为是他们各别的问题，因为我一直可以访问（可能是长期使用公司VPN的原因），结果最近使用老的Windows电脑看的时候发现，果然不能访问了。

找原因

网上搜了一圈，结果原因就是你懂的。

P个S，好用并且免费东西还是没逃开这个结局。

找解决方案

换个主机
官方解决方案

首先推荐方案2，官方背书的解决方案值得推荐。

方案1要花钱，但可以保证独立IP，SEO收录要好一些，放香港访问速度还可以，下面记录一下折腾过程。

官方解决方案

将 A 记录从 76.76.21.21 改成 76.223.126.88 官方建议将 cname 从 cname.vercel-dns.com 修改为 cname-china.vercel-dns.com

参考：Vercel Status Status - Errors Accessing From China

买个主机

域名没备案，使用阿里云国内方案的行不通，那就考虑香港的主机了。虽然阿里云也有香港的主机，不过298一年对我来说有点贵（有钱的可以尝试哈，毕竟稳定好用），主机我选用了之前一直使用的校长的主机：篱落主机，价格适中，带独立IP，我买的是虚拟主机，有条件的可以考虑VPS。

我买的是上面的那款，有兴趣的可以点下面的链接看看哈。

篱落主机

————更新————–

现在已经切成成阿里云的轻量应用服务器了，比上面的要稳定好多。PS：现在主机做起来不容易，竞争激烈，小运营商越来越少了。

配置自动部署

Vercel一个好用之处就是代码提交之后什么也不用去操心，会自动把内容给你部署上去。如今我们要自己实现这个过程，有读者可能会问为什么不用FTP直接上传上去，你当然可以这么做，但当你的文章有几百这个量级之后，相信我，每次上传的时间会让你疯的，并且每次还要用FTP工作上传好累，还不如使用Wordpress这种解决方案。

于是我们需要找一个自动部署的工具来替我们自动化完成这个工作，其实就是相当于找一个CI了。常见的免费可用的CI工具有2个，一个是Traivs-ci，一个是Github Action，我使用的是Github Action。关于Git Action的使用教程我就不赘述了，详细可以参考：GitHub Actions

分享一下我的配置：

# This is a basic workflow to help you get started with Actions

name: CI

# Controls when the action will run. 
on:
  # Triggers the workflow on push or pull request events but only for the master branch
  push:
    branches: [ master ]
  pull_request:
    branches: [ master ]

  # Allows you to run this workflow manually from the Actions tab
  workflow_dispatch:

# A workflow run is made up of one or more jobs that can run sequentially or in parallel
jobs:
  # This workflow contains a single job called "build"
  build:
    # The type of runner that the job will run on
    runs-on: ubuntu-latest

    # Steps represent a sequence of tasks that will be executed as part of the job
    steps:
      # Checks-out your repository under $GITHUB_WORKSPACE, so your job can access it
      - uses: actions/checkout@v2
        with:
          submodules: true  # Fetch Hugo themes (true OR recursive)
          fetch-depth: 0    # Fetch all history for .GitInfo and .Lastmod

      - name: Setup Hugo
        uses: peaceiris/actions-hugo@v2
        with:
          hugo-version: '0.80.0'

      - name: Build
        run: hugo --minify


      - name: Zip
        uses: papeloto/action-zip@v1
        with:
          files: public/
          dest: public.zip

      - name: Upload bundle
        uses: bayssmekanique/action-simple-file-upload@v1
        with:
          user: your_name
          password: ${{ secrets.ftp_password }}
          host: your_host
          src: public.zip
          dest: your/path
      
      - name: Deploy Stage
        uses: fjogeleit/http-request-action@master
        with:
          url: 'your zip path'
          method: 'GET

简要说一下这个流程：

拉代码
装hugo
hugo build
压缩
上传FTP
远程解压

其中最后一步是通过URL访问触发的，你也可以选择其他触发方式，在你的FTP上写一个解压的脚本就可以了。

配置Rewrite Rule

我用的是Apache，配置一下https跳转之类的，如果是老网站转的可能还要配置其他的，可根据自己的情况来。我的配置如下：

RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)\.html$ /$1/ [L,R=301] 

RewriteCond %{HTTPS} off [OR]
RewriteCond %{HTTP_HOST} ^www\. [NC]
RewriteCond %{HTTP_HOST} ^(?:www\.)?(.+)$ [NC]
RewriteRule ^ https://%1%{REQUEST_URI} [L,NE,R=301]

一个是https，另一个是去掉html。

Nginx的配置可以参考：Nginx设置www及https跳转

结语

本文使用的是Github Action部署，但免费的使用是有限制的，具体可以参考：Pricing · Plans for every developer