多远程服务器的Git同步设置经验

一、前言

昨天完成了“通过Hexo的本地部署,将博客文件可随时同步至Github Pages”,今天早上起来就在思考,正好自己还租用了一台搬瓦工的VPS服务器,闲着也是闲着,能不能在本地Git Bash生成基于Hexo框架的静态网页后,通过一键处理的方式,同时同步到Github与Bandwagon的Git仓库里面,这样一方面效率很高,另一方面,也可以防止任何一家服务商的空间服务出现不可预知的故障或停用的时候,自己的主页还能正常运转。通过近十个小时的不停歇折腾(抛开吃饭时间),终于将遇到的问题都解决,实现了“一键两更”的功能,开心。

二、搭建思路

在本地生成静态文件,把静态文件部署到VPS上,用Nginx直接做Web服务,由于hexo支持git的部署方式,从而可以实现从本地更新博客,方便快捷。

三、本地(Local PC)环境部署

准备 node 和 git 环境,
首先,安装 NodeJS,因为 Hexo 是基于 Node.js 驱动的一款博客框架。
然后,安装 git,一个分布式版本控制系统,用于项目的版本控制管理,作者是 Linux 之父。如果 Git 还不熟悉可以参考廖雪峰大神的 Git 教程。

两个工具不同的平台安装方法有所不一样,可自行了解按步骤安装,这里不详述了。安装成功后打开git bash(Windowns)或者终端(Mac),下方中将统一称为命令行。
在命令行中输入相应命令验证是否成功,如果成功会有相应的版本号。

1
2
3
git version
node -v
npm -v

1.安装Git

为了把本地的网页文件上传到github上面去,需要用到工具———Git。Git是目前世界上最先进的分布式版本控制系统,可以有效、高速的处理从很小到非常大的项目版本管理。
[windows版安装:]
到git官网上下载.exe文件,Download git,安装选项还是全部默认,只不过最后一步添加路径时选择Use Git from the Windows Command Prompt,这样我们就可以直接在命令提示符里打开git了。
安装完成后,在开始菜单里找到“Git”->“Git Bash”,蹦出一个类似命令行窗口的东西,就说明Git安装成功!顺便说一下,windows在git安装完后,就可以直接使用git bash来敲命令行了,不用自带的cmd,cmd有点难用。
安装完成后,还需要最后一步设置,在命令行输入:

1
2
$ git config --global user.name "Your Name" #我用的LittleFish...
$ git config --global user.email "email@example.com" #1400...

因为Git是分布式版本控制系统,所以,每个机器都必须自报家门:你的名字和Email地址。你也许会担心,如果有人故意冒充别人怎么办?这个不必担心,首先我们相信大家都是善良无知的群众,其次,真的有冒充的也是有办法可查的。

注意git config命令的–global参数,用了这个参数,表示你这台机器上所有的Git仓库都会使用这个配置,当然也可以对某个仓库指定不同的用户名和Email地址。
[linux版安装:]
对linux来说实在是太简单了,因为最早的git就是在linux上编写的,只需要一行代码

1
sudo apt-get install git

安装完成后,在命令提示符中输入git –version来查看一下版本验证是否安装成功。

2.安装Node.js

Hexo是基于node.js编写的,所以需要安装node.js和里面的npm工具。
[windows版安装:]
直接到https://nodejs.org/下载对应Windows版本(64位/32位)的Node.js程序。安装选项全部默认,一路点击Next。
安装好之后,按Win+R打开命令提示符,输入node -v和npm -v,如果出现版本号,那么就安装成功了。
[linux版安装:]

1
2
sudo apt-get install nodejs
sudo apt-get install npm

安装完后,打开命令行终端,输入:

1
2
node -v
npm -v

检查一下有没有安装成功

3.配置SSH key

要使用git工具首先要配置一下SSH key,为部署本地博客到远程服务器做准备。
打开CMD命令行,输入如下:

1
ssh-keygen -t rsa -C "email@example.com"   #前面已注册的邮箱1400...

在c:\user\dell\目录已生成.ssh文件夹用于保存本机秘钥,或在Git Bash中输入如下命令查询生成的公钥:

1
cat ~/.ssh/id_rsa.pub

公钥将被复制至各远程服务器,用于SSH远程链接时的身份认证。

