Front that

GithubPage has been used to build the blog, because the server in foreign countries, the access speed has been relatively slow, and then a group of servers were wall down, leading to the domestic network environment directly can not access. Here can say more, GithubPage and Github can not use the same IP address server, the wall is a lot of by locking IP, GithubPage build blog some can access some can not, is because some IP was blocked, if the REPLACEMENT OF IP can also be solved, but the access speed is not fast enough. Some time ago to see Tencent cloud server discount, consider if you want to ensure the speed of domestic access or to the server migration to the domestic.

The role of this article is to build a blog to do an overall introduction, to the blog used in the scheme of some comparison, some will write a brief also need to turn to other articles to see, in addition to the focus will write about the migration of Tencent cloud and domain name record need to do specific operations.

There are generally five parts to set up a blog: blog framework, domain name, server, graph bed, Markdown tool. There are free and paid versions available for each session, and generally free meets basic needs, while paid offers a better experience, depending on your needs. The comparison of the five parts is as follows:

Paid version The free version
Blog framework WordPress (pay for some content) Hexo/Jekyll
The domain name Wanwang/Tencent Cloud freenom/dot.tk
Content hosting platform Alibaba Cloud/Tencent Cloud GithubPage/GiteePage
Figure bed Seven cows/beat again Github/Gitee
Markdown tools MWeb Typora

The following five parts will be explained.

Blog framework

The current hot options are Hexo, which is developed based on Node.js, and Jekyll, which is developed based on Ruby, both of which translate the content of Markdown syntax into HTML and display it according to the configured theme.

WordPress is much more powerful and much simpler than the first two. It doesn’t rely on Markdown syntax, and you can just use a template for online editing. I don’t know much about WordPress, and it’s hard to talk about its pros and cons, but I recommend you try it.

Here are a few blogs that use the above scheme, for your reference:

Jekyll:onevcat.com/, https://dr…

Hexo:blog.sunnyxx.com/, https://zh…

WordPress:blog.cnbang.net/

The difference in style is not in the framework, but in the theme, and there are plenty of themes to choose from among all three. I use Hexo, and the way to use it can be found in this post: Building my own Blog House based on Hexo.

The domain name

Domain name selection

The free version

Free versions of domain names, like Freenom and dot.tk, tend to be available for a fixed period of time, usually about a year.

If you rely on hosting services like GithubPage or GiteePage, you can set up domain names like username.github. IO or username.giitee. IO.

If you want to give GithubPage a try, you can also check out this post on Building your own Blog based on Hexo

Paid version

The paid version of the domain name can be our common.com,.cn,.net, etc., can be purchased from Wanwang or Tencent cloud, generally optional 1-10 years of use.

The domain name registration

Not all domain names need to put on record, if the website server does not need to put on record in foreign countries, it is necessary to put on record in China. GithubPage server in foreign countries, the use of domain name does not need to record; If want to use domestic server, Tencent cloud or Ali cloud and so on need to put on record.

The following is the domain name registration process of Tencent Cloud:

The main steps can be done through the record applet.

The application conditions for filing will first be submitted to Tencent Cloud background, and they will conduct a preliminary review. If it is not approved, they will contact you and inform you where you need to modify, and you can submit again after modification.

I encountered two problems in the first review:

1. The domain name must be in the inaccessible state when being recorded. If the domain name is in use, stop parsing.

2, website description should not include the word blog, can use study notes instead.

After the initial approval of Tencent cloud, they will submit the record information to the administration. The board’s audit takes longer, usually within 20 working days. Mine took 16 days.

For the record,

After passing the review, we will get a record number. We need to add this record number at the bottom of the website and attach a link to the domain name information record management system. The record number can be viewed in the record management interface of Tencent Cloud.

There are two places to display the registration number: the main information and the registered website. Subject information is the meaning of natural persons or units, has been put on record website is for the website, because a subject may use more than one site, so the site record number is based on the subject record number plus natural serial number. If the domain name is registered again, the new registration number will be in the form of principal registration number -2. The record number that appears in our website should be the website record number, namely Beijing ICP reserve 2020035857-1.

If you are using Hexo or Jeklly, you can search Powered by in the theme file directory to find the corresponding bottom column configuration file. For the Icarus theme I used, the bottom file is footer.jsx, find where to add:

<a href="https://beian.miit.gov.cn/" target="_blank" rel="noopener">&nbsp;Beijing ICP 2020035857-1</a>
Copy the code

The effect is as follows:

