抱歉,您的浏览器无法访问本站
本页面需要浏览器支持(启用)JavaScript
了解详情 >

靖待的技术博客

小清新IT旅程 | 为中华之崛起而读书

数据安全挺重要的
  2022-05-22更新 解决评论模块无法访问的问题-CDN更换

更换缘由

博客诞生以来,折腾最多的板块就是评论系统,多说–>网易云跟帖–>Disqus–>Valine,一路换换换,经历了一些数据丢失,直到2018年3月更换到Valine评论系统后,至今平稳运行了快四年时间,除了偶尔有些广告以外,没有出过大问题。
  但是从安装Valine起,我明了作为一款无后端的评论系统的安全性是很难保证的。由于那段时间折腾到心累,加上Valine是当时颜值最高且简洁的评论系统,同时觉得应该没有谁会去费精力黑一个没多少人看的小博客,所以就默默躺平了。中间也看到过有博主被攻击,不过总觉得自己应该不会这么倒霉吧,懒得管。没想到能撑四年也是不容易~~(从侧面说明我的博客确实没人看,叹气.jpg)~~。

今天更新博客时间线的时候看到博客上次大调整还是19年,究竟是我变懒了还是indigo主题确实满足了我大部分需求呢,肯定是后者哈哈。

为什么现在突然要换呢?主要是上次这篇博文解决Valine评论不显示的问题下面的评论让我再次想起Valine系统的这个隐患。

秉持着最小化修改的精神,我很快决定换成Waline系统。看这个名字吧,Valine和Waline,感觉上就相差肯定不多。Waline其实就是一个带后端的Valine,可以进行一些反垃圾和校验操作。其实早就看好了Waline,只是一直没有动力换它。现在是时候把它换了。也希望各位黑客大佬们手下留情,不要难为我这小小博客。

更换步骤

以下步骤基于原有系统为Valine系统的简单迁移方法。

Vercel 部署(服务端)

免费的就是最好的!(本穷狗如是说)
deploy

  • 点击上方跳转至Vercel部署。
  • 未登录需要注册或登录,使用Github快捷登录。
  • 输入名称创建项目,Vercel会根据Waline模板新建并初始化仓库。
  • 几分钟后,满屏烟花部署成功。

转到Dashboard-Setting-Environment Variables,进行环境变量配置。

环境变量配置

必备

新增/对应于

  • LEAN_ID —— LeanCloud中获得的APP ID
  • LEAN_KEY —— LeanCloud中获得的APP KEY
  • LEAN_MASTER_KEY —— LeanCloud中获得的Master Key
      以上默认LeanCloud国际版,如果是LeanCloud国内版,还要配置LEAN_SERVER环境变量,值为绑定好的域名。

点击Deployments-Redeploy重新部署。当STATUS变为Ready后,点击Visit跳转的地址即为服务端地址。

邮件提醒

  • SMTP_SERVICE: SMTP 邮件发送服务提供商。
    支持的服务提供商列表
    (如果运营商不受支持,必须填写 SMTP_HOSTSMTP_PORT
    SMTP_HOST: SMTP 服务器地址,一般可以在邮箱的设置中找到。
    SMTP_PORT: SMTP 服务器端口,一般可以在邮箱的设置中找到。)

  • SMTP_USER: SMTP 邮件发送服务的用户名,一般为登录邮箱。

  • SMTP_PASS: SMTP 邮件发送服务的密码,一般为邮箱登录密码,部分邮箱(例如 163)是单独的 SMTP 密码。

  • SITE_NAME: 网站名称,用于在消息中显示。

  • SITE_URL: 网站地址,用于在消息中显示。

  • AUTHOR_EMAIL: 博主邮箱,用来接收新评论通知。如果是博主发布的评论则不进行提醒通知。

选填:

  • SENDER_NAME: 自定义发送邮件的发件人
  • SENDER_EMAIL: 自定义发送邮件的发件地址
  • MAIL_SUBJECT: 自定义评论回复邮件标题
  • MAIL_TEMPLATE: 自定义评论回复邮件内容
  • MAIL_SUBJECT_ADMIN: 自定义新评论通知邮件标题
  • MAIL_TEMPLATE_ADMIN: 自定义新评论通知邮件内容

HTML 引入 (客户端)

在indigo主题中,需要修改\hexo\themes\indigo\layout_partial\plugins\valine.ejs文件。
去掉

1
2
<script src="//code.bdstatic.com/npm/leancloud-storage@4.12.0/dist/av-min.js"></script>
<script src="//unpkg.com/valine@latest/dist/Valine.min.js"></script>

加上

1
<script src="//cdn.jsdelivr.net/npm/@waline/client"></script>

去掉

1
2
3
4
5
6
7
8
9
10
11
12
new Valine({
el: '#comments',
notify: '<%= theme.valine.notify %>' == 'true',
verify: '<%= theme.valine.verify %>' == 'true',
appId: "<%= theme.valine.appId %>",
appKey: "<%= theme.valine.appKey %>",
avatar: "<%= theme.valine.avatar %>",
placeholder: "<%= theme.valine.placeholder %>",
guest_info: guest_info.length == 0 ? GUEST_INFO : guest_info,
pageSize: "<%= theme.valine.pageSize %>",
serverURLs: '<%= theme.valine.serverURLs %>' // 增加这一行!!!
})

更换为

1
2
3
4
Waline({
el: '#comments',
serverURL: '此处为你的服务端地址'//注意此处是serverURL,Valine里的是serverURLs
});

此时评论服务已能在博客成功运行。

评论管理(管理端)

  • 部署完成后,在<serverURL>/ui/register进行注册。第一个注册的人被设定为管理员。
  • 管理员可管理评论。
  • 用户可通过评论框注册账号,登录后可跳转至自己的评论页。

其它

  • 如果无法发布评论,比如报错说格式不对(要求Number结果是String)之类的,建议查看LeanCloud数据中的单元格式是否正确。

参考资料

Waline官网

2022-05-22更新 解决评论模块无法访问的问题-CDN更换

查找问题

1
2
GET https://cdn.jsde1ivr.net/npm/@waline/client
net::ERR_CONNECTION_TIMED_OUT

该CDN链接超时,需要更换。

解决方法

1
<script src="//cdn.jsdelivr.net/npm/@waline/client"></script>

更换为

1
2
3
4
5
<script src="https://unpkg.com/@waline/client@v2/dist/waline.js"></script>
<link
rel="stylesheet"
href="https://unpkg.com/@waline/client@v2/dist/waline.css"
/>

另外,waline版本更新后更改了方法入口,需要将

1
2
3
4
Waline({
el: '#comments',
serverURL: 'https://your-domain.vercel.app',
});

更改为

1
2
3
4
Waline.init({
el: '#comments',
serverURL: 'https://your-domain.vercel.app',
});

问题解决。

评论