云服务器搭建网站全过程

发表于 | 更新于 | 分类于 | 阅读次数：

最近收到反馈说自己的刷题博客 https://leetcode.wang/ 无法访问，但我这里是正常的。

博客的话之前用的是 pages 服务，国内用户是解析到 coding 上，国外用户解析到 github 上，大概可能是 coding 的原因导致的一部分人打不开网站。

之前买了个阿里云的轻量云服务器，索性把刷题博客转移到上边吧。

如果网站放到国内的服务器上，域名的话是需要备案的，之前的话我已经备案过了，在阿里云上按流程一步一步走即可。

本着不求甚解的态度，下边仅仅记录过程了，看懂的前提是已经用过域名解析，CNAME 记录，了解过 Nginx，知道静态网站，会基本的 linux 命令操作。

系统版本是，CentOS 7.3 。

Nginx 基本配置

首先安装 Nginx。

1
yum install nginx

然后运行 nginx。

1
nginx

这时用浏览器访问服务器的 ip 地址就可以看到一个默认的网站了。

将 github 上的网站代码下载下来。

1
git clone XXX

进入 nginx 的配置目录

1
cd /etc/nginx/conf.d/

新建一个配置文件，如果添加多个网站，在这里继续新建 .conf 文件即可。

1
vim leetcode.conf

编辑配置文件，目录设置成刚刚在 github 下载下来的网站

1
2
3
4
5
6
7
8
server {
        listen 80;
        server_name  leetcode.wang;
        location / {
            root   /root/leetcode;
            index  index.html index.htm;
        }
}

编辑 nginx 的主配置文件，修改其权限为 root 。

1
vim /etc/nginx/nginx.conf

原值 #user nobody; 修改为 user root;

重新加载 nginx

1
nginx -s reload

去域名商将域名解析为配置文件中设置的 server_name，如果之前设置了 CNAME，记得删除。

此时访问 http://leetcode.wang/ 就发现成功了。

为了提高国外访问的速度，国外解析可以继续设置 github pages。

webhook 配置

github 收到更新后自动更新服务器端代码，参考了同学的一个教程 这里，帮助很大。

基本原理就是服务器监听一个端口，然后当 github 收到 push 以后，发送一条 get 请求给服务器，服务器收到以后执行已经写好的命令。

从 官方仓库 找到适合自己的包进行下载。

1
wget https://github.com/adnanh/webhook/releases/download/2.6.11/webhook-linux-amd64.tar.gz

解压

1
tar xzvf webhook-linux-amd64.tar.gz

编写要执行的命令脚本，随意新建一个文件夹，然后在里边编写 pull.sh 和 leetcode.json，这两个名字是随意的。

1
2
3
mkdir hook
cd hook
vim pull.sh

内容如下。

1
2
3
4
#!/bin/sh
cd ../leetcode
git reset --hard
git pull

编写 webhook 的配置文件，名字随意

1
vim leetcode.json

内容如下

1
2
3
4
5
6
[
        {
                "id": "leetcode",
                "execute-command": "/root/hook/pull.sh",
        }
]

然后回到 webhook 解压出来的文件夹中，执行 webhook 命令。

首先开启一个 screen 窗口。

1
screen -S hook

执行 webhook 命令

1
./webhook -hooks ../hook/leetcode.json -verbose

然后显示如下。

接下来按下 ctrl + a + d 将程序运行到后台。

将 http://ip:9000/hooks/{id} 这个加到 github 的 webhook 中。id 是上边配置的 leetcode，ip 是服务器的 ip。

github 添加路径是 Settings -> Webhooks -> Add webhooks

加完以后是下边的样子。

开启压缩

编辑 nginx 的主配置文件。

1
vim /etc/nginx/nginx.conf

将下边的代码加入其中，在 http 大括号内。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
# 开启gzip
gzip on;

# 启用gzip压缩的最小文件，小于设置值的文件将不会压缩
gzip_min_length 1k;

# gzip 压缩级别，1-10，数字越大压缩的越好，也越占用CPU时间
gzip_comp_level 6;

# 进行压缩的文件类型。javascript有多种形式。
# 其中的值可以在 mime.types 文件中找到。
gzip_types text/plain application/javascript application/json application/x-javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;

# 是否在http header中添加Vary: Accept-Encoding，建议开启
gzip_vary on;

# 禁用IE 6 gzip
gzip_disable "MSIE [1-6]\.";

就是下图的位置。

配置完记得重新加载配置。

1
nginx -s reload

然后可以在 这里 测试下是否压缩成功。

添加 HTTPS

在阿里云买一个免费的 SSL 证书，过几个小时就会通过验证。

然后把证书放到服务器上，可以通过 ftp 或者 github。

按照阿里云提供的教程配置即可。

https://help.aliyun.com/document_detail/98728.html

在 /etc/nginx 新建一个文件夹 cert ，把证书的两个文件放入。

然后把之前的 leetcode.conf 修改成下边的样子即可。

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
26
server {
        listen 80;
        server_name  leetcode.wang;
        location / {
            root   /root/leetcode;
            index  index.html index.htm;
        }
        rewrite ^(.*)$ https://$host$1 permanent;   #将所有http请求通过rewrite重定向到https。
}

server {
        listen 443 ssl;   #SSL协议访问端口号为443。此处如未添加ssl，可能会造成Nginx无法启动。
        server_name localhost;  #将localhost修改为您证书绑定的域名，例如：www.example.com。
        root html;
        index index.html index.htm;
        ssl_certificate cert/domain name.pem;   #将domain name.pem替换成您证书的文>件名。
        ssl_certificate_key cert/domain name.key;   #将domain name.key替换成您证书>的密钥文件名。
        ssl_session_timeout 5m;
        ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;  #使用此加密套件。
        ssl_protocols TLSv1 TLSv1.1 TLSv1.2;   #使用该协议进行配置。
        ssl_prefer_server_ciphers on;
        location / {
                root /root/leetcode;   #站点目录。
                index index.html index.htm;
        }
}

总

最后成功上岸，国内速度飞起。

windliang wechat