hexo-admin

参考文献

如何优雅地发布Hexo博客

就目前而言，我所知道的发布Hexo的博客有如下几种：
1、原始方式，也就是在服务器上编写md文件，然后利用hexo g来生成；
2、利用github+hook来管理，小锅这里有一篇教程；
3、其他(hexo-admin or other plugins)；
我所用的这个方式就属于第三种，略微改进版。也许你已经看过[那么可以概览之后忽略]，也许你没看过，那么请耐心看完，反正都点进来了，也许有福利呢，who knows…

环境说明
格子这里所使用的环境如下：
1、阿里云 Linux 3.10.0-514.6.2.el7.x86_64
2、NodeJs 6.10.3
3、Hexo-cli: 1.0.2
4、Hexo 3.3.7
5、Hexo-admin
6、Nginx1.9.9

本篇博客的重点在于Hexo博客的优雅发布，所以其他必需环境的安装大部分会简短带过。如果还未安装过相关环境或者不会安装相关环境的请自行百度，网上有特别丰富的教程资料，这里只给出部分链接供参考。
重要说明：格子未直接使用hexo server启动hexo服务来对外提供博客的访问，而是通过nginx作为web服务器对外提供服务。
NodeJs
下载地址

1
http://nodejs.cn/download/

安装
请参考这里，注意自己选择的安装包。
Hexo
官网

1
https://hexo.io/

安装
请参考这里。需要注意的是，格子这里是将环境搭建在阿里云机器上，并不是通过GitHub托管，毕竟用GitHub的子域名感觉不够高大上，毕竟装(chui)比(niu)要装一整套的。所以我就花重金买了域名，买了云主机，买了oss，这样装备齐全之后，感觉逼格都提高了。

另：安装完博客之后，有很多主题可供挑选，点击这里，找到自己喜欢的主题，并给hexo换上，舒舒服服地来一发吧。
Hexo-admin
主角登场了，前面也有提到过，管理Hexo博客，我所知道的有几种方式。用手动管理的方式未免显得太过于原始人，即便你用本地的Markdown编辑器洋洋洒洒地写完了一篇博客，还是得屁颠屁颠地连接到服务器，然后将文件上传到博客服务器，再然后谄媚地告诉服务器，乖，帮我执行一下hexo g，命令执行完，静态页面生成后一篇博客才叫告一段落。
也许你不嫌麻烦，觉得这样也挺好的，没那么多屁事儿折腾，那么就坚持自己的做法也未尝不可。
但是，如果你跟我一样嫌(tai)麻(lan)烦(le)的话，那么利用Hexo-admin插件，加上自己部分diy，也许一个自己比较满意的Hexo博客发布方式就到手了，岂不是一大爽事。

就是这个feel~倍儿爽

反正我就是懒，不要拉我，让我懒。其实有时候这种“懒”往往能促使人进步，如果不嫌麻烦甘于重复劳动，虽然会少掉很多折腾，但也会少掉很多发现和进步。
好了，鸡汤喝完，该说正事儿了。
hexo-admin官网

1
https://jaredforsyth.com/hexo-admin/

step 1
安装必要环境，请参照上面
step 2
初始化博客，一般到这里你应该是已经初始化自己的博客了，如果还没有的话，请看下面

1
2
3
4
cd /usr/local/
hexo init yourblog
cd yourblog
npm install

step 3
安装hexo-admin插件，并且启动hexo服务，打开浏览器访问能看到基本的界面

1
2
3
npm install --save hexo-admin
hexo server -d
open http://localhost:4000/admin/

登录界面

到这里，没进行配置的小伙伴可能还无法登录，请接着往下看。
step 4
在hexo的_config.yml配置hexo-admin

1
2
3
4
5
admin:
   username: zoro
   password_hash:be121740bf988b2225a313fa1f107ca1
   secret: hey hexo
   deployCommand: './admin_script/hexo-generate.sh'

注
1、password_hash就是密码，通过bcrypt hash，你可以用尽你一切手段对自己的密码做一个bcrypt加密，C/Java/Python都可以，做人嘛，重要的是嗨森；
2、secret用以cookies安全；
3、deployCommand就是一个关键点，不要着急，下面给出说明；
主页