The public security for the record

Within 30 days after the opening of the website, the public security bureau needs to put on record, log in the website national Internet security Management service platform, and fill in the information. Because it is a government website, it is generally inaccessible to open the proxy, so you need to close the proxy. If the proxy still cannot be accessed, DNS may be contaminated. You can set the DNS server to 114.114.114.114 and refresh the website again.

After login, register, log in and fill in the owner information:

There will be many potholes here. I have tried many times and failed, and I have not succeeded until now. If you know how to solve the potholes, you can tell me.

  • Adobe Flash must be enabled for image selection
  • Identification of THE ID card seems to be carried out by the proportion of the picture, the photo of the ID card needs to be taken out of the redundant content, only the main content of the ID card
  • If the hand-held ID card photo cannot be verified, it can be cut to a certain proportion according to the example picture or taken on a white background
  • The second and third option boxes of the permanent address sometimes fail to pop up, this can only be constantly refreshed to try, I try again every few days to expand the area box
  • After filling it, I clicked submit audit and kept loading. After 1 minute, I still stuck. I tried several times and the problem was the same, but this step was not successful

Public security puts on record I see a lot of websites also did not write, so temporarily also do not plan to tube. Here can tell you what the public security record refers to, with nuggets as an example:

The above arrow points to the jin ICP is the site record number, Beijing public network security refers to the public security record, the following is the public security record number, many blog sites are not written as if the importance is not very big.

Domain name resolution

DNSPod of Tencent can be used for domain name resolution, because I have done domain name resolution from GithubPage server before, so I only need to change the server IP address pointing to GithubPage to my own server address.

For domain name configuration, see my previous post on creating a custom domain name for your blog

Here is my domain name resolution configuration. The erased content is the server IP address:

The global recursive DNS server refresh is not more than 72 hours, we verify that the resolution is valid can pass

Ping zhangferry.com. If the displayed IP address is the new IP address, domain name resolution has taken effect.

The server

Cloud Server Selection

Divided into free and paid version, in fact, the free version does not belong to the server, only play a role of server hosting.

The free version

Github’s GithubPage and Code Cloud’s GiteePage are two of the more common static Web hosting services. Here is a brief summary of the characteristics of both:

Compare the item GithubPage GiteePage
The default domain name username.github.io username.gitee.io
Custom domain name support The free version is not supported, the paid version is supported
Access speed Access is not available in Korea, and the speed of access is slow after scaling the wall Domestic access, but slow access
The heat High, there are a lot of developers using this solution Lower, fewer users

If you’re new to blogging and want to give it a try, my advice is to pick one of these platforms and play it. If you have long-term maintenance plans and want to ensure a certain user experience, you still have to buy a server.

Paid version

The choice of Ali cloud and Tencent cloud, I choose Tencent cloud, Ali cloud is the same.

When purchasing, we need to specify the operating system, and the server is usually Linux. There are two popular Linux distributions, Ubuntu and CentOS, which are not the same on package management tools, so be aware of this later in the tool installation process. Ubuntu uses apt-get, CentOS uses yum.

I chose CentOS. After the server is created, I can log in. Tencent cloud has two login methods

1. Use SSH to log in to the Tencent Cloud web site. You need to set a password for the first login.

2. Log in to the local PC using SSH. Use SSH root@host-ip to log in, and then enter the password of user root created at the first login. Local SSH allows you to log in to other users.

Server Configuration

Some of the following configurations and commands are performed on the remote server, and some are performed on the local server. The following are distinguished by starting with remote$and local$. The IP address is displayed in the form of host-IP and the user name is displayed in the form of zhangferry.

Install dependencies with Git

First log in to the server and install some dependency tools.

1. Install the dependency libraries

remote$ yum install curl-devel expat-devel gettext-devel openssl-devel zlib-devel
Copy the code

2. Install the build tool

remote$ yum install gcc perl-ExtUtils-MakeMaker package
Copy the code

3. Install Git

Although Linux distributions typically have Git installed, many versions are older and you need a relatively new Git version, so you need to install the latest version of Git.

Checking the Git Version

remote$ git --version
Copy the code

If you see a version prior to 2.0, move up.

Delete older versions of Git

remote$ yum remove git
Copy the code

If you don’t want to use yum to upgrade git, you can also use yum to upgrade git. The latest version is 2.28.0. You can skip the source upgrade step by using yum install git.

The source code to upgrade

Select a directory to store your downloaded Git installation package. The /usr/local/src directory is selected and we enter it

