为你的博客添加访问量统计

ivan_qhz 发布于2019-06-27 11:59 / 1877人阅读

摘要：所以我已经将服务迁移至上，有兴趣的同学请移步最新的一篇博文博客访问量统计工具查看最新版本的使用方法。但是针对博客的访问量统计，却没有什么可用的工具。

本文最初发布于我的个人博客：咀嚼之味

2016.04.23 通告： Hit Kounter 原本部署于 SAE 上，而近期 SAE 针对使用 MySQL 的应用开始收费。本项目只是一个本人使用业余时间开发的小工具；它本身包含的功能也很精简，并不适合使用付费服务。所以我已经将 Hit Kounter 服务迁移至 LeanCloud 上，有兴趣的同学请移步最新的一篇博文博客访问量统计工具 Hit Kounter v0.2 查看最新版本的使用方法。原本部署在 SAE 上的服务预计在 五一假期 后下线，对已经使用 Hit Kounter 的一些用户，我深感抱歉！

相信很多程序员朋友们都拥有了自己的技术博客。像 Hexo, Jekyll 这样的静态网站生成器甚是好用，而对于相对动态的内容，比如评论框，也有诸如多说和 Disqus 的工具可以使用。

但是针对博客的访问量统计，却没有什么可用的工具。很多同学在我的博客中留言问我，我的博文中显示的访问量是怎么做到的？我曾经尝试依靠百度统计是不是能解决这个问题，然而我失败了。于是我自己用 PHP 写了一个很简单的服务来完成这件事，经过一次重构，我把它命名为 Hit Kounter。

接下来会从以下几个方面介绍一下：

如何为你的博客添加访问统计

Hit Kounter 的 JS 接口

小结：Hit Kounter 的未来

如何为你的博客添加访问量统计 1. 引入脚本

首先，在你的页面中引入这个脚本；由于你可能在每个页面都需要显示访问量，把它加入根模板也许是个不错的选择。

2. 显示当前页面的访问量

你可以在页面的任何地方插入这句 HTML 片段，你之前引入的脚本会自动检查当前页面上带有 data-hk-* 属性的元素，并针对你给出的属性值向服务器请求数据，最后把得到的结果替换到上面的标签内。可以参考我博客中的例子。

3. 显示指定页面的访问量

如果你希望在文章列表页中显示各个页面的访问量分别是多少，那么你就要使用一个 url 来填充 data-hk-page 的属性值，就像这样：

那么 Hit Kounter 检测到这个标签以后，就会向服务器请求该地址的具体访问量，并最终将默认值 - 替换为实际值。可以参考我博客中的例子。

Hit Kounter 的 JS 接口

Hit Kounter 会在全局注入 Icarus 对象，它是与服务器交互的数据接口。通过它，我们就可以直接向服务器发送请求。先看看下面这个例子：

Icarus.request({
  api: "hk.page.get",
  v: "1.0",
  pages: [
    { url: "http://test.com/1" },
    { url: "http://test.com/2" },
    { url: "http://test.com/3" }
  ],
  success: function(result) {
    for (var i = 0; i < result.length; i++) {
      console.log(result.domain, result.url, result.count);
    }
  },
  failure: function(code, err) {
    console.log(code, err);
  }
});

上面这个例子中，我们主要是获取了三个页面的具体访问量；目前 Icarus 支持的接口有四个（具体可以参考 Hit Kounter Wiki）：

hk.page.increment

hk.page.get

hk.page.getTop

hk.page.getByDomain

至于如何使用就由你们自由发挥啦。

小结：Hit Kounter 的未来

当然，Hit Kounter 的功能不至于此啦，由于作者我还是个读研狗，最近得发论文了，所以更新进度暂且比较慢；目前 Hit Kounter 是 0.1 Beta版，未来会加入越来越多的功能，包括但不限于：

添加一个能够获得全站的访问总量的 API

通过添加

这样一个元素，便能够将全站访问量最高的五个页面罗列在 div 框内。

为用户提供一个很方便的方式来导入初始的访问量数据

完善各种可能的错误信息（包括服务端和浏览器端的错误）

TODO List 可以在这个 issue 中看到，而且因为 Hit Kounter 是开源项目，也很期待大家能够多吐槽，如果能给 Hit Kounter 贡献代码那就再好不过啦~。

GPU云服务器云服务器访问博客系统我为你添加统计如何添加数据统计

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/21352.html

为你的博客添加访问量统计

摘要：所以我已经将服务迁移至上，有兴趣的同学请移步最新的一篇博文博客访问量统计工具查看最新版本的使用方法。但是针对博客的访问量统计，却没有什么可用的工具。本文最初发布于我的个人博客：咀嚼之味 2016.04.23 通告： Hit Kounter 原本部署于 SAE 上，而近期 SAE 针对使用 MySQL 的应用开始收费。本项目只是一个本人使用业余时间开发的小工具；它本身包含的功能也很精...

gekylin 2019-08-21 13:29 评论0 收藏0
数据分析遇到PDF文本，怎么用Python批量提取内容

摘要：复杂系统仿真的微博客虚假信息扩散模型研究面向影子分析的社交媒体竞争情报搜集面向人机协同的移动互联网政务门户探析经验证。微博客的企业竞争情报搜集移动社交媒体用户隐私保护对策研究注意这里的提示，原先的个文件没有被再次抽取，只有个新文件被抽取。 showImg(https://segmentfault.com/img/bVbiU7y?w=1000&h=508); 本文为你展示，如何用Pyth...

cloud 2019-07-31 11:16 评论0 收藏0
为你的博客添加搜索功能吧!

摘要：提供个人博客文章搜索服务只需要配置个人博客地址载入博客数据开启服务即可开启文章搜索服务。对配置文件监控修改后服务及时地更新博客数据。 Search-Spider-Blog 提供个人博客文章搜索服务, 只需要配置个人博客地址, 载入博客数据, 开启Server服务, 即可开启文章搜索服务。对blogconfig.json配置文件监控, 修改后服务及时地更新博客数据。本人用的为Hexo...

vboy1010 2019-08-22 10:35 评论0 收藏0
打造数据科学作品集：搭建一个数据科学博客

摘要：读完本文，你将学会如何使用静态网站生成器，搭建一个属于自己的博客，用来展示数据科学作品。静态网站基本上，一个静态网站就是一个全是文件的文件夹。建立静态网站的一种方法是手写，然后上传所有的文件到服务器。这是「打造数据科学作品集」系列文章的第二篇。如果你喜欢该系列，而且想知道下一篇文章什么时候发布，你可以订阅我们。读完本文，你将学会如何使用 Pelican 静态网站生成器，搭建一个属于...

iamyoung001 2019-07-25 10:50 评论0 收藏0