4.安装Hexo

在本地创建一个文件夹MyBlog_Hexo,用来存放自己的博客文件。
在这个MyBlog_Hexo文件夹上直接右键git bash打开git的控制台窗口。
输入如下命令安装Hexo:

1
npm install -g hexo-cli

安装完后输入hexo -v验证是否安装成功。
至此hexo就安装完了。

5.配置Hexo

(1)网站框架初始化

输入如下命令初始化文件夹:

1
hexo init MyBlog_Hexo

安装必备组件:

1
2
cd MyBlog_Hexo      //进入该文件夹
npm install //组件安装

新建完成后,该文件夹MyBlog_Hexo目录下有:

1
2
3
4
5
6
7
8
.
├── _config.yml # 网站的配置信息,您可以在此配置大部分的参数。
├── package.json
├── scaffolds # 模版文件夹
├── source # 资源文件夹,除 _posts 文件,其他以下划线_开头的文件或者文件夹不会被编译打包到public文件夹
| ├── _drafts # 草稿文件
| └── _posts # 文章Markdowm文件
└── themes # 主题文件夹

至此网站的基本配置已经完成,有如下常用的命令:

1
2
3
hexo clean  #清除网站缓存
hexo g #根据博客文章的源文件生成待发布的静态网页
hexo s #打开本地服务器

然后浏览器打开http://localhost:4000/,就可以看到博客页面了。
按ctrl+c关闭本地服务器。

(2)网站配置文件

针对网站的一些基本信息进行配置:

网站基本信息

1
2
3
4
5
6
7
8
# Site
title: 小屁屁的成长路程 #标题
subtitle: '' #副标题
description: '总得有一处空间,可以记得她的成长经历,等她长大之后,能够回顾自己父母眼中的过往,能够更坦然的面对生活,更有勇气去做自己。' #网站描述
keywords:
author: Frank Q #作者
language: zh-Hans #博客使用的语言
timezone: 'Asia/Shanghai' #网站时区(Hexo默认使用您电脑的时区,可不用写)

网页链接形式

Hexo框架可以选择两种链接形式,默认为四级链接,但是为了后续让搜索引擎更好的检索网站内容,建议修改为一级链接:

1
2
#permalink: :year/:month/:day/:title/  #绝对网页链接为四级链接
permalink: :title/ #绝对网页链接为一级链接

博文文件名称格式

默认的博文文件名称为“文章标题.md”,但是随着时间的推移,撰写生成的博文文件越来越多,不方便一目了然的查找与管理原始文件,因此在新生成的博文文件名字前添加日期信息,将有助于管理:

1
new_post_name: :year-:month-:day:title.md    #新写一篇博文时,博文文件名称的格式

更好网站主题

如果需要更换网站的主题,只需要下载好主题后,将主题目录放置到\MyBlog_Hexo\themes\目录下,然后按如下字段信息修改当前网站应用的主题名称,即可让主题生效:

1
theme: next  #更换主题为next

发布服务器

如果需要将生成的静态网页发布至远程服务器(VPS等),则需要设置发布服务器的信息,可设置多个发布服务器信息:

1
2
3
4
5
6
7
deploy:  
- type: git
repository: https://github.com/LittleFishinSea/LittleFishinSea.github.io #github仓库
branch: master
- type: git
repo: git@**.***.***.**:hexo.git #VPS上创建的git仓库
branch: master

(2)生成新博客文件 & 写文章

博客搭好了,就开始写文章了,新建文章,输入以下命令即可:

1
hexo new post "文章标题"

执行完成后可以在/source/_posts下看到一个“year-month-day文章标题.md”的文件。
.md 就是 Markdown 格式的文件。在 Markdown 文章里面输入你的文章内容。

(3)上传与发布

安装部署插件

编写完markdown文件后,根目录下输入hexo g生成静态网页,然后输入hexo s可以本地预览效果,但如果想把生成的静态网页上传至远程服务器(VPS或Github这样的),还需在博客根目录下右键打开Git Bash安装部署插件 hexo-deployer-git:

1
npm install hexo-deployer-git --save

修改网站配置文件的发布服务器信息

打开博客根目录下的网站配置文件_config.yml:

1
2
3
4
deploy:
type: git
repository: 远程服务器网址或IP #例如https://github.com/LittleF.../LittleF....github.io
branch: master

发布命令

最后执行以下命令就可以部署上传啦,以下 g 是 generate 缩写,d 是 deploy 缩写:

1
hexo g -d

或:

1
2
3
hexo clean
hexo g
hexo d

稍等一会,在浏览器访问网址:https://远程服务器网址或IP 就会看到你的博客啦!!

6.NexT主题

四、VPS(Debian 9)环境部署

1.安装sudo

如果在执行命令时,出现-bash sudo : command not found 这样的提示,解决办法如下:
(1)首先看一下 /etc/sudoers.d 文件是否存在 ,如果没有的话就说明所在系统还未安装sudo,安装命令 :

1
apt-get install sudo

(2)如果你的 /etc/sudoers.d 文件存在则说明你的系统已经安装,只不过没有配置环境。
当你使用sudo去执行一个程序时,处于安全的考虑,这个程序将在一个新的、最小化的环境中执行,也就是说,诸如PATH这样的环境变量,在sudo命令下已经被重置成默认状态了。所以当一个刚初始化的PATH变量中不包含你所要运行的程序所在的目录,用sudo去执行,你就会得到”command not found”的错误提示。
要想改变PATH在sudo会话中的初始值,用文本编辑器打开/etc/sudoers文件,找到”secure_path”一行,当你执行sudo 命令时,”secure_path”中包含的路径将被当做默认PATH变量使用。

1
2
添加所需要的路径(如 /usr/local/bin)到"secure_path"下。
Defaults    secure_path = /sbin:/bin:/usr/sbin:/usr/bin:/usr/local/bin

2.安装vim

Debian9有时候安装的时候没有vim,在centos用习惯了vim,安装命令如下:

1
apt-get install vim

安装完后,查看 vim 是否支持 clipboard 功能:

1
vim --version | grep clipboard

如果有 +clipboard 则跳过这一步; 如果显示的是 -clipboard 说明不支持vim与系统粘贴板之间的复制粘贴功能, 需要安装:

1
sudo apt install vim-gtk

至此,可使用 + 寄存器与系统粘贴板互通数据, “+yy 等操作。或者直接按住shift用鼠标左键选择需要复制的内容,然后到windows粘贴板中粘贴即可。

3.安装Git

1
2
sudo apt-get install git-core  # Ubuntu,Debian
sudo yum install git-core # Fedora, Red Hat, CentOS

4.建立Git仓库

(1)新建git用户

1
2
3
adduser git               #新建git用户
passwd git #设置账户密码
gpasswd -a git sudo #为git用户添加sudo权限

(2)建立裸仓库

1
2
3
cd /home/git              #进入git目录
git init --bare hexo.git #建立名为hexo.git的裸仓库
chown -R git:git hexo.git #修改仓库用户属主:将该文件夹和文件夹下的所有文件和文件夹的用户和所在组改成git以及git组

(3)创建客户端SSH登录证书

原理:将本地机器(Local PC)上生成的ssh公钥填入远程服务器(VPS)/home/git/.ssh/authorized_keys文件。

客户端创建SSH私钥和公钥

1
2
ssh-keygen -t rsa -C "1400..@qq.com"  #首次,新生成私钥和公钥
cat ~/.ssh/id_rsa.pub #如果之前已生成,该命令可直接读取Local PC上生成的公钥信息

git服务器打开RSA验证

首先打开服务器端的SSH配置文件:

1
vim /etc/ssh/sshd_config