Post：博客文章列表，包括已经发布的和还在草稿箱等待宠幸的；
Pages：就是诸如标签云之类的页面管理；
About：关于admin插件的说明
hexo-gen：这个原来是Deploy，被我修改了，关键节点；
Settings:配置；

step 5
先解释一下上面配置的那个deployCommand的用处，目的在于页面上你点击了Deploy页面下面的Deploy按钮的时候，所执行的脚本，这里格子拿它来作为执行hexo g的载体。
说到这里，可能有些人不是很理解为什么要这么做，看官莫急，听我细细道来。
其实，当你以hexo server -d启动了hexo服务的时候，hexo-admin插件在你修改了 某篇博已发布博客，或者新发布博客的时候，会在后台帮你执行一系列操作，所以这个时候，你可以通过http://localhost:4000访问就可以看到刚才发布到博客了，看到这里，有读者应该就要心里问候格子声：那你是不是傻，为什么还要折腾？容我说一句，原因只有一点：以hexo server启动的hexo对外提供的服务，并不是特别稳定，访问略慢，毕竟不是专门的web服务容器，而且如果你不以nohup方式启动的话，一旦关掉Xshell等操作界面的时候，就会被迫关掉，所以带来了一系列令人不喜的体验，这就是我折腾的唯一原因。
因此，其实格子是以Nginx为web服务容器对外提供博客服务，每次将新博客生成静态Html放到Nginx配置的目录下，速度不要太快；格子的云主机只有1G内存 单核CPU,还是能有不俗的访问体验，所以觉得还算没白折腾。
有点走题，话说回来，大体的步骤是这样：
1、Nginx提供web服务
2、hexo-admin提供博客管理
3、利用hexo-admin在浏览器实现博客编写，或者自己本地md编辑器写好之后粘贴到hexo-admin，后者可能更为保险，防止丢失。
4、利用hexo-admin留下来的deploy按钮，去执行我们放在博客服务器上的脚本，来生成html页面；
所以，重点来了，在_config.yml里面填写好deployCommand的存储路径之后，在该路径下生成脚本；
touch hexo-generate.sh;
vim hexo-generate.sh;

输入以下内容

1
2
#!/usr/bin/env sh
hexo g

保存退出，并赋予执行权限
执行Shift+:，输入q，如下

1
2
:q
chmod +x hexo-generate.sh

step 6
验证效果，这里我没有贴出Nginx的配置，稍等给出，可以先行验证是否有效果
1、启动hexo server
2、访问http://localhost:4000/admin并登陆
3、进入Posts页面，新建博客并编写发布；
4、进入Deploy页面（如果你还没改掉改名称的话），点击下面的Deploy按钮
5、进入博客目录->public，查看相应的html是否有生成，如果有，那么恭喜你成功了。
这里有两个问题：
①、hexo-admin的作者将hexo-admin的服务依赖于hexo来运行[hexo s]，个人觉得有点浪费资源，但有碍于没时间，只好暂时将就这样。有兴趣的人，可以去阅读源码，然后将hexo-admin处理成独立的服务。
②、Deploy页面的功能其实被我们diy成hexo generate的执行者了，所以有强迫症的小伙伴可以将页面内容改成具体含义的，比如格子改成了hexo-gen，修改路径在hexo目录下，node_modules/hexo-admin/www/bundle.js；
差不多就是这样，突然觉得有点没头没尾，因为没有讲Nginx部分，下面给出，这样大家应该不会觉得特别乱；
Nginx
下载
http://nginx.org/en/download.html
安装
请搜索网上安装教程，特别多，这里不做重复劳动了。如果有什么问题可以留言指出。
配置
server {
listen 80;

    #域名，多个用空格隔开
    server_name lzoro.com blog.lzoro.com;
    #配置hexo博客目录
    root /usr/local/hexo/public;
    location / {
            index  index.html index.htm;
    }
    access_log /tmp/logs/nginx/hexo.access.log;
}

