用Github Pages+Hexo搭建博客之(八)Hexo博客Next主题添加统计文章阅读量（访问量/浏览量/阅读次数）功能

【置顶】【专栏】用Github Pages+Hexo搭建博客

文章目录

• 【置顶】【专栏】[用Github Pages+Hexo搭建博客](https://blog.csdn.net/qq_34243930/category_9662425.html)
• 1. 注册LeanCloud
• 2. 创建&配置应用
• 3. 修改主题配置文件
• 4. 配置域名，设置网络安全
• 5.重新启动部署Hexo
• 6.后台管理
• 7.部署云引擎以保证访客数量不被随意篡改
• 8. 一些坑

1. 注册LeanCloud

前往LeanCloud进行注册登陆

2. 创建&配置应用

点击创建应用

输入应用名称(名称随意), 选择开发版, 点击创建

创建成功后点击应用右上角的设置

点击存储，创建Class，Class名称设置为Counter(必须为Counter)，选择无限制，点击创建

创建后点击设置，点击应用Key，获取App ID和App Key，复制备用

3. 修改主题配置文件

将主题配置文件/themes/next/_config.yml中的leancloud_visitors:的enable设为true，并将App ID和App Key填入

4. 配置域名，设置网络安全

点击安全中心, 填写自己博客对应的域名（注意协议、域名和端口号需严格一致）

由于App ID和App Key是完全暴露的，所以防止他人使用，我们可以在应用设置里面设置Web安全域名，只有添加的域名才能使用该应用，防止有人Hack我们的数据库。点击设置，安全中心，Web域名安全，添加Blog域名，点击保存就OK了

5.重新启动部署Hexo

hexo clean
hexo g
hexo d

6.后台管理

当以上部分配置完成之后，当我们的博客页面第一次打开时，便会自动向服务器发送信息，在刚才创建的应用 test 的 Counter 表中创建一条数据。

7.部署云引擎以保证访客数量不被随意篡改

依次点击左侧云引擎 -> 部署 -> 在线编辑

点击创建函数

在弹出窗口选择Hook类型，在选择 Hook处选择beforeUpdate，在选择 Class处选择Counter类。粘贴下方代码后，点保存。

var query = new AV.Query("Counter");
if (request.object.updatedKeys.indexOf('time') !== -1) {
    return query.get(request.object.id).then(function (obj) {
        if (obj.get("time") + 1 !== request.object.get("time")) {
            throw new AV.Cloud.Error('Invalid update!');
        }
    })
}

然后单击创建按钮右侧的部署 -> 生产环境 -> 部署

待显示部署完成：1 个实例部署成功即可

8. 一些坑

很多文章到这里就结束了，但其实还有一些坑…

解决阅读次数: Counter not initialized! More info at console err msg.

方法一、安装插件hexo-leancloud-counter-security
命令行执行npm install hexo-leancloud-counter-security

方法二、将主题配置文件_config.yml中的对应项security置为false

解决hexo+next 首页的阅读次数一直是0，而文章中的阅读次数能正常显示？

网上的很多hexo添加阅读统计量都是老版本的next主题做法，新版本的已经集合了leancloud，只要开启主题下面lean_cloud功能并且在

/next/layout/_macro/post.swig里面加以下代码就足够了

{# LeanCould PageView #}
          {% if theme.leancloud_visitors.enable %}
             <span id="{{ url_for(post.path) }}" class="leancloud_visitors" data-flag-title="{{ post.title }}">
               <span class="post-meta-divider">|</span>
               <span class="post-meta-item-icon">
                 <i class="fa fa-eye"></i>
               </span>
               {% if theme.post_meta.item_text %}
                 <span class="post-meta-item-text">{{__('post.visitors')}} </span>
               {% endif %}
                 <span class="leancloud-visitors-count"></span>
             </span>
          {% endif %}