跳至主要內容

宝塔面板独立部署 Waline 评论系统

Bing🐣宝塔面板Waline自部署宝塔面板Waline大约 6 分钟

宝塔面板独立部署 Waline 评论系统

由于近期将自己的博客由 WordPress 迁移到了 VuePress，刚开始使用的是Giscusopen in new window评论系统，基于 Github 仓库的Discussions功能，鉴于 Github 在国内访问巨慢，从而改用另一个有名的评论系统Walineopen in new window。官网快速上手教程中使用的是LeanCloud和Vercel进行部署，作为一名开发加上有自己的服务器还是比较喜欢自己去部署服务，好在官网也提供了独立部署open in new window的教程，通过文档及网络的教程记录下使用宝塔面板部署 Waline 服务。

宝塔面板添加站点

宝塔面板先添加一个纯静态的站点，并创建相应的 MySQL 数据库，记录下数据库账号和密码。

image
image
image
image

配置 SSL 证书并勾选强制 HTTPS。

image
image

初始化数据库

选择上面添加站点中创建的数据库，点击右侧的管理按钮打开phpMyAdmin。

image
image

选择菜单栏的SQL，输入文档提供的waline.sqlopen in new window中的脚本。

image
image

注意

下方的 SQL 脚本是复制的waline.sqlopen in new window中的内容，不保证是最新的脚本，随着 Waline 的更新，脚本内容也有可能会跟着更新，请以waline.sqlopen in new window中的内容为准。

SQL 脚本
/*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */;
/*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */;
/*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */;
/*!40101 SET NAMES utf8 */;
SET NAMES utf8mb4;
/*!40014 SET @OLD_FOREIGN_KEY_CHECKS=@@FOREIGN_KEY_CHECKS, FOREIGN_KEY_CHECKS=0 */;
/*!40101 SET @OLD_SQL_MODE=@@SQL_MODE, SQL_MODE='NO_AUTO_VALUE_ON_ZERO' */;
/*!40111 SET @OLD_SQL_NOTES=@@SQL_NOTES, SQL_NOTES=0 */;


# Dump of table wl_Comment
# ------------------------------------------------------------