remote$ cd usr/local/src
Copy the code

Download the Git zip package to this directory

remote$Wget HTTP: / / http://ftp.ntu.edu.tw/software/scm/git/git-2.28.0.tar.gz
Copy the code

Unzip to the current directory

remote$The tar - ZVXF git - 2.28.0. Tar. Gz
Copy the code

Go to the decompressed directory and compile

remote$ cdGit - 2.28.0
remote$ make prefix=/usr/local/git all
Copy the code

Install git to /usr/local/git

remote$ make prefix=/usr/local/git install
Copy the code

Set the Git environment variable, that is, you can find Git command on the command line, you can try

remote$ git --version
Copy the code

If you see the version we installed as 2.28.0, the current environment variable is set correctly. If comond is not found, you need to modify the environment variable so that the terminal can find git commands.

Open using vim

remote$ vi /etc/profile
Copy the code

Press I to enter edit mode and add the following at the end of the file

PATH=$PATH: /usr/local/git-/bin # git directory export PATHCopy the code

Save and exit and check the Git version number again. It should be the version we installed.

Creating a New user

A user is created to facilitate the assignment of permissions for remote login and push web content. You can also use root to log in directly. If you don’t want to create a user, skip this step.

Create user zhangferry and set connection password:

remote$ adduser zhangferry
remote$ passwd zhangferry Enter the password and confirm it twice
Copy the code

Get edit permission for the sudoers file

remote$ chmod 740 /etc/sudoers
remote$ vim /etc/sudoers
Copy the code

Press I to enter the file editing mode and press down to find the following fields:

root    ALL=(ALL)       ALL
Copy the code

Add a sentence after it:

zhangferry     ALL=(ALL)       ALL
Copy the code

Our new user has superuser privileges, and then returns the edit permission to the sudoers file:

remote$ chmod 400 /etc/sudoers
Copy the code

The command for switching users is:

remote$ su zhangferry #su root Switch to user root
Copy the code

At this time, we can use SSH command on the host to try whether we can successfully log in through the Zhangferry user. We need to enter the password set for the Zhangferry user just now:

local$ ssh zhangferry@host-ip
Copy the code

Each time input password is very troublesome, you can use the secret key, a secret – free login.

SSH login

This step is optional, but is recommended as it saves us entering the password later.

1. Generate a local key. Generally, specify the RSA encryption algorithm and generate a pair of public and private keys.

local$ ssh-keygen -t rsa -C "[email protected]" # Change your email address to your own
Copy the code

If it has already been generated, do not generate it again, as it will overwrite our original secret key and invalidate the previous key configuration. The inspection method is:

local$ cat ~/.ssh/id_rsa.pub
Copy the code

The location of the secret key is in the.ssh folder, and if there’s output we’ve already generated it.

2. Copy the SSH public key to the ~/. SSH /authorized_key file on the remote host

local$ ssh-copy-id root@host-ip
Copy the code

If a message is displayed indicating a failure or no file is available, manually generate a file with the same name and copy the content into the file.

3. Test the connection

local$ ssh zhangferry@host-ip
Copy the code

If the content on the left of the command line contains [centos] or marks our remote server, it indicates that the login is successful.

Create git repositories and web directories

1. The purpose of this step is to create a Git repository to which local blog content will be pushed.

remote$ su root # select * from user root
remote$ mkdir /home/zhangferry
remote$ mkdir /home/hexo # Site directory
remote$ cd /home/zhangferry
remote$ git init --bare blog.git Create a bare git repository
Copy the code

Bare repository means only git commit records are kept, not file contents.

Create a Git post hook for automatic deployment. The purpose of this step is to move the content to the site directory when we push the repository to the server, because the bare repository does not contain content.

remote$ vi blog.git/hooks/post-receive
Copy the code

The hooks file is a directory that Git automatically generates and contains many examples for editing hooks, including post-receive for hooks in push. It reads as follows:

#! /bin/sh
git --work-tree=/home/hexo --git-dir=/home/zhangferry/blog.git checkout -f
Copy the code

Note that work-tree corresponds to the workspace directory, i.e. the website directory, and git-dir corresponds to the Git repository location. If you have a custom name, remember to change these two places.

Here you can think about why you want to separate the Git directory from the website directory, if not separate is ok. The operation of Git is usually a single user’s permission, many people can operate Git, its influence on the website is indirect, and the permission of the website content should be higher, only the root can directly operate. So we separate the two.

