Waline私有化部署(Docker+SQLite)

参考资料：

https://blog.cuger.cn/p/859b/

官方文档

一、服务器端

流程

• 准备waline.sqlite文件
• docker-compose.yml配置

第一步：准备waline.sqlite

本次部署采用 SQLite 单文件数据库，需要准备 SQLite 数据库文件。

• 官方下载链接

• 本地下载链接

第二步：准备docker-compsoe.yml

创建~/docker-waline文件夹，添加docker-compsoe.yml文件，下面是我自用的docker-compsoe.yml文件：

# docker-compose.yml
version: "3"

services:
  waline:
    container_name: waline
    image: lizheming/waline:latest
    restart: always
    ports:
      - 8360:8360
    volumes:
      - ${PWD}/data:/app/data
    environment:
      TZ: "Asia/Shanghai"
      SQLITE_PATH: "/app/data"
      JWT_TOKEN: "d4as56d465sa"                             # 自行设置
      SITE_NAME: "爱上nas爱上家"                             # 博主名
      # SECURE_DOMAINS: "  "                                # 安全站点，限制访问权限
      DISABLE_REGION: "false"                               # 是否禁用IP归属地
      DISABLE_USERAGENT: "true"                             # 是否禁用浏览器标识
      IPQPS: 50,                                            # 限制访问频次
      COMMENT_AUDIT: "false"                                #评论发布审核开关
      # AUTHOR_EMAIL: "  "                                  # 博主email
      # SMTP_SERVICE: ""                                    # SMTP发信相关配置
      # SMTP_USER: ""
      # SMTP_SECURE: "true"
      # SMTP_PASS: ""
      SENDER_NAME: "Dorad"

第三步：设置好目录结构

创建~/docker-waline/data文件夹，并将此前下载的waline.sqlite文件复制到其下。 最终目录结构如下：

|--docker-waline
 	|--docker-compose.yml
 	|--data
 		 |--waline.sqlite

第四步：创建docker容器

# cd ~/docker-waline/data
docker-compose up -d

这时用浏览器访问http://ip地址:8360/ui/register地址，便能看到注册界面。

二、客户端

在vitepress中使用vue3页面引入，因为是抄的别人的项目代码，具体实现方式不太清楚，

参考项目地址：https://github.com/caorushizi/mediago/blob/

本人自用代码：

只需要修改这里的属性值就可以了function initWaline()

<script setup lang="ts">
import { onMounted, watch, ref, watchEffect } from "vue";
import { init, WalineInstance } from "@waline/client";
import "@waline/client/waline.css";
import { useData, useRoute } from "vitepress";

const route = useRoute();
const { isDark } = useData();

const commentsRef = ref<WalineInstance | null>(null);

watchEffect(() => {
  commentsRef.value?.update({
    dark: isDark.value,
  });
});

watch(
  () => route.path,
  () => {
    commentsRef.value?.destroy();
    initWaline();
  }
);

// 中文默认
const locale = {
  placeholder: '欢迎提出宝贵意见！（无需登录直接评论）',
};

function initWaline() {
  commentsRef.value = init({
    el: "#waline",
    serverURL: "https://nastool.work",
    dark: isDark.value,
    lang: "zh-CN",
    meta: [], 
    // 评论者相关属性。可选值: 'nick', 'mail', 'link', []
    locale, 
    // 评论框里面的提示文字，需要自己设置
    copyright: false,
    // 是否显示页脚版权信息
  });
}

onMounted(() => {
  initWaline();
});
</script>

<template>
  <div id="waline">hello world</div>
</template>

<style>
.wl-content p {  
  /* 评论颜色 */
  color: var(--vp-c-text-1);
}
.wl-panel {
  /* 评论上下区域 */
  margin: .5em 0;
}
</style>