搭建hexo博客：阿里云+github+域名+自动部署webhook

最新推荐文章于 2022-12-04 11:47:54 发布

bookjiang16

最新推荐文章于 2022-12-04 11:47:54 发布

阅读量736

点赞数

分类专栏：杂记文章标签：经验分享博客网站个人博客网站个人博客网站源码网站源码 asp网站

本文链接：https://blog.csdn.net/qq_38239817/article/details/107227501

版权

杂记专栏收录该内容

3 篇文章 0 订阅

订阅专栏

一、本地环境配置

1.安装Node.js

最好去官网下载最新安装包，不然可能会导致因为node版本问题无法正常使用hexo。（我当时尝试单独升级node，发现npm与node版本又不匹配，所以直接下载安装了）

1.1下载Win10版nvm

下载一直next安装即可，注意管理员身份和路径中不要有中文名

1.2配置npm和node.js的下载源

编辑nvm目录下的settings.txt文件,在最后加入如下内容

node_mirror: https://npm.taobao.org/mirrors/node/
npm_mirror: https://npm.taobao.org/mirrors/npm/

1.3下载npm和node.js

nvm v检查nvm是否安装成功
安装node nvm install 8.0.0
使用node nvm use 8.0.0
检查node和npm: node nvm use 8.0.0 npm -v
安装多个node版本并切换: nvm list安装最新的node.js及配套npmnvm install latest
如果想要切换:nvm use 想要使用的node版本

2.安装git

下载git安装

利用git -version 确认是够安装成功

配置github用户名和邮箱地址

git config --global user.name “xxxxxx” # 自行替换
git config --global user.email “xxxxxx@xx.com” # 自行替换

执行生成密钥

ssh-keygen -t rsa -b 4096 -C "your_email@example.com" # 你的 GitHub邮箱地址

一直enter即可

~/.ssh文件夹下就会生成id_rsa（私有秘钥）和id_rsa.pub（公有密钥），找到公钥打开复制

进入github->settting->新增ssh key

完成后检查测试配置是否成功

$ ssh -T git@github.com
The authenticity of host 'github.com (13.229.188.59)' can't be established.
RSA key fingerprint is SHA256:nThbg6kXUpJWGl7E1IGOCspRomTxdCARLviKw6E5SY8.
Are you sure you want to continue connecting (yes/no/[fingerprint])? yes
Warning: Permanently added 'github.com,13.229.188.59' (RSA) to the list of known hosts.

看到这个即可

Hi bookjiang! You've successfully authenticated, but GitHub does not provide shell access.

3.新建一个github仓库用于存放博客文件

4.Hexo安装

sudo npm install -g hexo-cli

验证安装

hexo -v

在这里出现问题

安装hexo出问题，可以更换源

npm config set registry https://registry.npm.taobao.org

npm config list

我又在用hexo时出现SyntaxError: Unexpected token …
原因应该是版本问题，重新去官网下载node.js安装即可

使用Hexo

本地新建一个文件夹Blog，保存hexo代码库，初始化

hexo init

安装代码仓库所需要的依赖包

npm install

执行命令本地预览页面效果

hexo generate #也可简写为hexo g
hexo server #简写为hexo s

输入http://localhost:4000 打开页面,可以看到一个hexo的模板

Ctrl+C中断

hexo new post "first blog" # 注意标题中有空格需要用双引号包起来

source/_post文件夹下会有个first-blog.md文件
再次启动

hexo s

配置hexo的发布

安装hexo的git部署插件

npm install hexo-deployer-git --save

修改项目下配置文件_config.yml，文件最下方修改

deploy:
type: git
repo: git@github.com:your_name/blog-web.git # 替换为刚才新建git代码库的ssh链接
branch: master

配置好后更新至github

hexo clean && hexo g # 清楚本来的打包代码并生成出新的

hexo d # hexo deploy的简写命令`

二、服务器配置

我用的BatchShell连接远程服务器（容易断连，后期还是用putty软件）
注意打开阿里云相关安全端口（在浏览器中进入阿里云控制台主页）
安全组放开三个端口：80/80，443/443,7777/7777
服务器防火墙开放80、443、7777端口
域名映射到服务器公网ip（省略了步骤）

1.安装Node.js

1.1安装curl

yum -y install curl
curl --version

1.2安装nvm

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.35.3/install.sh | bash

如果失败了可能github域名污染，修改hosts文件即可vim /etc/hosts
添加199.232.28.133 raw.githubusercontent.com保存后重新执行source ~/.bash_profile即可。

下载完后执行nvm可能会提示”nvm： command not found,可以手动添加环境变量我的文件在/root下

vi .bash_profile

