𝑷𝒂𝒊𝒂𝒅

外观

🍜Blog评论系统

约 703 字大约 2 分钟

VuePressWalineGiscus

2026-01-27

Blog评论系统推荐：

  • Giscus - 基于 GitHub Discussions，适合开源项目
  • Waline - 自带后端，支持多种数据库，功能更完整

Giscus

基于 GitHub Discussions 的评论系统，无需后端服务。

  • 创建公开仓库并开启 Discussions
  • 安装 Giscus App，授权访问目标仓库
  • 前往 Giscus 配置页面，填写仓库与分类信息
  • 获取 data-repo、data-repo-id、data-category、data-category-id
Giscus 配置

主题配置

// .vuepress/config.ts
import { defineUserConfig } from "vuepress";
import { plumeTheme } from "vuepress-theme-plume";

export default defineUserConfig({
  theme: plumeTheme({
    comment: {
      provider: "Giscus",
      comment: true,
      repo: "Your_Repo",
      repoId: "Your_RepoId",
      category: "Your_Category",
      categoryId: "Your_CategoryId",
    },
  }),
});

Waline

自带后端的评论系统，支持多种数据库。主流方案采用 Vercel + Neon (PostgreSQL)。

安装依赖

pnpm add @waline/client

部署流程

  • 准备数据库：在 Neon 创建项目，获取 PostgreSQL 连接字符串。
  • 初始化表结构：在 Neon SQL Editor 执行下方初始化脚本。
  • 部署后端：一键部署到 Vercel，并在项目设置中配置环境变量。
  • 前端配置：在主题配置文件中填入后端地址。

1. 初始化数据库

在 Neon 控制台执行以下 SQL 脚本：

Neon 控制台
-- waline.pgsql
CREATE SEQUENCE wl_comment_seq;
CREATE TABLE wl_comment (
  id int check (id > 0) NOT NULL DEFAULT NEXTVAL ('wl_comment_seq'),
  user_id int DEFAULT NULL,
  comment text,
  insertedAt timestamp(0) without time zone NOT NULL DEFAULT CURRENT_TIMESTAMP,
  ip varchar(100) DEFAULT '',
  link varchar(255) DEFAULT NULL,
  mail varchar(255) DEFAULT NULL,
  nick varchar(255) DEFAULT NULL,
  pid int DEFAULT NULL,
  rid int DEFAULT NULL,
  sticky numeric DEFAULT NULL,
  status varchar(50) NOT NULL DEFAULT '',
  "like" int DEFAULT NULL,
  ua text,
  url varchar(255) DEFAULT NULL,
  createdAt timestamp(0) without time zone NULL DEFAULT CURRENT_TIMESTAMP,
  updatedAt timestamp(0) without time zone NULL DEFAULT CURRENT_TIMESTAMP,
  PRIMARY KEY (id)
);

CREATE SEQUENCE wl_counter_seq;
CREATE TABLE wl_counter (
  id int check (id > 0) NOT NULL DEFAULT NEXTVAL ('wl_counter_seq'),
  time int DEFAULT NULL,
  reaction0 int DEFAULT NULL,
  reaction1 int DEFAULT NULL,
  reaction2 int DEFAULT NULL,
  reaction3 int DEFAULT NULL,
  reaction4 int DEFAULT NULL,
  reaction5 int DEFAULT NULL,
  reaction6 int DEFAULT NULL,
  reaction7 int DEFAULT NULL,
  reaction8 int DEFAULT NULL,
  url varchar(255) NOT NULL DEFAULT '',
  createdAt timestamp(0) without time zone NULL DEFAULT CURRENT_TIMESTAMP,
  updatedAt timestamp(0) without time zone NULL DEFAULT CURRENT_TIMESTAMP,
  PRIMARY KEY (id)
);

CREATE SEQUENCE wl_users_seq;
CREATE TABLE wl_users (
  id int check (id > 0) NOT NULL DEFAULT NEXTVAL ('wl_users_seq'),
  display_name varchar(255) NOT NULL DEFAULT '',
  email varchar(255) NOT NULL DEFAULT '',
  password varchar(255) NOT NULL DEFAULT '',
  type varchar(50) NOT NULL DEFAULT '',
  label varchar(255) DEFAULT NULL,
  url varchar(255) DEFAULT NULL,
  avatar varchar(255) DEFAULT NULL,
  github varchar(255) DEFAULT NULL,
  twitter varchar(255) DEFAULT NULL,
  facebook varchar(255) DEFAULT NULL,
  google varchar(255) DEFAULT NULL,
  weibo varchar(255) DEFAULT NULL,
  qq varchar(255) DEFAULT NULL,
  oidc varchar(255) DEFAULT NULL,
  "2fa" varchar(32) DEFAULT NULL,
  createdAt timestamp(0) without time zone NULL DEFAULT CURRENT_TIMESTAMP,
  updatedAt timestamp(0) without time zone NULL DEFAULT CURRENT_TIMESTAMP,
  PRIMARY KEY (id)
);

2. Vercel 环境变量

在 Vercel 项目的 Settings -> Environment Variables 中配置：

变量名示例值说明
DATABASE_URLpostgres://user:pass@host/dbNeon 连接字符串
WALINE_ADAPTERpg指定 PostgreSQL 适配器

3. 主题配置

// .vuepress/config.ts
export default defineUserConfig({
  theme: plumeTheme({
    comment: {
      provider: "Waline",
      serverURL: "https://your-waline-url.vercel.app",
    },
  }),
});
贡献者: paiad