10 评论功能

法律法规

国内网站要搭建评论功能，需要实名认证（社交账号认证）。

一、开源评论系统有哪些？

开源评论系统	社交账号认证
Artalk	不支持
Discuss	不支持
giscus	仅github
Twikoo	不支持
Waline	支持

二、使用Waline

https://waline.js.org/

2.1 部署 Waline 服务器

Waline 需要一个后端来存储评论数据，推荐使用 Docker 部署，并搭配 MongoDB 作为数据库。

1. 拉取 Waline 和 MongoDB Docker 镜像

   docker pull mongo
   docker pull waline/waline

2. 启动 MongoDB

   docker run -d --name waline-mongo -p 27017:27017 -v ~/waline/data:/data/db mongo

3. 启动 Waline 服务器

   docker run -d --name waline -p 8360:8360 \
     -e MONGO_URI="mongodb://your-mongo-ip:27017/waline" \
     -e JWT_SECRET="your-secret-key" \
     waline/waline
   • MONGO_URI：MongoDB 连接地址，若 MongoDB 运行在同一主机，可填 mongodb://localhost:27017/waline
   • JWT_SECRET：设置一个密钥，用于管理员身份验证

4. 检查是否成功运行 访问 http://your-server-ip:8360，如果返回 { "version": "x.x.x" } 说明后端已正常运行。

2.2 在 Docusaurus 中集成 Waline

部署好 Waline 服务器后，我们可以在 Docusaurus 前端页面集成评论组件。

安装 Waline 客户端

npm install @waline/client

创建 Waline 组件

在 src/components/Waline.js 中创建组件：

import React, { useEffect, useRef } from 'react';
import { init } from '@waline/client';
import '@waline/client/dist/waline.css';

export default function WalineComponent() {
  const walineRef = useRef(null);

  useEffect(() => {
    init({
      el: walineRef.current,
      serverURL: 'http://your-server-ip:8360', // 替换为你的 Waline 服务器地址
      lang: 'zh-CN',
      dark: 'auto',
    });
  }, []);

  return <div ref={walineRef} />;
}

在 Docusaurus 页面中引入组件

打开 src/pages/index.js 或 src/theme/BlogPostPage.js，引入 Waline：

import WalineComponent from '../components/Waline';

export default function BlogPost() {
  return (
    <div>
      <h1>文章标题</h1>
      <p>文章内容...</p>
      <WalineComponent />
    </div>
  );
}

2.3 启动 Docusaurus

npm run start

然后访问 Docusaurus 站点，文章页或主页底部应显示 Waline 评论系统！🎉

如果部署在服务器上，确保 8360 端口对外开放，或使用 Nginx 代理进行反向代理。