添加这段内容export NVM_DIR="$HOME/.nvm" [ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"
再次执行source ~/.bash_profile

1.3通过nvm安装node.js

查看node版本nvm list -remote
选择安装任意版本 nvm install v8.11.4
查看已安装的node版本node list
切换到想要使用的版本nvm use v8.11.4
将此版本设置为默认版本nvm alias default v8.11.4
验证是否安装成功node --version npm -v

2安装git并配置

yum -y install git

用git -version确认
第一次配置需要你的github用户名和邮箱地址

git config --global user.name “xxxxxx” # 自行替换
git config --global user.email “xxxxxx@xx.com” # 自行替换

生成密钥：

ssh-keygen -t rsa -b 4096 -C "your_email@example.com" # 你的 GitHub邮箱地址

一直enter即可，最后看到密钥的image即可
此时~/.ssh文件夹下就会生成id_rsa（私有秘钥）和id_rsa.pub（公有密钥），将公钥复制带粘贴板
进入github->setting->SSH and GPG keys->new SSH key粘贴进入，Title随意取
完成后测试配置是否成功

ssh -T git@github.com
Hi xxxx! You've successfully authenticated, but GitHub does not provide shell access.

在服务器端新建一个文件目录存放博客代码

cd /root
mkdir Blog 
cd Blog
mkdir hexo
cd hexo
git clone git@github.com:yourname/hexo.git # 自行替换为用于存放博客代码的仓库ssh地址

3.安装及配置Nginx

新建一个文件夹cd /opt mkdir Nginx

1、 下载
wget http://nginx.org/download/nginx-1.9.9.tar.gz
# 解压
tar -xvf nginx-1.9.9.tar.gz
# 重命名（太长）
mv  nginx-1.9.9  nginx
2.配置、编译及安装
./configure
make
make install

配置环境变量vi /root/.bash_profile
添加export PATH="${PATH}:/usr/local/nginx/sbin"
执行source .bash_profile

修改默认配置文件（我的配置文件在/usr/local/nginx/conf/nginx.conf）

vi nginx.conf

修改http中server中的内容

 server {
        listen       80;
        server_name  www.zhiqiang.online;#自己服务器域名

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

        location / {
            root   /root/Blog/hexo;  #服务器中博客目录
            index  index.html index.htm;
        }

        #error_page  404              /404.html;

        # redirect server error pages to the static page /50x.html
        #
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }

        # proxy the PHP scripts to Apache listening on 127.0.0.1:80
        #
        #location ~ \.php$ {
        #    proxy_pass   http://127.0.0.1;
        #}

        # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
        #
        #location ~ \.php$ {
        #    root           html;
        #    fastcgi_pass   127.0.0.1:9000;
        #    fastcgi_index  index.php;
        #    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;
        #    include        fastcgi_params;
        #}

        # deny access to .htaccess files, if Apache's document root
        # concurs with nginx's one
        #
        #location ~ /\.ht {
        #    deny  all;
        #}
    }

启动nginx，在nginx目录中直接nginx启动
可以配置自启（省略）

4.安装pm2

pm2是node的守护进程管理器,安装pm2可以在使用webhooks时创建的服务进行维护
安装

npm install -g pm2 # npm 在装node时已经自动安装
pm2 -v # 查看pm2版本

pm2 命令

pm2 start filename# 执行对应路径脚本
pm2 list # 查看看起的进程列表
pm2 restart <name|id> # 重启对应进程
pm2 delete <name|id|‘all’> # 删除对应的进程 all是全部
pm2 logs # 查看进程打印日志
pm2 monit # 监控每个 node 进程的 cpu 和内存使用情况

5.安装webhooks和配置github的webhooks

5.1服务端配置

因为shell脚本中cd命令执行有问题，所以我将webhook脚本直接放在hexo博客所在目录，就不用cd去切换目录了。
安装webhooks

npm install -g github-webhook-handler

切换目录cd /root/Blog/hexo
添加脚本文件webnook.js

var http = require('http')
var createHandler = require('/root/.nvm/versions/node/v8.11.4/lib/node_modules/github-webhook-handler') //更换自己gitwebhook目录
var handler = createHandler({ path: '/', secret: '226713' }) 
// 上面的 secret 保持和 GitHub 后台设置的一致
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(7777)
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', ['./deploy.sh',event.payload.repository.name], function(text){ console.log(text) });
})

添加shell脚本deploy.sh

#!/bin/bash
# 网站的根目录
WEB_PATH='/root/Blog/hexo'
 
echo "start deployment"
cd $WEB_PATH
#echo $(pwd) 
#echo $(date)
#echo $(whoami)
echo "fetching from remote..."
# 为了避免冲突，强制更新本地文件
echo $(sudo git fetch --all) #echo用于输出测试用，加sudo因为不加因为权限问题无法执行git命令
echo $(sudo git reset --hard origin/master)
echo "done"

用pm2运行脚本webhook.js

pm2 start webhook.js

用pm2 list去查看运行状态

5.2github上设置webhook

进入博客项目，点击setting
在这里插入图片描述

添加webhook
在这里插入图片描述

在这里插入图片描述
然后会显示测试成功，我的截图为：

测试

在win10上

hexo new post "test blog"
hexo clean && hexo g
hexo d

如果配置成功，服务器上的博客项目也会自动更新，访问域名即可观察到变化

参考博客

[1]参考链接

[2]shell中无法执行git命令
 [3]webhook.js和deploy.sh脚本参考
 [4]putty客户端密钥登录
 [5]nginx配置自动启动
 [6]Linux下Nginx的卸载、安装以及基本使用

bookjiang16

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
2
评论
搭建hexo博客：阿里云+github+域名+自动部署webhook

一、本地环境配置1.安装Node.js最好去官网下载最新安装包，不然可能会导致因为node版本问题无法正常使用hexo。（我当时尝试单独升级node，发现npm与node版本又不匹配，所以直接下载安装了）1.1下载Win10版nvm下载一直next安装即可，注意管理员身份和路径中不要有中文名1.2配置npm和node.js的下载源编辑nvm目录下的settings.txt文件,在最后加入如下内容node_mirror: https://npm.taobao.org/mirrors/node/
复制链接

扫一扫