Modify git repository permissions

Only need to delegate the git repository to Zhangferry user, the update of the website directory is completed by post hook.

remote$ cd /home/zhangferry
remote$ chown zhangferry:zhangferry -R blog.git Git is owned by Zhangferry
remote$ chmod +x blog.git/hooks/post-receive # change post-receive to executable
Copy the code

Install Nginx

Nginx is a high-performance HTTP and reverse proxy Web server, which we will use only as an HTTP Web server here.

1. Install nginx

remote$ yum install -y nginx
Copy the code

2. Modify the configuration file

remote$ vi /etc/nginx/nginx.conf
Copy the code

The modifications are as follows:

server { listen 80 default_server; listen [::]:80 default_server; server_name zhangferry.com; # root /home/hexo; # Load configuration files for the default server block. include /etc/nginx/default.d/*.conf; location / { } error_page 404 /404.html; location = /40x.html { } error_page 500 502 503 504 /50x.html; location = /50x.html { } }Copy the code

We just need to change the server_name and root options in the server, which represent the blog domain name and the website directory respectively.

Listen indicates the listening port. HTTP listens on port 80 by default. Error_page represents the display page after the error. 40x.html with no data and 50x.html with server error can be specified here.

Nginx commands

remote$ start nginx # start nginx
remote$ nginx -t Check whether the configuration file has syntax errors
remote$ nginx -s reopen # restart nginx
remote$ nginx -s stop # exit nginx
Copy the code

The normal process is to use nginx -t to check if there are any errors in the nginx configuration file. It also checks for some warning messages that need to be fixed but do not affect the operation. If there are errors, it needs to be corrected and checked again. Nginx: nginx -s is a reopen. If the configuration is not damaged, start nginx: start nginx.

4. Start the detection

Once nginx is started, we can access it by typing http://host-ip:80 in the local browser, and we should see a default nginx page because the /home/hexo directory has no content.

Upload Hexo blog content to Tencent Cloud

Change the deploy configuration of the _config.yml file in the root directory of the blog:

deploy:
    type: git
    repo: zhangferry@host-ip:/home/zhangferry/blog.git The bare Git directory configured above
    branch: master
Copy the code

Deploy Hexo and push:

local$ hexo g
local$ hexo d # Publishing hexo triggers a push to push the repo to our configured Git path
Copy the code

You might get bash: git-receive-pack: command not found. Command not found is a common error that means git-receive-pack cannot be found on the server side.

With a simple extension, Git push is internally divided into two steps. It runs send-pack locally and determines which commit records it has but the server doesn’t. It then notifies the server-side receive-pack about the update and receives the data it pushes.

The solution to this problem is to associate git-receive-pack with ln:

remote$ sudo ln -s /usr/local/git/bin/git-receive-pack  /usr/bin/git-receive-pack
Copy the code

/usr/local/git/bin/git-receive-pack is the actual command path and /usr/bin/git-receive-pack is the shortcut path.

But from the point of view of the error itself, the command can not find the installation is usually the problem of the environment variable, I directly modify the environment variable:

remote$ su zhangferry If you use a sub-user to push, you need to switch to this user
remote$ vi ~/.bashrc
Copy the code

Add export PATH=$PATH:/usr/local/git/bin to the base of.bashrc and update the environment variable:

remote$ source ~/.bashrc
Copy the code

Deploy Hexo again and it should be successful.

local$ hexo d
Copy the code

I originally thought of changing the environment variable, but I changed it under root, and root and Zhangferry are two separate environment variable configurations!

Here is a diagram of the relationship between environment variable files:

The configuration in the /etc/bashrc directory is global. The configuration in ~/. Bashrc applies only to the current login user. Therefore, for the modification of the above environment variable, we can modify it in the global or Zhangferry user.

After the successful push, visit http://host-ip:80 again. If the DNS resolution of our domain name takes effect, visit Zhangferry.com directly. If the homepage of blog can be displayed normally, it will prove that our migration is successful.

HTTPS support

This step is optional if you do not intend to make the site support HTTPS to end here. There are three steps to support HTTPS:

1. Apply for an SSL certificate

2. Upload the certificate to the server

3. Configure Nginx to associate SSL certificates

The following is a detailed explanation of the three steps.

Applying for an SSL Certificate

Tencent Cloud has a free HTTPS certificate that can be applied for. The validity period is only one year, after which you need to apply again.

The application process is very quick, usually about an hour. If it takes too long, for example, more than a day, you can apply again and they will quickly approve your application and call back the original application (which happened to me). 0).

