在个人服务器上搭建Hexo简易博客

发布于 2020-07-01  26 次阅读


前言

本文章可以引导你搭建自己的博客,参考链接:Never的个人博客,在此基础上我添加了一些步骤和个人遇到错误的解决方法
注意,本博客服务器操作基于CentOS 7 64位,如果使用其他Linux系统出现命令未找到的情况请自行百度

准备工作

首先,我们得有一个自己的服务器,没有也行,本地测试部署,有了之后再部署到服务器。
我这里使用的是阿里云的服务器,购买之后我们进入阿里云的控制台,找到我们购买的云服务器ECS,复制公网IP:
公网IP
然后使用FinalShell连接到我们的云服务器,推荐使用FinalShell的原因是FinalShell会在下方自带一个文件夹列表,方便我们阅览,FinalShell可在官网下载。
FinalShell

服务器端配置

安装 Nginx

连接好之后我们就需要安装Nginx,安装Nginx需要相关的依赖库,我们先进行库的安装。

安装 gcc gcc-c++

yum install -y gcc gcc-c++

安装 PCRE 库

cd /usr/local/
wget https://sourceforge.net/projects/pcre/files/pcre/8.44/pcre-8.44.tar.gz
tar -xvf pcre-8.44.tar.gz
cd pcre-8.44
./configure
make && make install

安装完成之后我们可以查看一下版本,如果没有打印出版本号或者出错,请仔细检查步骤是否错误。

pcre-config --version

安装 openssl 、zlib 、 gcc 依赖

yum -y install make zlib zlib-devel gcc-c++ libtool openssl openssl-devel

安装 Nginx

Nginx安装一定要在/usr/local/目录下

cd /usr/local/
wget http://nginx.org/download/nginx-1.17.9.tar.gz
tar -xvf nginx-1.17.9.tar.gz
cd nginx-1.17.9
./configure
make && make install

修改配置文件

修改Nginx目录下的配置文件,填上之后我们要放置博客的目录,修改前我们先备份

cp /usr/local/nginx/conf/nginx.conf /usr/local/nginx/conf/nginx.conf.bak
vi /usr/local/nginx/conf/nginx.conf

但是!!!我们使用了FinalShell,就可以不用vi命令了,直接使用cd /usr/local/nginx/conf/进入目录,下方文件夹目录会自动进入该目录,如果没有进入也不要紧,我们像Windows一样在左侧树结构下一级一级的打开就可以了
目录
双击打开nginx.conf文件,在编辑器中间root的目录改为我们需要放置的目录,server_name修改为我们的域名,如果没有域名则不修改,例/home/www/website,修改完成之后Ctrl + S保存即可
修改配置文件
同时,我们也要建立相关的目录,同时修改权限

示例
cd /home
mkdir www
cd www
mkdir website
chmod 777 /home/www/website
chmod 777 /home/www

安装 Gi t以及 Node.js

安装 Node.js

curl -sL https://rpm.nodesource.com/setup_10.x | bash -
yum install -y nodejs

安装完成后可以查看版本是否安装成功

node -v
npm -v

显示版本号即为成功安装
成功

安装 Git 及配置 Git 仓库

安装Git后建立Git用户

yum install git
adduser git
修改Git用户权限

更改文件权限

chmod 740 /etc/sudoers

使用 FinalShell 进入/etc目录,打开sudoers文件,找到root那一行,添加git ALL=(ALL) ALL,修改完成后保存
添加权限
修改完成后改回原文件权限,然后修改密码

chmod 400 /etc/sudoers
sudo passwd git
切换git用户并且建立密钥

在Windows本地执行ssh-keygen -t rsa -C "你的用户名"生成秘钥,并在C:/Users/Windows用户名/.ssh下用记事本打开id_rsa.pub文件,复制其中的秘钥填入到authorized_keys

su git
cd ~
mkdir .ssh
cd .ssh
vi authorized_keys
chmod 600 ~/.ssh/authorized_keys
chmod 700 ~/.ssh

创建git仓库

cd ~
git init --bare blog.git

