简介

vercel是什么?

vercel是网站托管服务, 不仅支持静态网站部署, 还支持部署serverless接口。
更新内容只要将文件推送到github即可自动部署, 支持丰富的模板，并且支持自动配置https。
如何实现双线博客?

需要搭建两个服务，通过域名解析设置，境外ip和境内ip的分别解析到对应的服务中。

境内服务使用Coding+COS+CDN实现。
境外服务使用Github+Vercel实现。
搭建两个服务会不会写博客麻烦?

答案是不会的。只要通过git更新文件到Github或Coding，通过持续集成自动同步内容，以及自动编译站点即可。并且使用传统github pages还需要特地备份一下博客内容麻烦。
点击访问博主的小站，暂时没有加CDN。

Vercel+Github搭建服务

访问vercel, 直接使用Github账号登录即可, 没有Github账号的话先去注册。

在这里插入图片描述

登录后点击New Project.

在这里插入图片描述

选择浏览全部模板.

在这里插入图片描述

找到Hexo并点击.

在这里插入图片描述

然后选择你的账号.

在这里插入图片描述

选择使用Github创建项目仓库.

在这里插入图片描述

输入仓库名称, 如果不想别人看见你的博客文件，把选项勾上设置为私有仓库。

在这里插入图片描述

点击deploy

在这里插入图片描述

出现这个页面表示已经部署成功了，点击visit即可访问。

在这里插入图片描述

点击Dashboard后，点击view domians进行域名设置。

在这里插入图片描述

在Domain下面的输入框输入你自己的域名点击添加, 没有域名的需要自己去购买。

在这里插入图片描述

添加域名完成后，需要去你的域名服务商的控制台进行域名解析，添加图片中的记录。

在这里插入图片描述

域名解析示例:

在这里插入图片描述

至此, 已经成功部署了一个服务。

Coding+COS+CDN搭建服务

点击进入Coding, 创建并登陆账号。
登陆后选择左边的项目栏，然后点击创建项目。

在这里插入图片描述

项目模板选择左边第一个, 输入项目名并创建。

在这里插入图片描述

项目创建完成后，点击左边代码仓库，再点击创建项目，选择普通创建，输入仓库名称，点击完成创建即可。

在这里插入图片描述

然后点击持续集成菜单里面的构建计划。

在这里插入图片描述

选择制品库，点选自定义构建过程。

在这里插入图片描述

代码源选择github, 然后点击授权，授权完成后可以选择仓库，选择之前在vercel中创建的项目。

在这里插入图片描述

页面跳转到流程配置中，切换为文本编辑器。

在这里插入图片描述

然后在编辑器中输入以下内容, 需要把这部分内容替换成你coding仓库的链接:e.coding.net/classmatelin1/jingtaiwangzhan/www.classmatelin.top.git

pipeline {
  agent any
  stages {
    stage('检出 GitHub') {
      steps {
        checkout([
          $class: 'GitSCM',
          branches: [[name: env.BRANCH_NAME]], 
          userRemoteConfigs: [[url: env.GIT_REPO_URL, credentialsId: env.CREDENTIALS_ID]]
        ])
      }
    }
    stage('推送到 CODING') {
      steps {
        // 无需修改 PROJECT_TOKEN_GK 和 PROJECT_TOKEN，它们为 CODING 内置环境变量
        // 请修改为你的代码库链接
        sh "git push https://${PROJECT_TOKEN_GK}:${PROJECT_TOKEN}@e.coding.net/classmatelin1/jingtaiwangzhan/www.classmatelin.top.git HEAD:master"
      }
    }
  }
}

点击保存后，点击一次立即构建，构建失败请仔细检查，成功示例如下:

在这里插入图片描述

按刚才创建构建计划的方式再创建一个构建计划用于部署站点，这里代码仓库选择Coding里面的仓库。

在这里插入图片描述

打开流程配置的文本编辑器，添加以下内容:

pipeline {
  agent any
  stages {
    stage('检出') {
      steps {
        checkout([
          $class: 'GitSCM',
          branches: [[name: env.GIT_BUILD_REF]], 
          userRemoteConfigs: [[url: env.GIT_REPO_URL, credentialsId: env.CREDENTIALS_ID]]
        ])
      }
    }
    stage('安装依赖') {
      steps {
        sh 'npm install'
        sh 'npm update'
      }
    }
    stage('生成静态文件') {
      steps {
        sh './node_modules/hexo/bin/hexo clean'
        sh './node_modules/hexo/bin/hexo g'
      }
    }
    stage('部署到腾讯云存储') {
      steps {
        sh "coscmd config -a ${env.COS_SECRET_ID} -s ${env.COS_SECRET_KEY} -b ${env.COS_BUCKET_NAME} -r ${env.COS_BUCKET_REGION}"
        sh 'rm -rf .git'
        sh 'coscmd upload -r ./public/ /'
      }
    }
  }
}

点击环境变量->添加环境变量, 需要配置4个环境变量, 需要在腾讯云COS控制台找到这些内容, 因为暂时没有创建腾讯COS，可以先添加这个四个环境变量的key, value留空先。
```
COS_SECRET_ID
COS_SECRET_KEY	
COS_BUCKET_NAME
COS_BUCKET_REGION
```