网络基础之在VPS上搭建Hexo博客

服务器平台:vultr(VPS提供商),而不是github

软件平台:CentOS,Nginx

一、配置服务器端环境:

1、VPS新建CentOS Server上搭建Nginx

passwd # Windows 10环境下,通过putty登录(复制初始密码,通过鼠标右键粘贴),修改root密码

rpm -q centos-release # centos-release-7-3.1611.el7.centos.x86_64

yum install epel-release # 安装 CentOS 7 EPEL 源,似乎没有必要,所以没有执行

yum install nginx # 安装 Nginx

systemctl start nginx #启动Nginx

firewall-cmd –permanent –zone=public –add-service=http #添加 HTTP 和 HTTPS 端口到防火墙允许列表

sudo firewall-cmd –permanent –zone=public –add-service=https

sudo firewall-cmd –reload

sudo systemctl restart firewalld.service

打开浏览器,复制Server的ip地址,回车,就会看到欢迎页面:“Welcome to nginx on Fedora!”。注意提示:index.html在“/usr/share/nginx/html”目录中,nginx配置文件在“/etc/nginx/nginx.conf”

curl 127.0.0.1 # 会显示Nginx主页的html代码

yum install net-tools #安装网络工具

netstat -ntpl #确认Nginx打开了80端口,但是没有443端口,为啥?

netstat测试内容如下:
Active Internet connections (only servers)

Proto Recv-Q Send-Q Local Address Foreign Address State PID/Program name

tcp 0 0 0.0.0.0:80 0.0.0.0:* LISTEN 2493/nginx: master

tcp 0 0 0.0.0.0:22 0.0.0.0:* LISTEN 429/sshd

tcp 0 0 127.0.0.1:25 0.0.0.0:* LISTEN 606/master

tcp6 0 0 :::80 :::* LISTEN 2493/nginx: master

tcp6 0 0 :::22 :::* LISTEN 429/sshd

tcp6 0 0 ::1:25 :::* LISTEN 606/master
2、配置Nginx虚拟主机

mkdir -p /usr/share/nginx/blog/html #新建blog目录用于放置Hexo,新建一个测试用index.html主页文件

vi /etc/nginx/conf.d/blog.conf #新建虚拟主机配置文件,因为nginx配置文件(/etc/nginx/nginx.conf)内包含一行内容”include /etc/nginx/conf.d/*.conf;“,所以是可行的。

systemctl restart nginx #重启 Nginx 服务器,使nginx服务器虚拟主机设定生效

新配置文件”blog.conf”内容如下:
server {

listen 80;

listen [::]:80;

root /usr/share/nginx/blog/html;

index index.html index.htm index.nginx-debian.html;

server_name zhangqihui.mobi www.zhangqihui.mobi;

location / {

try_files $uri $uri/ =404;

}

}
本地Windows 10电脑,编辑“C:\Windows\System32\drivers\etc/hosts” #增加一行“xx.xx.xx.xx zhangqihui.tk“ 将服务器ip地址指向自己的域名,打开浏览器,通过域名就可以看到虚拟机测试主页了。(我先设置了DNS CNAME,没有测试)

3、到DNS将域名解析到服务器地址

到godaddy,配置zhangqihui.mobi DNS指向VPS ip地址

到tk网站,通过我的Facebook账户登录,将zhangqihui.tk指向服务器ip地址 #因tk网站不稳定,改用godaddy
4、部署Hexo

yum install git #在 VPS 上安装 git

cd ~

mkdir blog.git && cd blog.git #创建空白 git 仓库,并且设置 git hook

git init –bare #返回提示“Initialized empty Git repository in /root/blog.git/”

cd hooks

vi post-receive #创建脚本,并写入内容

chmod +x post-receive #赋予脚本的执行权限

在 /root/blog.git/hooks/post-receive 脚本内容如下:

#!/bin/bash
GIT_REPO=/root/blog.git #git仓库
TMP_GIT_CLONE=/tmp/blog
PUBLIC_WWW=/usr/share/nginx/blog/html #网站目录
rm -rf ${TMP_GIT_CLONE}
git clone $GIT_REPO $TMP_GIT_CLONE
rm -rf ${PUBLIC_WWW}/*
cp -rf ${TMP_GIT_CLONE}/* ${PUBLIC_WWW}

二、配置本机环境

1、Windows 10 安装Hexo环境

缺省设置安装git; # (2.15.1) 64-bit version of Git for Windows ,需要FQ,TNND!

缺省设置安装Node.js; # node-v9.2.0-x64.msi
在D盘新建hexo目录,通过鼠标右键命令“Git Bash Here”
$ npm install hexo-cli -g
提示如下:
C:\Users\qdmca\AppData\Roaming\npm\hexo -> C:\Users\qdmca\AppData\Roaming\npm\node_modules\hexo-cli\bin\hexo

npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.1.3 (node_modules\hexo-cli\node_modules\fsevents):

npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.1.3: wanted {“os”:”darwin”,”arch”:”any”} (current: {“os”:”win32”,”arch”:”x64”})

added 217 packages in 68.345s
$ hexo init blog #在 blog 目录下初始化 hexo 博客
提示如下:
INFO Cloning hexo-starter to D:\hexo\blog

Cloning into ‘D:\hexo\blog’…

remote: Counting objects: 62, done.

remote: Compressing objects: 100% (2/2), done.

remote: Total 62 (delta 0), reused 2 (delta 0), pack-reused 59

Unpacking objects: 100% (62/62), done.

Submodule ‘themes/landscape’ (https://github.com/hexojs/hexo-theme-landscape.git) registered for path ‘themes/landscape’

Cloning into ‘D:/hexo/blog/themes/landscape’…

remote: Counting objects: 785, done.

remote: Total 785 (delta 0), reused 0 (delta 0), pack-reused 785

Receiving objects: 100% (785/785), 2.53 MiB | 1.08 MiB/s, done.

Resolving deltas: 100% (410/410), done.

Submodule path ‘themes/landscape’: checked out ‘73a23c51f8487cfcd7c6deec96ccc7543960d350’

INFO Install dependencies

▒▒Ϣ: ▒▒▒ṩ▒▒ģʽ▒޷▒▒ҵ▒▒ļ▒▒▒

npm WARN deprecated swig@1.4.2: This package is no longer maintained

npm notice created a lockfile as package-lock.json. You should commit this file.

npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.1.3 (node_modules\fsevents):

npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.1.3: wanted {“os”:”darwin”,”arch”:”any”} (current: {“os”:”win32”,”arch”:”x64”})

added 429 packages in 22.993s

INFO Start blogging with Hexo!
$ cd blog #进入博客根目录,并且安装相关插件依赖等

$ npm install
提示如下:
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.1.3 (node_modules\fsevents):

npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.1.3: wanted {“os”:”darwin”,”arch”:”any”} (current: {“os”:”win32”,”arch”:”x64”})

added 116 packages in 10.783s
$ hexo g # 渲染 Source 目录下文件问静态页面
提示如下:
INFO Start processing

INFO Files loaded in 314 ms

INFO Generated: index.html

INFO Generated: archives/index.html

INFO Generated: fancybox/jquery.fancybox.js

INFO Generated: fancybox/fancybox_loading.gif

INFO Generated: fancybox/blank.gif

INFO Generated: fancybox/jquery.fancybox.css

INFO Generated: fancybox/fancybox_loading@2x.gif

INFO Generated: archives/2017/index.html

INFO Generated: fancybox/jquery.fancybox.pack.js

INFO Generated: fancybox/fancybox_overlay.png

INFO Generated: fancybox/fancybox_sprite@2x.png

INFO Generated: css/fonts/FontAwesome.otf

INFO Generated: fancybox/fancybox_sprite.png

INFO Generated: fancybox/helpers/jquery.fancybox-buttons.css

INFO Generated: fancybox/helpers/jquery.fancybox-thumbs.css

INFO Generated: fancybox/helpers/jquery.fancybox-buttons.js

INFO Generated: archives/2017/12/index.html

INFO Generated: fancybox/helpers/jquery.fancybox-thumbs.js

INFO Generated: css/style.css

INFO Generated: css/fonts/fontawesome-webfont.eot

INFO Generated: css/fonts/fontawesome-webfont.woff

INFO Generated: js/script.js

INFO Generated: css/images/banner.jpg

INFO Generated: fancybox/helpers/jquery.fancybox-media.js

INFO Generated: css/fonts/fontawesome-webfont.ttf

INFO Generated: 2017/12/03/hello-world/index.html

INFO Generated: fancybox/helpers/fancybox_buttons.png

INFO Generated: css/fonts/fontawesome-webfont.svg

INFO 28 files generated in 844 ms
$ hexo s # 本地跑一个 server 来看博客效果
提示如下:
INFO Start processing

INFO Hexo is running at http://localhost:4000/. Press Ctrl+C to stop.
本地浏览器打开网址“http://localhost:4000/”,测试hexo安装成功 #如果通过路由器端口映射,应该在外网也能看到

2、配置本机环境

$ npm install hexo-deployer-git –save #在博客目录下运行下面命令,安装 git 部署工具
提示如下:
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.1.3 (node_modules\fsevents):

npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.1.3: wanted {“os”:”darwin”,”arch”:”any”} (current: {“os”:”win32”,”arch”:”x64”})

added 132 packages in 18.447s

qdmca@ASUS13 MINGW64 /d/hexo/blog
编辑博客配置文件“_config.yml”为如下内容(修改deploy选项,注意,冒号后面有空格,否则会出错!):
deploy:

type: git

message: update

repo:

s1: root@45.32.227.150:/root/blog.git/,master
$ git config –global user.email “3dlinux@gmail.com“ #配置本地git用户信息

$ git config –global user.name “root”

$hexo d #部署本地渲染网页到服务器上
本文参考:从 0 开始搭建 hexo 博客