jekyll博客搭建和自动化部署

本文旨在教小伙伴用Jekyll和阿里云centos7服务器以及github自动搭建自己的服务器，也为了记录下自己的搭建过程。中间有自己踩的一些坑，参照了大神的搭建步骤，如有不足欢迎指正

服务器安装步骤

安装Node环境，执行以下命令：

wget https://nodejs.org/dist/v8.12.0/node-v8.12.0-linux-x64.tar.xz
xz -d node-v8.12.0-linux-x64.tar.xz
tar -xf node-v8.12.0-linux-x64.tar 
ln -s ~/node-v8.12.0-linux-x64/bin/node /usr/bin/node
ln -s ~/node-v8.12.0-linux-x64/bin/npm /usr/bin/npm
node -v 
npm -v

安装ruby

Jekyll依赖于Ruby环境，需要安装Ruby，执行以下命令即可：

wget https://cache.ruby-lang.org/pub/ruby/2.4/ruby-2.4.4.tar.gz
 mkdir  -p /usr/local/ruby
 tar -zxvf ruby-2.4.4.tar.gz 
 cd ruby-2.4.4
 ./configure --prefix=/usr/local/ruby
 make && make install

环境变量设置：

cd ~
vim .bash_profile
在.bash_profile 文件设置以下内容：

PATH=/usr/local/ruby/bin:$PATH:$HOME/bin
export PATH

安装gcc

安装gcc执行以下命令：

yum -y update gcc
yum install gcc-c++ libstdc++-devel或者
yum -y install gcc+ gcc-c++

更新失败时请看
https://www.cnblogs.com/bpzblog/p/13918199.html
https://www.jianshu.com/p/68a5b33099d2

安装jekyll

最后安装Jekyll，执行以下命令

yum install zlib-devel
yum install gem
gem update
gem install jekyll
jekyll --version
gem update --system

安装中如果报

ERROR:  Loading command: install (LoadError)
    cannot load such file -- zlib
ERROR:  While executing gem ... (NoMethodError)
    undefined method `invoke_with_build_args' for nil:NilClass

错误，则

进入ruby源码文件夹 （若按上面步骤，则cd ~ ll就会看到）
安装ruby自身提供的zlib包 
cd ext/zlib
ruby extconf.rb --with-zlib-dir=/usr/local/zlib
这时若出错，No rule to make target `/include/ruby.h', needed by `zlib.o'.  Stop.
其实是ext/zlib/Makefile中忘了给路径变量top_srcdir赋值,调用的时候当然就报错了，修改 Makefile 增加 top_srcdir = ../.. 
make
make install

问题解决
若不能解决，请参考报错请看这里
继续gem install jekyll
如果报错

Unable to require openssl, install OpenSSL and rebuild ruby (preferred) or use non-HTTPS sources

则

1. yum install openssl-devel -y
2. 在ruby安装包/root/ruby-2.4.4/ext/openssl，执行ruby ./extconf.rb
3.执行make,若出现make: *** No rule to make target `/include/ruby.h', needed by `ossl.o'.  Stop.;在Makefile顶部中的增加top_srcdir = ../..     添加完后保存重新执行make
4.执行make 
5.执行make install

问题解决
gem update --system
继续gem install jekyll
安装Jekyll成功

部署我的博客

安装git准备

yum install git

然后在linux下请fork本人或者直接fork jekyll源代码到自己的github

本人地址： 逍遥风github地址

git  clone 复制的地址

解压缩后进入加压缩文件夹内
然后bundle update,然后bundle exec jekyll serve(报依赖错误不多就多重复bundle update(直到update更新成功为止),依赖错误多就删除目录下Gemfile.lock文件,执行bundle update)
此时jekyll就可以启动成功了,此时可以通过curl命令查看服务器里部署的博客 例如curl www.xiaoyaowind.com

部署博客到Nginx服务器

新建文件/etc/yum.repos.d/nginx.repo
编辑以下内容并保存

[nginx]
name=nginx repo
baseurl=http://nginx.org/packages/centos/7/$basearch/
gpgcheck=0
enabled=1

执行安装nginx命令
yum install nginx

Nginx配置成功后，需要设置Nginx的配置，配置文件路径为/etc/nginx/conf.d/default.conf，配置的内容如下：

server {
    listen       80;
    server_name xiaoyaowind.com  www.xiaoyaowind.com;
    
       location / {
       root   /root/blog/html;
        index  index.html index.htm;
      }

    error_page  404              /404.html;

    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   /root/blog/html;
    }
   
   }

安装Nginx服务器成功后，需要将Jekyll编译的博客静态html文件输出到Nginx服务器上(记得加bundle exec 个人理解相当于windows下以兼容格式或者忽略版本差异模式编译)

cd git下是博客文件夹下 例如: cd /xiaoyaowind.github.io
  bundle exec  jekyll build --destination=/root/blog/html