启动nginx，访问自己的域名http://blog.lzoro.com，如果没出问题的情况下，会出现自己的博客，然后可以看到各篇博客的情况。
小结
发布Hexo博客的方式有好几种，每个人的喜好不一样，所以也无关优劣。
格子这里带来的方式是利用Nginx作为web容器，利用Hexo-admin作为web后台管理来管理hexo博客，然后通过hexo-admin留下来的脚本执行按钮执行hexo g生成博客静态页面，相当于，你只需要一个浏览器，无需远程连接博客服务器，就可以轻松发布自己的博客了。
如果文章对你帮助，无妨留个言让格子知道呗。

作者：格子Lin
链接：https://www.jianshu.com/p/68e727dda16d
來源：简书
简书著作权归作者所有，任何形式的转载都请联系作者获得授权并注明出处。

安装 hexo-admin

参考文献

hexo-admin安装使用

cd hexo 目录

1
npm install --save hexo-admin

启动 hexo

1
hexo s

然后打开 http://localhost:4000/admin/ 就可以看到管理页面。

在 hexo-admin 你可以

Pages - 新加 page；
Posts - 新加或删除 post；双击一个 post，你可以编辑，预览，新增修改 tags、categories，选择发布或不发布；
Settings - 一些配置；
Deploy - 可以直接部署到 github。

问题

minimatch

1
npm WARN deprecated minimatch@2.0.10: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue
当你安装 hexo-admin，执行 npm install –save hexo-admin 时，可能会遇到上面的错误提示，是因为你缺少了一些依赖，执行下面的就好了。

1
2
3
npm install minimatch@"3.0.2"  
npm update -d
Config value “admin.deployCommand” not found

当你第一次点击 Deploy 按钮时，可能会遇到上述的错误，因为缺少了执行 deploy 的命令，这个问题已经有人提了 issue 并且解决了
https://github.com/jaredly/hexo-admin/issues/70
还需要注意的是，issue 中的脚本只是 hexo deploy，只是做 deploy 操作，但是一般我们的使用习惯是编辑完之后 deploy，所以是要 deploy 最新的，需要把脚本改为即可

1
2
3
4
#!/usr/bin/env sh
hexo g
hexo d
deploy 后你可能看到

Std Error
(node:83411) [DEP0061] DeprecationWarning: fs.SyncWriteStream is deprecated.
Warning: Permanently added the RSA host key for IP address ‘13.229.188.59’ to the list of known hosts.
Everything up-to-date
这不是错误，你可以不用管。说明已经 deploy 成功。

复制图片时的一个小问题

hexo-admin 编辑时支持直接复制图片（截图）到内容，这点是我比较喜欢的。但是有个问题，复制进去后是加载不出来的，会出现图裂的小图标。

这时你只需要点击别的页面，再点回来就可以看到了，就是“刷”一下就好了，最简单的就是点击右上角打勾的按钮，这个按钮的作用是拼写检查，点一下再点回来，就可以看到你刚复制进去的图片了。

这大概是因为 hexo-admin 对图片做了延迟加载，具体可以看看这篇文章说的
https://htchz.me/2018/03/10/Hexo/

参考资料

https://www.jianshu.com/p/68e727dda16d
https://blog.kinpzz.com/2016/12/31/hexo-admin-backend-management/
https://github.com/jaredly/hexo-admin

hexo-admin后台管理博客

需求
像Hexo这种静态博客用起来很方便，但是硬伤就是没有后台管理，每次想写博客或者说想要修改原博客的话，都需要在本机上找markdown文件，修改之后发布，尤其是如果机器上没有安装hexo,git等工具的时候，就无法修改了。因此hexo可不可以以像wp,ghost这种有后台管理, 随时随地编辑博客呢?

正巧hexo专门有一个插件hexo-admin 提供了在web UI下增删改查博客的功能，我也正好有一个VPS, 于是就有了下面的一种方法.

解决方法
首先说一下条件与需求。 我自己有一个的VPS，本来是可以直接将hexo部署到VPS的，但是考虑到自己维护的VPS的稳定性等问题，最后决定将hexo的静态页面部署github-pages上。

我的目的有两个:

拥有在线编辑博客的后台
本地机器同时也可以编辑发布博客
二者需要保持同步
基于这样的需求，仅仅靠github pages显然不可行了,必须借助VPS了.保持同步的意思是VPS的内容与本地机器上的博客的资源要保持一致。就是说我在线修改了某篇博客，然后之后如果可以很简单的同步到本地，使得两端保持同步，反过来一样。

