Hcode网站的搭建日记（五）使用Valine实现评论功能
Hcode网站的搭建日记（五）使用Valine实现评论功能
前言
Hcode网站已经正式运行，本网站由Himit_ZH和Howie协同合作搭建，网站的主旨是“记录编程技术，实现在线功能”
这部分我们将介绍一下如何使用valine实现评论功能。Valine 是一款基于LeanCloud的快速、简洁且高效的无后端评论系统。理论上支持但不限于静态博客，目前已有Hexo、Jekyll、Typecho、Hugo、Ghost 等博客程序在使用Valine。
一、获取APP ID和APP KEY
想要使用valine，必须先登录或注册 LeanCloud, 进入控制台后点击左下角创建应用：
应用创建好以后，进入刚刚创建的应用，选择左下角的设置>应用Key，然后就能看到你的APP ID和APP Key了：
二、使用并配置Valine
最简单的使用方法只需要修改初始化对象中的appId和appKey的值为上面刚刚获取到的值即可(其他可以默认)。
COPY<head>
..
<script src='//unpkg.com/valine/dist/Valine.min.js'></script>
...
</head>
<body>
...
<div id="vcomments"></div>
<script>
new Valine({
el: '#vcomments',
appId: 'Your appId',
appKey: 'Your appKey'
})
</script>
</body>自定义配置
Valine还有其他各种可自定义的配置项，具体可看以下：
el
- 类型:
String - 默认值:
null - 必要性:
true
Valine 的初始化挂载器。可以是一个CSS 选择器，也可以是一个实际的HTML元素。
appId
- 类型:
String - 默认值:
null - 必要性:
true
从LeanCloud的应用中得到的appId.
appKey
- 类型:
String - 默认值:
null - 必要性:
true
从LeanCloud的应用中得到的appKey.
placeholder
- 类型:
String - 默认值:
Just go go - 必要性:
false
评论框占位提示符。
path
- 类型:
String - 默认值:
window.location.pathname - 必要性:
false
当前文章页路径，用于区分不同的文章页，以保证正确读取该文章页下的评论列表。 可选值：
window.location.pathname(默认值，推荐)window.location.href自定义- I. 请保证每个
文章页路径的唯一性，否则可能会出现不同文章页下加载相同评论列表的情况。 - II. 如果值为
window.location.href，可能会出现随便加不同参数进入该页面，而被判断成新页面的情况。
avatar
- 类型:
String - 默认值:
mm - 必要性:
false
Gravatar 头像展示方式。
可选值：
''(空字符串)mpidenticonmonsteridwavatarretrorobohashhide
更多信息，请查看头像配置。
meta
- 类型:
Array - 默认值:
['nick','mail','link'] - 必要性:
false
评论者相关属性。
pageSize
- 类型:
Number - 默认值:
10 - 必要性:
false
评论列表分页，每页条数。
lang
- 类型:
String - 默认值:
zh-CN - 必要性:
false
多语言支持。
可选值：
zh-CNzh-TWenja
如需自定义语言，请参考i18n。
visitor
- 类型:
Boolean - 默认值:
false - 必要性:
false
highlight
- 类型：
Boolean - 默认值:
true - 必要性:
false
代码高亮，默认开启，若不需要，请手动关闭
avatarForce
- 类型:
Boolean - 默认值:
false - 必要性:
false
每次访问强制拉取最新的评论列表头像
不推荐设置为
true，目前的评论列表头像会自动带上Valine的版本号
recordIP
- 类型:
Boolean - 默认值:
false - 必要性:
false
是否记录评论者IP
serverURLs
- 类型:
String - 默认值:
http[s]://[tab/us].avoscloud.com - 必要性:
false
⚠️ 该配置适用于国内
自定义域名用户,海外版本会自动检测(无需手动填写)v1.3.10+
emojiCDN
- 类型:
String - 默认值: ``
- 必要性:
false
设置表情包CDN，参考自定义表情
emojiMaps
- 类型:
Object - 默认值:
null - 必要性:
false
设置表情包映射，参考自定义表情
enableQQ
- 类型:
Boolean - 默认值:
false - 必要性:
false
是否启用昵称框自动获取QQ昵称和QQ头像, 默认关闭，需博/网站主主动启用
requiredFields
- 类型:
Array - 默认值:
[] - 必要性:
false
设置必填项，默认匿名，可选值：
['nick']['nick','mail']
三、配置邮件提醒
由于Valine自带的邮件提醒功能在v1.4.0发布时下线，所以我们使用第三方邮件提醒 ——Valine Admin
### 1. 基础搭建
首先需要确保 Valine 的基础功能是正常的，参考上述教程。
然后进入 Leancloud 对应的 Valine 应用中。
点击 云引擎 -> 设置 填写代码库并保存：https://github.com/zhaojun1998/Valine-Admin
切换到部署标签页，分支使用 master，点击部署即可：
2.配置项
我们需要设置云引擎的环境变量以提供必要的信息，点击云引擎的设置页，设置如下信息：
SITE_NAME: 网站名称。SITE_URL: 网站地址, 最后不要加/。SMTP_USER: SMTP 服务用户名，一般为邮箱地址。SMTP_PASS: SMTP 密码，一般为授权码，而不是邮箱的登陆密码，请自行查询对应邮件服务商的获取方式SMTP_SERVICE: 邮件服务提供商，支持QQ、163、126、Gmail、"Yahoo"、......，全部支持请参考 : Nodemailer Supported services。 --- 如这里没有你使用的邮件提供商，请查看自定义邮件服务器SENDER_NAME: 寄件人名称。
3.重启生存环境
点击重启即可
四、评论数据管理
由于Valine 是无后端评论系统，所以也就没有开发评论数据管理功能。请自行登录Leancloud应用管理。
具体步骤：登录>选择你创建的应用>存储>选择Class Comment，然后就可以尽情的发挥你的权利啦(～￣▽￣)～
最后
下篇文章将介绍如何部署Django项目到服务器（Linux）。