Introduction to the

  • What is Vercel? Vercel is a web hosting service that not only supports static web site deployment, but also supports deployment of the Serverless interface. Update content is automatically deployed by pushing the file to GitHub, supports rich templates, and supports automatic configuration of HTTPS.
  • How to achieve double – line blog?

Two services need to be set up, and the overseas IP and domestic IP are respectively resolved to the corresponding service through the domain name resolution setting.

  • Domestic service is implemented by Coding+COS+CDN.
  • Overseas services are implemented using GitHub +Vercel.
  • Will it be a hassle to set up two services? The answer is no. Just update files to GitHub or Coding via Git, automatically synchronize content through continuous integration, and automatically compile your site. And using traditional GitHub Pages also requires special backup of the blog content trouble.
  • Visit Vercel and log in directly with your GitHub account. If you don’t have a GitHub account, register first.

  • Once logged in, click New Project.

  • Select browse all templates.

  • Find the Hexo and click.

  • Then select your account number.

  • Select GitHub to create the project repository.

  • Enter the name of the repository. If you don’t want people to see your blog file, check the box set to Private Repository.

  • Click the deploy

  • This page indicates that the deployment has been successful and can be accessed by clicking Visit.

  • After clicking Dashboard, click View Domians to set the domain name.

  • Enter your Domain name in the input box below Domain name and click add. If you don’t have Domain name, you need to buy it by yourself.

  • After adding the domain name, you need to go to your domain service provider’s console to resolve the domain name and add the record in the picture.

  • Example domain name resolution:

  • At this point, a service has been successfully deployed.

Coding+COS+CDN building services

  • Click on Coding to create and log in an account.
  • Once logged in, select the project bar on the left and click Create Project.

  • Project Template Select the first one on the left, enter a project name and create.

  • After the project is created, click Code Warehouse on the left, then click Create Project, select General Create, enter the name of Warehouse, and click Finish Create.

  • Then click the Build Plan in the Continuous Integration menu.

  • Select the artifact library and click on Custom Build Process.

  • Select GitHub for the code source, and click Authorize. Once the authorization is complete, you can select the repository and select the project you created in Vercel.

  • The page jumps to the process configuration and switches to a text editor.

  • Then enter the following in the editor. You need to replace this with a link to your coding repository:e.coding.net/classmatelin1/jingtaiwangzhan/www.classmatelin.top.git
'steps {' steps {'' branches ", ' 'branches ": [[name: env.BRANCH_NAME]],` `userRemoteConfigs: [[url: env.GIT_REPO_URL, credentialsId: Env.credentials_id]] ' ' ']) ' '} ' ' ' 'stage(' push to CODING') {'' steps {' ' '// No need to modify PROJECT_TOKEN_GK and PROJECT_TOKEN, They are built into the CODING environment variable ' '// Please change the link' 'sh "git push for your code base https://${PROJECT_TOKEN_GK}:${PROJECT_TOKEN}@e.coding.net/classmatelin1/jingtaiwangzhan/www.classmatelin.top.git HEAD:master"` `}` `}` `}` `}`
  • Click Save and then click Build Now. If the build fails, please check carefully. Examples of success are as follows:

  • Create another build plan for the deployment site in the same way you created the build plan, where the repository is selected from the Coding repository.

  • Pipeline {agent any stages {stage(‘ checkout ‘) {steps {checkout([$class: ‘branches ‘, branches: [[name: env.GIT\_BUILD\_REF]], userRemoteConfigs: [[url: env.GIT\_REPO\_URL, credentialsId: Env.credentials \_ID]]])}} stage(‘ install dependencies ‘) {steps {sh ‘NPM install’ sh’ NPM update’}} stage(‘ generate static files ‘) {steps {sh /node\_modules/hexo/bin/hexo clean’ sh ‘./node\_modules/hexo/bin/hexo g’}} stage(‘ Deploy to Tencent Cloud Storage ‘) {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/ /’ } } } }
  • Click the environment variable -> to add the environment variable. Four environment variables need to be configured and these contents need to be found in the Tencent cloud COS console. Since Tencent COS has not been created for the time being, you can add the key of these four environment variables first, and leave the value blank first. COS\_SECRET\_ID COS\_SECRET\_KEY COS\_BUCKET\_NAME COS\_BUCKET\_REGION

  • Log in to Tencent cloud console.
  • Select the object storage service.

  • Select the bucket list to create a bucket. Here, I choose Hong Kong as the node (no need for filing, but domestic CDN cannot be opened). If you need to use CDN, please select domestic node, and you need to record the website. For access, please select public read and private write

  • After successfully creating the bucket, select Basic Configuration, Static Website Settings, and save as shown in the figure below:

  • Set the domain name of the custom source site, as shown in the figure. If you open the CDN, please fill in the content in the domain name of the custom CDN.

  • After saving successfully, you also need to set the content of CNANE to the domain resolution, where the CNAME is different, according to your own.

  • Example domain name resolution:

  • Click the bucket overview and fill the bucket name and storage region into the environment variable in the Coding build plan just nowCOS_BUCKET_NAME.COS_BUCKET_REGIONIn the.

  • Click Secret Key Management to jump to Access Management, click API Secret Key Management to generate a secret key, and then clickSecretIdandSecretKeyFill in the environment variable for the Coding build plan you just plannedCOS_SECRET_IDand

    COS_SECRET_KEYIn the.

  • Then click on the build plan once to see if the build is successful. Use the domain name you are bound to visit the build successfully. See the figure for the service address if it is124.156.144.44:443COS has been deployed successfully, and the IP access display is 76.XXX. XXX. XXX or your local proxy address.

  • So far the basic content of the double – line blog has been set up, mainly for the configuration of the blog. You can visit the site here to try it out.

Configuration Hexo

  • Official documentation for Hexo
  • Next Theme Official
  • Welcome to the blog site

Posted 25 minutes ago