我的做法是:

将hexo目录下的相关文件包括_config.yml,source/等文件建立一个私人repo(个人使用coding.net)
VPS上安装好hexo,具体过程与换台机器安装同理, 可参考这篇博客hexo迁移重装。
VPS上安装hexo-admin插件，这样可以在线编辑了. 在这一步的时候, 为了方便,我用了一个子域名以及在VPS上用nginx做前段端口转发.
到这里后台管理基本没有问题了. 接下来就是在线发布了. 正巧的是hexo-admin提供了这个功能, 有一个Deploy的功能,具体实现是使用nodejs的spawn函数来执行发布脚本的. 一开始不太懂spawn这个函数的使用, 就直接在deploy中随便输入了东西,结果各种 spawn err. 后来查过资料,才知道deploy的输入的位置其实是对hexo-admin的配置里面deployCommand的选项,可以为空. 打个比方,如果我在deployCommand写的是./hexo-deploy, 然后点击deploy按钮之后, 后台就可以执行hexo-deploy脚本的内容了. 有了这个接口就非常灵活了. 因为基于此, 我们不但来发布博客,甚至可以把同步的脚本加进去.具体参考 https://github.com/jaredly/he...

下面说一下发布以及同步的操作:

在博客目录写一个有关git同步的小脚本:server-upload.sh 用来同步VPS目录下的变化，主要代码其实就是先git pull 拉取repo最新, 之后在push. 具体脚本代码不再赘述.
建一个hexo-deploy的脚本,内容:

1
hexo g && hexo d

1
./server-upload.sh

利用hexo-admin的deploy功能，可以在线发布，注意修改_config.yml: 加上hexo-admin的admin选项, 加一个deployCommand: ./hexo-deploy的字段,如下:

1
2
3
4
admin:
    username: XXX
    password: XXXXX
    deployCommand: './hexo-deploy'

编辑完博客时候，发布的时候，需要点击hexo-admin的deploy。这样在后台就可以执行前面定义的hexo-deloy脚本了
本地机器也需要有一个upload.sh的脚本, 每次同样需要先git pull 在git push 到私人repo. 其实就是版本控制那一套.
到现在基本完成了自己可以随时随地编辑博客并且多端同步的需求了. 之前也考虑过CI持续集成,但是大部分都是再建立一个分支, 需要把博客的source公开, 不太合适. 所以就选择了hexo-admin这种方法.

这篇博客便是在线完成的.

其实这里面的坑还是蛮多的(主要不熟悉node). 此外开始使用supervisor做后台运行监控, 结果不知为何, 在hexo d包括git的pull或者push等操作,都会报错,提示让我确认git用户, 但是我已经设置了git config的email和name. 查了很多资料也没有解决, 后来直接抛弃supervisor, 直接使用nohup来放后台运行了. 大概是这样了, 有什么问题可以留言或者邮件.

参考文献

hexo上传到GitHub

在你的hexo项目目录配置文件中找到

1
2
3
4
deploy:
  type: git
  repo: https://github.com/×××.github.io
  branch: master

然后按自己的情况进行配置,运行

hexo d #如果没有报错就能在网页上浏览了

1
Ps: 可以将hexo d放到脚本中（即，先前提到的hexo-deploy），由hexo-admin的Deploy执行

下面总结下发布的总体流程吧

1
2
3
hexo new "新的文章"
hexo g 生成新的静态文件
hexo  d 发布到GitHub

使用hexo-admin deploy -d 出现提示

1
fatal: could not read Username for 'https://github.com': No error’

参考文献

[kevin的博客]（http://www.cnblogs.com/zhenghengbin/p/9655060.html）

解决办法
•修改配置文件：根目录下的_config.yml，修改deploy节点。
•原来的配置为：
deploy:
type: git
repo: https://github.com/{yourname}/{yourname}.github.io.git
branch: master

•修改为如下：
deploy:

type: git

repo: https://{yourname}:{yourpassword}@github.com/{yourname}/{yourname}.github.io.git

branch: master

1
Ps： 此处的yourname不是email账号，而是github上的username