这周发现进入网站，刷新状态竟然持续了一分多钟，以为是新做完的Music页的特效显示太花里胡哨拖垮了加载，打开后台查看pending情况发现原来是不蒜子资源请求失败了，触发了一分钟的超时。

不蒜子那么多年来作为访客统计的利器，在近年缺点也渐渐显露，尤其是在网络方面，例如不能统计科学上网环境访问、高频的502失败等，而恰巧本站访客基本来自谷歌收录（某度、某狗引擎实在过度拉跨，在本站上线的三个月就被谷歌收录，对比向某度主动推送url后一个月后才收录，某度起大早赶晚集的行事作风的确声名在外，也籍着这个机会，不得不作出一些新尝试了。

查阅了一些博客，恰好有一个名为vercount比较新的项目名对标不蒜子，而且兼容相同的span标签、支持全球CDN、ip访客计数实测比不蒜子还要精确，唯一不足的是这是个为爱发电的公益项目，可能不知道未来哪天就挂了。因此记录下这篇文章，希望更多的博客自建者考虑使用vercount替代busuanzi。

其目前支持span标签或者React框架：

标签配置

官方教程很简单，对于footer的访客统计，可以加入以下代码快速引入: 

1
2
3
4
5
6
7
<!-- js引入 -->
<script defer src="https://events.vercount.one/js"></script>

<!-- 标签 -->
Total Page View <span id="vercount_value_page_pv">Loading</span>
Total Visits <span id="vercount_value_site_pv">Loading</span>
Site Total Visitors <span id="vercount_value_site_uv">Loading</span>

模板配置

对于与本站类似的butterfly主题配置，可以修改模板文件解决，主要涉及以下文件：

additional-js.pug：js插入换成vercount的资源 

1
2
3
- //additional-js.pug
  if theme.vercount.site_uv || theme.vercount.site_pv || theme.vercount.page_pv
    script(async data-pjax src= theme.asset.vercount || '//events.vercount.one/js')

post-info.pug：span标签，使用官网定义的vercount_value_xx替代不蒜子的busuanzi_value_xx 

1
2
3
4
5
6
7
8
9
post-info.pug
        else if theme.vercount.page_pv
          +pvBlock('','post-meta-pv-cv','')
            span#vercount_value_page_pv
              i.fa-solid.fa-spinner.fa-spin
      else if theme.vercount.page_pv
        +pvBlock('','post-meta-pv-cv','')
          span#vercount_value_page_pv
            i.fa-solid.fa-spinner.fa-spin

card_webinfo.pug: 卡片模板，换用vercount配置名称 

1
2
3
4
5
6
7
8
9
10
if theme.vercount.site_uv
  .webinfo-item
    .item-name= _p('aside.card_webinfo.site_uv_name') + " :"
    .item-count#vercount_value_site_uv
      i.fa-solid.fa-spinner.fa-spin
if theme.vercount.site_pv
  .webinfo-item
    .item-name= _p('aside.card_webinfo.site_pv_name') + " :"
    .item-count#vercount_value_site_pv
      i.fa-solid.fa-spinner.fa-spin

yml文件和其他js配置都引入vercount配置即可： 

1
2
3
4
5
6
7
8
9
10
11
12
13
//- _config.yml：
vercount:
  site_uv: true
  site_pv: true
  page_pv: false


//- scripts\events\merge_config.js：
vercount: {
    site_uv: true,
    site_pv: true,
    page_pv: true
}

成功替代后在浏览器查看其对象id应该变更：

1
2
3
4
5
old：
<div class="item-count" id="busuanzi_value_site_uv"><i class="fa-solid fa-spinner fa-spin"></i></div>

new:
<div class="item-count" id="vercount_value_site_uv"><i class="fa-solid fa-spinner fa-spin"></i></div>

纵使版本、建站框架不同，大部分情况只需要全局搜索busuanzi，替换对应的模板或者直接插入标签即可使用，凭其优点是值得折腾一次的，祝应用成功~。

参考链接，感谢这位提起vercount的仁兄：

  1. 解决不蒜子文章阅读计数错误的问题