在配置文件中,让下面各项生效(找到各项,并去掉前面的#号):

1
2
3
RSAAuthentication        yes
PubkeyAuthentication yes
AuthorizedKeysFile .ssh/authorized_keys

git服务器配置公钥

在git用户的主目录里新建.ssh文件夹,然后在文件夹里面新建文件authorized_keys:

1
2
3
cd /home/git            #进入git主目录
mkdir .ssh #新建.ssh文件夹
cd .ssh #进入.ssh文件夹

现在开始配置公钥文件。
方法1:

1
vim authorized_keys     #调用vim编辑authorized_keys

粘贴公钥,:wq,保存退出,即完成服务器端SSH公钥的部署。
方法2:

1
nano /home/git/.ssh/authorized_keys

粘贴公钥,Ctrl+x保存,输入y,然后回车,即完成服务器端SSH公钥的部署。

5.安装Nginx

1
sudo apt-get install nginx

使用nginx -v查看,显示版本号则安装成功。

6.配置Nginx

(1)创建网站目录

1
2
3
cd /var/www                      #进入www文件夹
mkdir hexo #新建名为hexo的新文件夹
chown git:git -R /var/www/hexo #修改仓库用户属主:将该文件夹和文件夹下的所有文件和文件夹的用户和所在组改成git以及git组

(2)修改配置文件

我的博客网站配置文件位于/etc/nginx/conf.d/hexo.conf,输入:

1
vi /etc/nginx/conf.d/hexo.conf
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
server {
# 默认80端口
listen 80 default_server;
listen [::]:80 default_server;
# 修改server_name为自己之前注册好的域名,没有就不用更改
server_name localhost;
# 修改网站根目录,在这里存放你的Hexo静态文件,请自行选择或创建目录
root /var/www/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 {
}
}

注意,笔者是将/var/www/hexo作为Nginx服务器根目录,这里随喜好,但是要注意文件权限问题。
编辑nginx配置文件,解决80端口占用的冲突问题:

1
vim /etc/nginx/nginx.conf

将以下include文件注释掉,避免启动的时候会用nginx的欢迎页面占用80端口:

1
2
3
4
5
...
include /etc/nginx/conf.d/*.conf;
#include /etc/nginx/sites-enabled/*; 该文件调用的另外一个配置文件中,将会在80端口调用nginx的默认欢迎页面,会与hexo博客网站的配置文件端口冲突,因此注释掉该行
}
...

保存后重启Nginx服务器:

1
service nginx restart

7.通过Git Hooks实现自动部署

git服务器的中央仓库其实只是一个中介,如果你想要把中央仓库的代码关联到你域名挂载下的文件夹时候,就需要使用到git的钩子来实现,当客户端提交代码到中央仓库,中央仓库能将代码也推送到另外的一个文件夹下面

进入hooks所在目录(因已变更过权限属主,需要切换到git用户才能进入此目录),新建/编辑post-receive文件:

1
2
cd ~/hexo.git/hooks
vi post-receive

输入如下内容,并保存后退出:

1
2
3
4
5
6
7
8
#!/bin/bash
GIT_REPO=/home/git/hexo.git # git仓库
TMP_GIT_CLONE=/tmp/hexo
PUBLIC_WWW=/var/www/hexo # 网站目录
rm -rf ${TMP_GIT_CLONE}
git clone $GIT_REPO $TMP_GIT_CLONE
rm -rf ${PUBLIC_WWW}/*
cp -rf ${TMP_GIT_CLONE}/* ${PUBLIC_WWW}

赋予post-receive文件可执行权限:

1
chmod +x post-receive

至此,所有配置基本完成。

五、棘手问题与解决方法

在上述配置完成的基础上,在本地执行:

1
hexo g -d

却遇到可以上Github上传,但是不能上Bandwagon上传的问题,提示服务器端22端口拒绝访问。
原来我已经在Bandwagon修改过端口号,但是本地Local PC与Github服务器又都是默认SSH通过22端口走。
解决办法:
进入Local PC的c:\user\dell\.ssh目录(即SSH公钥私钥生成的目录)。
鼠标右键新建名为config的文件,用记事本打开此文件,输入如下内容:

1
2
3
4
5
6
7
8
9
10
11
12
# Frank Q's git servers
Host Bandwagon的IP地址
HostName Bandwagon的IP地址
User git
Port Bandwagon的SSH端口
IdentityFile ~/.ssh/id_rsa

Host github.com
HostName github.com
User git
Port 22
IdentityFile ~/.ssh/id_rsa

问题解决。

六、后记

至此,通过一天的折腾,“一键两更”的最初目标达成,很开心。
这篇文章是在配置成功一两天后写成的,仅作为记录之用。
由于个人水平限制难免有不合理之处,在实现功能过程中也借鉴了大量网络上的前辈资料指引,将自己的搭建经验总结成册,如能帮到各位也在不断探索路上的小伙伴,不甚荣幸。
【完】