让我们先回顾下前两篇博客:
程序员如何从0到1搭建自己的技术博客
在个人博客中优雅的使用Gitalk评论插件
通过前两篇博客,我们了解了如何快速的从0到1搭建一个个人博客并使用了Gitalk评论插件,虽然博客现在是有了,但是存在一些缺点,主要有以下几点:
- 访问不稳定
- 百度收录不好
- 百度统计功能无法正常使用
作为一个有追求的程序员,岂能容忍这些缺点,哈哈,于是趁着阿里云Hi购季买了一台阿里云服务器,开启了将个人博客迁移至阿里云服务器的历程,谁知竟然倒腾了两三天,本篇博客就详细总结下在这个过程中遇到的问题,希望也能帮助到读到这篇文章的你。
1.服务器搭建Jekyll环境
说明:我这里购买的服务器是Windows系统的。
因为Jekyll是基于Ruby开发的,因此,我们需要在服务器上安装下Ruby,下载地址:https://rubyinstaller.org/downloads/。
整个的安装过程非常痛苦,试了各个版本,安装都没问题,就是最后编译博客成静态站点时,各种报错,网上也没有合适的解决方案,最后我选择了安装最新版:

软件的安装过程相对比较简单,这里就不做详细讲解。
安装完成后,我们可以打开cmd窗口,输入以下命令验证Ruby是否安装成功:
ruby -v
ruby 2.6.1p33 (2019-01-30 revision 66950) [x64-mingw32]
接下来,执行如下命令安装Jekyll:
gem install jekyll
安装完成后,输入以下命令校验:
jekyll -v
jekyll 3.8.5
2.服务器Git安装
Git的安装对各个开发来说,更加简单,这里只贴下Git的下载地址:https://git-scm.com/download/win
3.拉取GitHub代码并编译成静态站点
首先先拉取GitHub代码到服务器:
git clone https://github.com/zwwhnly/zwwhnly.github.io.git
然后使用Jekyll编译:

编译成功后会自动生成一个_site文件夹,里面的内容就是我们要部署的静态站点:

说明:这一步非常折腾人,特别容易出错,是因为安装的Ruby版本和GitHub仓库根目录的Gemfile.lock里的版本不一致,要修改下这个文件。
因为我已经修改完成了,你可以直接下载该文件替换你的文件即可:https://github.com/zwwhnly/zwwhnly.github.io/blob/master/Gemfile.lock。
如果还是编译报错,按照提示执行如下命令即可:
gem install {缺少的包名称,如jekyll-paginate}
4.服务器Nginx环境安装
现在静态站点已经成功生成,接下来就是部署的事情,这里我并没有使用传统的IIS来部署,而是选择使用Nginx来部署。
首先,下载Nginx安装包,下载地址:http://nginx.org/en/download.html

然后将下载的压缩包解压到指定的目录,解压后的结构如下:

双击nginx.exe运行nginx,在浏览器输入http://localhost查看效果如下:

5.修改Nginx配置
打开conf文件夹下的nginx.conf文件,修改配置如下(这里只标记了修改项,其余项可保持默认):
server {
listen 80;
server_name www.zwwhnly.com;
location / {
root C:/Nginx/nginx-1.12.2/zwwhnly.github.io/_site;
index index.html index.htm;
}
}
6.配置域名解析
登录阿里云后台配置域名解析:

7.网站备案
备案的过程很简单但是很繁琐,用的阿里云备案,前后耗时大概有4~5天。
友情提示:备案前准备好身份证,如果是在上海又不是上海户口,还需要准备居住证,更独特的是,还需要一个安卓手机,因为中间有一步要上传手持身份证照片校验,竟然只支持安卓手机(我是拿身份证耗时1天,拿居住证耗时1天,又拿了个安卓手机耗时1天,剩余的审批,阿里云备案效率还是挺高的)。
备案成功后,将备案号展示在网站底部:

8.验证
满心欢喜的在浏览器输入我的域名http://www.zwwhnly.com访问,结果一直访问不了,最后才发现是使用阿里云服务的原因。
最后的解决方案如下:
在阿里云控制台找到自己购买的ECS实例,配置安全组规则,因为我们使用的是默认的端口号80,因此添加的安全组规则如下:

此时,输入域名,访问网站成功:

9.总结
后续还是使用Markdown写作,博客写完后将代码提交到GitHub,然后去服务器执行如下命令(可以写成一个批处理bat文件),重新编译下站点:
cd C:\Nginx\nginx-1.12.2\zwwhnly.github.io
git pull https://github.com/zwwhnly/zwwhnly.github.io.git
jekyll build
如果嫌麻烦,可以添加一个任务计划程序定期执行该脚本,比如一天执行一次。
10.参考链接
jekyll 部署
windows安装jekyll步骤及问题
NGINX配置好之后,localhost可以访问,但域名无法访问?坑可能在阿里云