默认情况下，Solitude 主题在文章页面加载时，可能会出现 “文章热度一直转圈” 的现象。这通常是由于 Busuanzi 网络响应较慢导致的。别担心，这并不意味着部署有问题，只需要将 Busuanzi 部署到本地，即可加速加载。

项目地址

Busuanzi 项目 GitHub 地址

前提条件

  1. 服务器要求：拥有一台服务器，支持 Docker 环境，并能使用 Docker Compose（建议使用宝塔环境进行管理）。
  2. 配置要求：需要配置好站点域名（如 busuanzi.example.com）并能进行 DNS 解析。

步骤 1：添加站点

首先，在您的宝塔面板中添加一个站点。例如，创建 busuanzi.example.com，也可以根据自己的需求添加不同的域名。

步骤 2：创建 Docker Compose 配置

在您的站点根目录下创建 docker-compose.yaml 文件，内容如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
version: "3.8"

services:
  redis:
    image: "redis:alpine"
    volumes:
      - ./data/redis:/data

  bsz:
    image: "xcsoft/busuanzi:latest"
    ports:
      - "8080:8080" # 如果8080端口已占用，可修改为其他端口，如8999:8080
    links:
      - redis
    depends_on:
      - redis
    environment:
      WEB_LOG: true # 是否开启日志
      WEB_DEBUG: false # 是否开启调试模式
      WEB_CORS: "*" # 跨域访问配置
      BSZ_EXPIRE: 0 # 统计数据过期时间，0表示不过期
      BSZ_SECRET: "bsz" # 签名密钥（设置为任意长度的随机值）
      API_SERVER: http://127.0.0.1:8080 # 修改为您的 API 地址
      REDIS_ADDRESS: redis:6379
      BSZ_PATHSTYLE: true
      BSZ_ENCRYPT: MD516

请根据实际情况修改 API_SERVER 地址和端口号。

如果你的网址为 busuanzi.example.com，那么就需要填写 https:\/\/busuanzi.example.com\/api

如果您的服务器端口被占用，可以根据需要修改 8080 端口为其他未占用的端口，例如 8999:8080。

步骤 3：执行 Docker Compose

登录到服务器，进入站点目录，例如：

1
cd /www/wwwroot/busanzi.example.com

然后执行以下命令启动服务：

1
docker-compose up -d

步骤 4：设置 Nginx 反向代理

回到您的网站设置中，在 Nginx 配置文件中设置反向代理，将请求转发至本地的 127.0.0.1:8080（或您设置的其他端口）。

步骤 5：配置域名解析

登录到您的域名提供商平台，配置域名解析，将您的域名（例如 busuanzi.example.com）指向服务器的 IP 地址。

步骤 6：完成部署

至此，您已经完成了本地化部署，访问 https://busuanzi.example.com（或您配置的其他域名）即可查看 Busuanzi 服务是否正常工作。如果可以正常显示以下内容，即为正常。

步骤 7：修改前端代码

在前端代码中，将 busuanzi.js 文件中的 API 地址修改为您的域名，并将文件保存至本地的 source 文件夹。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
!(function () {
  let t = ["site_pv", "site_uv", "page_pv", "page_uv"],
    e = document.currentScript,
    a = e.hasAttribute("pjax"),
    n = e.getAttribute("data-api") || "https://busuanzi.example.com/api", // 修改为你的域名
    i = e.getAttribute("data-prefix") || "busuanzi",
    r = e.getAttribute("data-style") || "default",
    o = "bsz-id",
    s = () => {
      let e = new XMLHttpRequest();
      e.open("POST", n, !0);
      let a = localStorage.getItem(o);
      if (a != null) e.setRequestHeader("Authorization", "Bearer " + a);
      e.setRequestHeader("x-bsz-referer", window.location.href);
      e.onreadystatechange = function () {
        if (e.readyState === 4 && e.status === 200) {
          let a = JSON.parse(e.responseText);
          if (a.success) {
            t.forEach((t) => {
              let e = document.getElementById(`${i}_${t}`);
              if (e != null) {
                e.innerHTML = formatNumber(a.data[t], r);
              }
              let n = document.getElementById(`${i}_container_${t}`);
              if (n != null) {
                n.style.display = "inline";
              }
            });
            let n = e.getResponseHeader("Set-Bsz-Identity");
            if (n) localStorage.setItem(o, n);
          }
        }
      };
      e.send();
    };

  if (a) {
    let t = window.history.pushState;
    window.history.pushState = function () {
      t.apply(this, arguments);
      s();
    };
    window.addEventListener("popstate", s, false);
  }

  function formatNumber(t, e) {
    if (e === "comma") return t.toLocaleString();
    if (e === "short") {
      const e = ["", "K", "M", "B", "T"];
      let a = Math.floor(Math.log10(t) / 3);
      return `${Math.round(100 * (t / Math.pow(1e3, a))) / 100}${e[a]}`;
    }
    return t.toString();
  }
})();

步骤 8：修改 _config.solitude.yml 配置

在 Solitude 主题的 _config.solitude.yml 文件中，添加 busuanzi.js 文件的引用。修改代码如下：

1
2
3
4
5
6
7
8
9
10
11
# Busuanzi
busuanzi: true
# 0: Original / 1: Custom
# 0: 原版 / 1: 自定义版
busuanzi_use: 1

extends:
  head:
    # 插入到 head
  body:
    - <script defer pjax src="/busuanzi.js"></script>

至此，您已经完成了 Busuanzi 本地化加速的配置和部署！您的站点应该能够更快速地加载热度数据，并避免因外部网络问题导致的加载缓慢现象。