Upload a certificate to the server

After the certificate is approved, there is a download button, which downloads a certificate file containing multiple server types. I am using Nginx to build the server, so find the certificate file in the Nginx directory. It has two suffixes:.crt and.key.

1, we also need to create a folder in the Nginx directory to store these certificates:

remote$ cd /etc/nginx/
remote$ mkdir ssl
Copy the code

2. Run the SCP command to upload the local certificate file to the server.

local$ scp /path/filename zhangferry@host-ip:/etc/nginx/ssl/
Copy the code

Modify the Nginx configuration

There are many related tutorials on the Internet, which are to tell you how to change, and did not explain the relationship and reason, so it is easy to cause errors because some configuration environment is different.

Let me summarize: Nginx has a default configuration controlled by nginx.conf, and we can write the certificate configuration to it. The solution is to create a.conf configuration file in the conf.d directory, which can be used to manage separate domain names. The two configuration files are of the same level and will work together.

Conf file with port and certificate in zhangferry.conf file.

Nginx. Conf content:

server {
    listen       81 default_server;
    listen       [::]:81 default_server;

    # Load configuration files for the default server block.
    include /etc/nginx/default.d/*.conf;

    location / {
    }
        
    error_page 404 /404.html;
        location = /40x.html {
    }

    error_page 500 502 503 504 /50x.html;
        location = /50x.html {
    }
}
Copy the code

Server_name and root are removed here, because we need to configure listening in Zhangferry. The listening port is changed to 81 to avoid warnings caused by ports with the same configuration.

Zhangferry. Conf content:

server {
    listen 80;
    server_name zhangferry.com;
    root         /home/hexo;
    #重定向设置,如果使用http访问会重定向至同路径的https链接
    rewrite ^(.*)$ https://$host$1 permanent;
}

server {
    listen 443 ssl;
    #证书位置,需跟自己证书位置对应
    ssl_certificate /etc/nginx/ssl/1_host.com_bundle.crt;
    ssl_certificate_key /etc/nginx/ssl/2_host.com.key;
    #绑定域名
    server_name zhangferry.com;
    root        /home/hexo;
        #ssl配置,以下几项必须要有
    ssl_session_cache    shared:SSL:1m;
    ssl_session_timeout  5m;

    ssl_ciphers  HIGH:!aNULL:!MD5;
    ssl_prefer_server_ciphers  on;

    location / {
    }
}
Copy the code

Configure ports 80 and 443 respectively. After the configuration, run the following command to check whether the configuration is correct:

remote$ nginx -t -c /etc/nginx/nginx.conf
Copy the code

Test is successful.

Restart the nginx server:

remote$ nginx -s reopen
Copy the code

Visit zhangferry.com and http://zhangferry…

Figure bed

Figure bed choice

It is important to consider persistence, such as free temporary solutions and saving on some non-desktop sites are not reliable. If you visit some blogs, you’ve probably encountered images that have cracked and become unviewable because the image storage you used has been deleted or moved to another location. My blog used to use the Jane book chart bed, but now many of them are also unviewable. So the solution described below prioritizes storage stability and persistence.

The free version

The free versions are available on Github and Gitee, which store git repositories as images.

Github is slow to load when making graph bed, which can be solved by jsDeliver CDN service. Many of Github’s image links have been replaced with CDN links through jsDeliver.

Another solution is Gitee, which can be used normally, because the server is in China and the access speed is relatively fast. However, Gitee has a limitation that images can’t be displayed beyond 1M, so for certain images we need to crop and zoom.

Github+jsDeliver and Gitee are both recommended graphic bed solutions.

Paid version

The paid version can provide faster access speed and higher stability, but because the above free scheme has met my needs, so I did not make these attempts, the use of different map bed schemes is basically the same.

Figure bed tools

It is best to use PicGo with some handy tools, so that we can easily upload the specified pictures to the PicGo. Here’s a configuration tutorial: A tough map bed selection experience (MWeb+PicGo+Github).

This is an article from a year ago. Now I use Typora+PicGo+Gitee, and there is not much change between them.

Markdown tools

I used to use MWeb, but MWeb is a bit too much, until I found Typora, I immediately liked this simple Markdown editing tool, the key is free, love it. Although Typora interface is simple in fact many functions, it can be used with PicGo plug-in, so that the management of pictures is more convenient. Because it is a tool, I will not write a tutorial, we should explore a lot of will.