打开仓库下hooks/post-receive文件,该文件会在我们把本地构建的博客上传到Git仓库后,同时推送到我们设置的目录/home/www/website,同时也是Nginx配置文件中的目录

vi ~/blog.git/hooks/post-receive
输入
git --work-tree=/home/www/website --git-dir=/home/git/blog.git checkout -f
其中/home/www/website就是我们的博客目录

编辑完成之后Ctrl + S保存,保存完后修改一下权限

chmod +x ~/blog.git/hooks/post-receive

##### 以上指令都需要在su git 切换到Git用户之后执行 如果中途断开重新连接过,需要重新执行 su git指令,切换到git账户。

上面所有操作做完之后我们测试以下ssh连接是否成功,在本地电脑中按键Win + R,或者开始-运行,输入cmd打开命令行,输入一下代码

ssh -v git@你的服务器ip

返回下面画面即为成功
ssh连接成功

写入启动脚本

切换到root用户在/etc/init.d/路径下添加脚本文件,名称为nginx

cd /etc/init.d/
touch nginx

打开输入以下内容

#!/bin/bash
#Startup script for the nginx Web Server
#chkconfig: 2345 85 15
nginx=/usr/local/nginx/sbin/nginx
conf=/usr/local/nginx/conf/nginx.conf
case $1 in 
start)
echo -n "Starting Nginx"
$nginx -c $conf
echo " done."
;;
stop)
echo -n "Stopping Nginx"
killall -9 nginx
echo " done."
;;
test)
$nginx -t -c $conf
echo "Success."
;;
reload)
echo -n "Reloading Nginx"
ps auxww | grep nginx | grep master | awk '{print $2}' | xargs kill -HUP
echo " done."
;;
restart)
$nginx -s reload
echo "reload done."
;;
*)
echo "Usage: $0 {start|restart|reload|stop|test|show}"
;;
esac

然后执行chmod +x nginx
Nginx命令:
启动service nginx start
停止service nginx stop
重启service nginx reload

至此服务端配置就完毕了

本地配置

安装 NodeJS

官网下载Windows版本安装(Node.js 版本需不低于 8.10,建议使用 Node.js 10.0 及以上版本)即可

安装 Git

同样,在官网下载Windows版本安装即可

查看版本

安装完成后可以按键Win + R,或者开始-运行,输入cmd打开命令行,输入node -vnpm -v查看一下版本号,如果提示没有命令,请重新安装或者百度配置环境变量

安装Hexo

按键Win + R,或者开始-运行,输入cmd打开命令行,输入npm install -g hexo-cli,等待安装完成后,输入hexo --version查看版本安装成功与否
安装完成后我们再输入npm install hexo-deployer-git --save安装git提交程序

拉取Hexo到本地

所有安装完成后选择自定义目录,按住shift单机右键,选择在此处打开powershell窗口,输入cmd,拉取Hexo模板

hexo init

然后输入

npm install

新建完成后,指定文件夹的目录如下:
├── _config.yml
├── package.json
├── scaffolds
├── source
|├── _drafts
|└── _posts
└── themes
然后我们打开_config.yml文件,在最后面修改我们的Git仓库地址

deploy:
    type: git
    repo: git@你的服务器ip:/home/git/blog.git
    branch: master

至此我们的Hexo模板拉取到本地了,更多Hexo 相关的命令可以查看官方文档
下面我列举几个常用的命令:
新文章:hexo n "文章名字"
清除缓存文件 (db.json) 和已生成的静态文件 (public):hexo clean
生成静态页面:hexo g
提交到Git仓库:hexo -d
本地启动服务:hexo s

一键生成部署服务:hexo g -d && hexo s

使用主题

本博客使用的主题是matery,来自闪烁之狐,大家可以去他的博客查看自定义主题教程

去掉banner背景图片颜色图层

打开博客根目录\themes\hexo-theme-matery\source\css\matery.css这个css样式文件,搜索到@-webkit-keyframes rainbow@keyframes rainbow,注释这两个代码块,然后hexo g && hexo s查看效果吧!