近期发现许多以 butterfly theme 的独立站点的 busuanzi 数据统计都访问不了，发现是默认 busuanzi cdn 地址挂掉了。去 busuanzi github 上看发现可以 docker 自建服务器，因此便尝试此法。在此过程中其实还是发现了额外的问题，在此处记录一下。

自建 Busuanzi 服务器

跟随 官方手册 足以，也比较简单，写一份 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"
    volumes:
       - ./data/bsz:/app/expose
    links:
      - redis
    depends_on:
      - redis
    environment:
      WEB_LOG: true                             # 是否开启日志
      WEB_DEBUG: false                          # 是否开启debug模式
      WEB_CORS: "*"                             # 跨域访问
      BSZ_EXPIRE: 0                             # 统计数据过期时间 单位秒, 请输入整数 (无任何访问, 超过这个时间后, 统计数据将被清空, 0为不过期)
      BSZ_SECRET: "bsz"                         # 签名密钥 // 请设置为任意长度的随机值
      API_SERVER: http:\/\/yourdomain:8080\/api # 填写你的 API 地址
      REDIS_ADDRESS: redis:6379                 # redis地址
注意事项
  1. CORS 跨域访问，默认是 "*"，即允许来自任何域的访问，在初期调试时可开启，上线部署后还是推荐改成单域名，例如 https://ihave.news。
  2. AIP 地址需要转义，即 / 需要用 \/ 表示。
  3. 如果不配置 SSL，则 API 地址用 http。也可自行配置 Nginx SSL，该端口也支持走 Https 访问。
  4. 提前创建好 ./data/redis 和 ./data/bsz 两个目录，防止启动时报错。

启动 docker 的命令：

1
sudo docker-compose up -d

停止并删除 docker 的命令：

1
sudo docker-compose down
注意事项

此处需要注意的是，如果是在启动过 docker 后配置了 https 访问，要想生成的 js 代码中的 api 前缀正确，则必须先清空 ./data/bsz 目录后再执行启动命令。

浏览器访问 http(s)://yourdomain:8080 ，可以打开页面即为成功部署。

CleanShot 2024-08-19 at 02.01.56@2x.png

注意事项

这个页面中给出的地址是原作者的地址，并没有根据实际配置的域名显示，因此需要自己组合 js 的地址。其实也很简单，就是该页面地址后加 /js ，即 http(s)://yourdomain:8080/js 可访问尝试是否可以打开。

配置到 Butterfly 主题中

按照 Butterfly 安装文档(三) 主题配置-1 说明，将上述 js 地址配置到 cdn 中：

1
2
3
CDN:
  option:
  	busuanzi: http(s)://yourdomain:8080/js

又遇新问题

此时重新访问站点，发现站点访问数依旧是在转圈圈，打开调试台已经看不到 js 访问报错，说明已经成功加载。查看 http(s)://yourdomain:8080/api 该条请求也能正常返回数据，并且刷新页面，该返回数据也能正常 +1，说明问题出在主题上。

CleanShot 2024-08-19 at 02.16.14@2x.png

翻看 butterfly 源码，全文搜索 busuanzi ，最终定位到两个文件：

additional-js.pug

card_webinfo.pug

其中，additional-js.pug 是负责将 js 加入到页面，对应就是 busuanzi 站点页面的 script 语句。 card_webinfo.pug 是负责将请求返回的数据显示到页面，关联的字段是 busuanzi_value_site_uv 和 busuanzi_value_site_pv 。对比返回的数据容易可知，busuanzi_value 是数据前缀。

再回到 busuanzi.js 中查看，发现默认前缀是 busuanzi，真相大白。由于前缀的不匹配，导致虽然请求正常，但无法渲染。

修改方案

其实很简单，就是在 script 中增加一个 data-prefix="busuanzi_value" 即可，但问题是得修改源码，可能下一次主题更新就覆盖了。该问题相关的 PullRequest 也已经提交到原作者。

1
script(async data-pjax src= theme.asset.busuanzi || '//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js' data-prefix="busuanzi_value")

替代方案

其实，还有一种不更改源码的替代方案，只需要在 _config.butterfly.yml 中增加一条新的 script 即可：

1
2
3
inject:
  bottom:
    - <script defer pjax data-api="http(s)://yourdomain:8080/api" data-prefix="busuanzi_value" src="http(s)://yourdomain:8080/js"></script>

请自行替换成自己的真实地址就行。