准备
安装
在Hexo
博客目录执行
npm install hexo-disqus-proxy --save
前端配置
在你的Hexo
博客目录中修改_config.yml
文件
添加如下配置:(注意缩进和空格)
disqus_proxy:
shortname: ciqu
host: disqus-proxy.ycwalker.com
port: 443
admin_avatar: /avatars/admin-avatar.jpg
default_avatar: /avatars/default-avatar.png
其中:
shortname
是你的website的 shortname 名称 比如在你的disqus安装代码中 有这样一句脚本:
s.src = 'https://test-eo9kkdlcze.disqus.com/embed.js';
那么你的disqus 的shortname 就是 test-eo9kkdlczehost
是你启用disqus代理的VPS的域名port
是VPS服务器启用disqus代理的端口,需要与之后设置的后端一致default_avatar
和admin_avatar
分别是默认头像和管理员头像的路径。例如在source
目录下建立avatars
目录,放入两个头像,在这里设置成绝对路径。如果不设置,则为默认头像。
关键的一步
在disqus
的官方配置中,我们需要在页面合适位置添加一个 <div id="disqus_thread"></div>
作为占位符,
而hexo-disqus-proxy
插件并不能知道在页面的哪个位置插入这个标签比较合适,所以这个需要额外配置一下:
情况一
如果你本身用的主题已经支持disqus
的配置,那么灰常爽,你只需要正常启用主题的disqus评论,插件就会自动检测并合适的覆盖,
这是最常见的情况,肯定是最吼的。
情况二
在你写的markdown
文件底部插入<div id="disqus_thread"></div>
。这样评论框位置会位于文章的下方,并且大小能被外部元素所约束,不会乱跑。
什么,markdown
也能插入HTML
标签?
嗯是的。
情况三
稍微懂一点点hexo
的基本知识,自己改主题。大概的思路是,在Hexo
渲染的过程中,把<div id="disqus_thread"></div>
加在合适的位置就行了。
情况四
什么也不做的话,默认会直接把评论框元素挂在body
的元素的最后,这样通常会撑满一整行,通常效果不是你想要的。
后端配置
后端使用Node.js
,需要Node.js
版本7.6
以上。
在服务器上clone代码:
git clone https://github.com/ciqulover/disqus-proxy
安装依赖
只需要安装后端的依赖
npm i --production
// 或者
yarn install --production
配置server
目录下的config.js
module.exports = {
port: 5509,
api_secret: 'your secret key',
shortname: 'ciqu',
socks5Proxy: null,
log: 'console'
}
获取api-secret
api-secret
需要你在disqus的官方网站上开启API权限,申请成功后会得到这个秘钥。
并且需要在后台的Settings => Community里开启访客评论
启动
cd server
node index.js
推荐用pm2
在生产环境启动,否则你断开ssh,node进程就终止了
npm install pm2 -g
pm2 start index.js
如果你在配置文件中选择log
类型为file
, 那么输出的日志文件将在默认为server目录下的disqus-proxy.log
Done !