Waline-评论系统

乐云一
  • GitHub
  • GitHub
About 958 wordsAbout 3 min

Waline

一款简单、安全且拆箱即用的评论框架,以下是它的部署使用即注意要点

注册LeanCloud数据库

登录open in new window注册open in new window

点击应用,打开左上角,设置 > 应用凭证

AppIDAppKeyMasterKey,保存记录

此外,虽然官方有说国内版本需要备案域名,绑定域名接入。但是在LeanCloud可以不进行设置,域名绑定在后续环节。

Vercel 部署

Vercelopen in new window

点击上面图标,跳到Vercel,务必使用GITHUB账号关联登录

点击之后,Vercel会自动帮我们建立一个存放评论配置的仓库

在构建完了之后,在当前页面点击下一步

在新建项目中打开设置的环境变量,将前置保存的 AppIDAppKeyMasterKey 设置上

KeyValue
AppIDOCmvQ2hMeY8OeVnDzeCzTr0Y-MdYXbMMI
AppKeyz0kEjL0f7VB75NPOTNFmee4f
MasterKey5y0xRnQYVsdRq2NKYl5yMTyw

在官网中,有说明 如果你使用 LeanCloud 国内版,请额外配置 LEAN_SERVER 环境变量,值为你绑定好的域名。

不过如果你有自己的国内已备案的域名,其实也没必要使用国内版的可以通过:

Settings - Domains 进入域名配置页

添加之后,一定要在对应的域名运营商中添加解析:

TypeNameValue
CNAMEexamplecname.vercel-dns.com

如果没有自己的域名,即使用的是Vercel生成的海外域名 https://test-comment-alpha.vercel.app/ ,在墙内网络下是无法正常使用的;在配置之后评论系统在国内网络下将失效。

最后

部署项目

等待项目状态变成 Ready,就可以通过 test-comment-alpha.vercel.app 或者 http://example.leyunone.com/ 前者是海外域名,后者是自己配置的域名。

通过访问域名+/ui/login可以来到Waline评论系统的管理页面。

注册账号,这里一定要注意,注册的第一个账号就是管理员账号;

此号的所有账号都是普通账号,只有管理员才可以管理评论

插件使用

HTML

下述为官方的教程

在你的网页中进行如下设置:

  1. 导入 Waline 样式 https://unpkg.com/@waline/client@v2/dist/waline.css
  2. 创建 <script> 标签使用来自 https://unpkg.com/@waline/client@v2/dist/waline.mjsinit()函数初始化,并传入必要的 elserverURL
    • el 选项是 Waline 渲染使用的元素,你可以设置一个字符串形式的 CSS 选择器或者一个 HTMLElement 对象。
    • serverURL 是服务端的地址,即上一步获取到的值。
<head>
  <!-- ... -->
  <link
    rel="stylesheet"
    href="https://unpkg.com/@waline/client@v2/dist/waline.css"
  />
  <!-- ... -->
</head>
<body>
  <!-- ... -->
  <div id="waline"></div>
  <script type="module">
    import { init } from 'https://unpkg.com/@waline/client@v2/dist/waline.mjs';

    init({
      el: '#waline',
      serverURL: 'https://your-domain.vercel.app',
    });
  </script>
</body>

vuepress

在配置文件中配置

comment:{
  provider: "Waline",
  search:true,
  serverURL:"https://example.leyunone.com"
}
Last update:
Contributors: leyunone
Comments
  • Latest
  • Oldest
  • Hottest
Powered by Waline v2.14.7