CREATE TABLE `wl_Comment` (
  `id` int(11) unsigned NOT NULL AUTO_INCREMENT,
  `user_id` int(11) DEFAULT NULL,
  `comment` text,
  `insertedAt` timestamp 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(11) DEFAULT NULL,
  `rid` int(11) DEFAULT NULL,
  `sticky` boolean DEFAULT NULL,
  `status` varchar(50) NOT NULL DEFAULT '',
  `like` int(11) DEFAULT NULL,
  `ua` text,
  `url` varchar(255) DEFAULT NULL,
  `createdAt` timestamp NULL DEFAULT CURRENT_TIMESTAMP,
  `updatedAt` timestamp NULL DEFAULT CURRENT_TIMESTAMP,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;



# Dump of table wl_Counter
# ------------------------------------------------------------

CREATE TABLE `wl_Counter` (
  `id` int(11) unsigned NOT NULL AUTO_INCREMENT,
  `time` int(11) DEFAULT NULL,
  `reaction0` int(11) DEFAULT NULL,
  `reaction1` int(11) DEFAULT NULL,
  `reaction2` int(11) DEFAULT NULL,
  `reaction3` int(11) DEFAULT NULL,
  `reaction4` int(11) DEFAULT NULL,
  `reaction5` int(11) DEFAULT NULL,
  `reaction6` int(11) DEFAULT NULL,
  `reaction7` int(11) DEFAULT NULL,
  `reaction8` int(11) DEFAULT NULL,
  `url` varchar(255) NOT NULL DEFAULT '',
  `createdAt` timestamp NULL DEFAULT CURRENT_TIMESTAMP,
  `updatedAt` timestamp NULL DEFAULT CURRENT_TIMESTAMP,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;



# Dump of table wl_Users
# ------------------------------------------------------------

CREATE TABLE `wl_Users` (
  `id` int(11) unsigned NOT NULL AUTO_INCREMENT,
  `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,
  `2fa` varchar(32) DEFAULT NULL,
  `createdAt` timestamp NULL DEFAULT CURRENT_TIMESTAMP,
  `updatedAt` timestamp NULL DEFAULT CURRENT_TIMESTAMP,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;




/*!40111 SET SQL_NOTES=@OLD_SQL_NOTES */;
/*!40101 SET SQL_MODE=@OLD_SQL_MODE */;
/*!40014 SET FOREIGN_KEY_CHECKS=@OLD_FOREIGN_KEY_CHECKS */;
/*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */;
/*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */;
/*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */;

脚本执行完成后生成三张表，用于存储评论的相关数据。

image
image

添加域名解析

CloudFlare 的 DNS 记录中添加解析，IP 地址填写自己的服务器 IP，点击保存后即可。

image
image

部署 Waline

可以参照官网独立部署open in new window教程，里面比较推荐的是直接运行的方式，当然如果你对 Docker 熟悉的话也可以该部署方式。

初始化项目

提示

如果你对 Git 相关操作不熟悉，可以直接下载waline-server-publicopen in new window仓库的内容，参考文档服务器环境变量open in new window修改.env里面的相关参数后，上传到服务器相应位置后改名为waline-server，可以忽略下面的内容从PM2 运行项目开始阅读。

为了方便修改及服务器拉取代码，这里推荐使用 Github 仓库的形式，先在电脑中创建一个文件夹waline-server，进入到waline-server文件夹中执行npm init，一路回车确认即可，此时会生成一个package.json的文件。

安装依赖

执行下面的命令安装需要的依赖。

yarn
yarn add @waline/vercel dotenv

添加环境变量

新建一个.env的文件，填入下面的内容，按需修改相关内容和添加新的环境变量配置，其他环境变量参考官网服务端环境变量open in new window。里面的邮件配置按需修改成功你们自己的或者使用其他通知方式，具体参考文档评论通知open in new window。MySQL 也可以换成你们常用的数据库，所支持的数据库参考文档的数据库服务支持open in new window。

# 基本配置
SITE_NAME="Bing🐣" # 站点名称
SITE_URL="https://liubing.me" # 站点地址

# 显示配置
LEVELS="0,10,20,50,100,200" # 等级标签

# 安全配置
SECURE_DOMAINS="https://liubing.me" # 安全域名
AKISMET_KEY="" # Akismet 反垃圾评论服务 Key

# 邮件配置
SMTP_HOST="" # SMTP 服务器地址
SMTP_PORT="" # SMTP 服务器端口
SMTP_USER="" # SMTP 用户名
SMTP_PASS="" # SMTP 密码
AUTHOR_EMAIL="" # 博主邮箱用来接收新评论通知

# MySQL配置
MYSQL_DB="" # 数据库库名
MYSQL_USER="" # 数据库用户名
MYSQL_PASSWORD="" # 数据库密码
image
image

添加启动文件

新建启动文件index.js，写入以下启动脚本

const dotenv = require('dotenv')
dotenv.config()
require('@waline/vercel/vanilla.js')

初始化仓库

在 Github 上新建一个Private的私人仓库，注意不要使用Public公开的仓库，因为环境变量涉及到一些私密参数，这些参数不已公开。如我自己在 Github 上的的仓库是：https://github.com/liub1934/waline-serveropen in new window。

然后添加.gitignore文件用于忽略上传node_modules，内容如下所示。

.gitignore
node_modules/

最后将内容推送到上述的 Github 仓库中。

运行项目

拉取代码及安装依赖

登录到自己的服务器，使用下面的命令将上面的仓库拉取到服务器本地，由于私人仓库原因会要求输入 Github 的账户密码。

git clone https://github.com/liub1934/waline-server.git

也可以使用 Github Token 的形式去拉取私人仓库，如下所示：

git clone https://Token@github.com/liub1934/waline-server.git

Token 可以点击链接open in new window去申请。

项目拉取完成后同样进入waline-server文件目录，执行yarn install或者npm install安装依赖。

PM2 运行项目

依赖安装完成后打开宝塔面板的PM2管理器或者Node.js版本管理器管理器，两者互斥，没有的安装一个即可，这里以PM2管理器为例。

点击添加项目按钮添加一个项目，填写如下内容保存：

  1. 启动文件: /www/wwwroot/waline.liubing.me/waline-server/index.js
  2. 运行目录: /www/wwwroot/waline.liubing.me/waline-server
  3. 项目名称: waline-server
image
image

保存可以看到列表多出来一个项目，运行的端口号是8360，记住这个端口号，后面需要配置反向代理。

image
image

反向代理配置

打开站点设置，找到反向代理。

image
image

点击添加反向代理按钮，添加反向代理，填写代理名称waline-server和目标 URLhttp://127.0.0.1:8360

image
image

注意

最后记得在安全 防火墙中放行该端口。

验证

不出意外的话打开访问[域名]/ui/register就能看到注册页面了，首个注册的用户就能成为系统管理员。

image
image

管理员登录后就能进行一些个人设置和管理。

image
image
image
image

最后将部署好的服务接入自己的博客，测试评论及邮件通知是否正常。

image
image
image
image