Hexo 搭建评论系统,Waline 配置教程

评论系统的选择

我的博客是用 Hexo 搭建,主题使用的是 Butterfly,搭建好之后我就想引入一个评论系统,我看 Butterfly 配置文件里面的评论系统挺多:Disqus/Disqusjs/Livere/Gitalk/Valine/Waline/Utterances/Facebook Comments/Twikoo/Giscus/Remark42/Artalk 等等。其实上面这些我也基本都没用过,不过有上网了解了一下样式及搭建方法。我觉得 Gitalk 无疑是最便捷的,但我打算在这里记录一些工作和生活的东西,涉及到的内容可能不只是技术类,所以就选择了 waline 系统,用户可以不用注册账号,填写一个昵称甚至不用写邮箱就可以评论,并且数据迁移也很方便。

使用 LeanCloud + Vercel 进行 Waline搭建

Waline 的服务端是可以搭建到自己服务器上的,但也可以选择使用 LeanCloud 作为数据存储,Vercel 作为服务端来进行搭建,我这边也是图方便,就选择了这种方式。

配置 LeanCloud
在这里我使用的是 LeanCloud 国际版,它也有大陆版,不过需要备案及域名绑定,所以我就直接使用的国际版。需要注册账户,之后创建应用,应用名称可以随便取,为了便于理解,还是取一个和博客或者评论相关的名字吧,我写的是 waline。

创建完成后进入到控制台的设置——应用凭证中,将 Credentials 下方的 AppID、AppKey和 MasterKey 的键值对都记录下来,后面会用到。

配置 Vercel
在 https://vercel.com/ 网站注册账号,可以使用 github 账户登录。使用开发者提供的 快速部署链接,可以直接将 Waline 仓库 Clone 到 Vercel 新创建的项目中,项目名称自己取一个。

Vercel 会基于 Waline 模板去创建并初始化仓库,仓库名就是你之前输入的项目名称,创建成功就点击Continue to dashboard 按钮,跳转到控制台。

点击顶部的 setting——Environment Variables 去配置环境变量。此时就用到了我们上面在 LeanCloud 中记录的三个值,注意环境变量的名称按照下面表格填写:

据说如果 LeanCloud 使用的是大陆版,还要额外配置一个绑定好的域名 LEAN_SERVER 项,这个我没有实测过。

设置好环境变量之后保存,然后在 Deployments 页点击 Redeploy 重新部署一下。

这里说一个细节,配置完环境变量之后是要重新部署的,不然环境变量无法生效,虽然很多人都知道这个知识点,但还是有很多粗心的朋友忘记,导致配置失败。

项目部署完成后点 Visit 即可访问项目的服务端,链接格式为:https:// xxxxx.vercle.app,此时访问可以看到评论页面。

此时注册登录,Waline 默认为第一个注册的用户是这个系统的管理员。之后就可以访问后台管理页面 https:// xxxxx.vercle.app/ui 来进行评论管理了。

在 Hexo 的主题中配置 Waline
上面的操作进行完毕后,就是要将 Waline 引入到 Hexo 博客中了,在这里我使用的主题是 Butterfly,Butterfly 的配置文件中已经预先写好了部分代码,只需要填入必要的信息即可。

在 comments 这部分指定 Waline:

之后找到 Waline 的部分,将 ServerURL 配置好,就写 Vercel 服务端部署好的 url 即可。至于其他配置项,可以参考 Waline文档的 组件属性 自行进行配置。

设置完毕后,Hexo 三连 hexo clean && hexo g && hexo s 后,可以看到评论可以正常显示。

被墙怎么办?
本地测试没问题之后,我就发布到服务器上了,结果在服务器上无法正常提交评论,提交失败。因为我本地是可以科学上网的,所以我想可能是因为国内的服务器无法正常访问 Vercel。于是又上网找了一下解决办法,还是需要在 Vercel 中绑定一个国内已备案的子域名。所以我配置了一个 comment.xxx.com 子域名,绑定到了 Vercel 中。具体就是在 setting——Domains 中填入子域名名称,之后点 Add 即可。

然后在主题的配置文件中,将 ServerURL 修改为 https://comment.xxx.com,再发布到服务器就没问题了。

注意:这里有一个细节,就是有可能会遇到部署好之后,在文章页面加载评论和提交评论都没有问题,但就是在首页的侧边栏引入了 最新评论 却加载失败,提示 无法获取评论,请确认相关配置是否正确,出现这个问题的原因可能有很多,我个人是因为我在 ServerURL 的配置项中把 url 最后加了 /,去掉之后就没问题了。不过我在查资料过程中,也有人说是与 Waline 的版本有关, v3 版本容易出现这样问题,v2 版本就很少出现,所以很多人建议用 v2 版本,我习惯了使用更高版本,所以还是坚持用了 v3 版本。

以上就是我配置 Waline 的全过程,希望能对你的搭建和配置起到一定帮助。

点赞

当前页面评论已关闭。