启动Nginx服务器，就可以正常的访问博客网页
启动nginx

   cd  /usr/sbin
   ./nginx

如果需要在浏览器上访问，需要在阿里云ECS控制台的安全组件暴露80端口。如果想通过域名访问，需要将域名解析设置指向你的服务器。(这个自行百度)
非www域名的重定向到www
比如我想访问http://xiaoyaowind.com重定向到http://www.xiaoyaowind.com上，需要在Nginx的配置文件/etc/nginx/conf.d/default.conf，修改配置以下内容：

listen       80;
    server_name xiaoyaowind.com www.xiaoyaowind.com;


    if ( $host != 'www.xiaoyaowind.com' ) {
          rewrite "^/(.*)$" http://www.xiaoyaowind.com/$1 permanent;
         }

自动化部署

通过设置github的webhook可以实现自动化构建和部署。过程是，提交博文或者配置到github仓库，仓库会触发你设置的webhook，会向你设置的webhook地址发送一个post请求，比如我设置的请求是在服务器的跑的一个Nodejs程序，监听gitub webhook的请求，接受到请求后，会执行shell命令。

设置webhook

首先设置github仓库的webhook，在github仓库的项目界面，比我的我的项目界面https://github.com/xiaoyowind...，点击Setting->Webhooks->Add Webhook，在添加Webhooks的配置信息，我的配置信息如下：

Payload URL: http://www.xiaoyaowind.com/incoming
Content type: application/json
Secret: aaaaa12345678

这样Webhook就设置成功了。

安装监听组件以及自动构建

现在在博客所在的服务端去监听Github Webhook发送的请求，我采用的开源组件去监听github-webhook-handler，项目地址为：https://github.com/rvagg/gith...，首先安装：

npm install -g github-webhook-handler

安装成功后，在/root/node-v8.12.0-linux-x64/lib/node_modules/github-webhook-handler下新建deploy.js文件：

var http = require('http')
var createHandler = require('github-webhook-handler')
var handler = createHandler({ path: '/incoming', secret: 'aaaaa12345678' }) 
 
function run_cmd(cmd, args, callback) {
  var spawn = require('child_process').spawn;
  var child = spawn(cmd, args);
  var resp = "";
 
  child.stdout.on('data', function(buffer) { resp += buffer.toString(); });
  child.stdout.on('end', function() { callback (resp) });
}
 
http.createServer(function (req, res) {
  handler(req, res, function (err) {
    res.statusCode = 404
    res.end('no such location')
  })
}).listen(3002)
 
handler.on('error', function (err) {
  console.error('Error:', err.message)
})
 
handler.on('push', function (event) {
  console.log('Received a push event for %s to %s',
    event.payload.repository.name,
    event.payload.ref);
  run_cmd('sh', ['./start_blog.sh'], function(text){ console.log(text) });
})

上述代码中，指定了nodejs服务的践踏端口为3002，监听了path/incoming,Secret为aaaaa12345678，这和之前Github Webhook设置的要保持一致。代码run_cmd(‘sh’, [’./start_blog.sh’]，指定了接受到请求后执行./start_blog.sh，start_blog.sh文件的代码如下，首先进入到博客的代码文件，拉代码，编译。

echo `date`
cd /root/xiaoyaowind.github.io
echo start pull from github 
git pull
echo start build..
bundle exec jekyll build --destination=/root/blog/html

然后需要使用forever来启动deploy.js的服务，执行命令如下：

sudo npm install forever -g   #安装
$ forever start deploy.js          #启动
$ forever stop deploy.js           #关闭
$ forever start -l forever.log -o out.log -e err.log deploy.js   #输出日志和错误
/root/node-v8.12.0-linux-x64/lib/node_modules/forever/bin/forever start -l forever.log -o out.log -e err.log deploy.js

如果报错：
/root/node-v8.12.0-linux-x64/lib/node_modules/forever/bin/forever start -a -l forever.log -o out.log -e err.log deploy.js

本人deploy.js和start_blog.sh都在/root/node-v8.12.0-linux-x64/lib/node_modules/github-webhook-handler目录下，如果最后启动不成功，请查看err.log，如果日志里有3002则是因为端口已被占用，重启服务器并按步骤进入到指定目录并执行上面的如果报错命令。
最后一步，需要在nginx服务器的配置文件中添加配置，需要将监听的/incoming请求转发到nodejs服务上，配置代码如下：

location = /incoming {
     proxy_pass http://127.0.0.1:3002/incoming;
}

这样，当你提交了文章或者修改文件到gitub上，github通过webhook向你所在的服务器发送请求，服务器接收到请求后执行 sh命令，sh命令包括了重新pull代码和编译代码的过程，这样自动化部署就完成了，你只需提交代码，服务器就触发pull代码和重新编译的动作。

    好了，以上就是本人实践的jekyll和nginx自动化部署博客系统步骤了

本文由博客一文多发平台 OpenWrite 发布！