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

本文最初宣布于我的个人博客:品味之味

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. 引入剧本

<script src="http://jerry-cdn.b0.upaiyun.com/hit-kounter/hit-kounter-0.1.1.js"></script>

起首,在你的页面中引入这个剧本;由于你能够在每一个页面都须要显现接见量,把它到场根模板也许是个不错的挑选。

2. 显现当前页面的接见量

<span data-hk-page="current"> - </span>

你可以在页面的任何地方插进去这句 HTML 片断,你之前引入的剧本会自动搜检当前页面上带有 data-hk-* 属性的元素,并针对你给出的属性值向效劳器要求数据,末了把取得的效果替代到上面的标签内。可以参考我博客中的例子

3. 显现指定页面的接见量

假如你愿望在文章列表页中显现各个页面的接见量离别是多少,那末你就要运用一个 url 来添补 data-hk-page 的属性值,就像如许:

<span data-hk-page="http://jerryzou.com/posts/design-for-all-mobile-resolution/"> - </span>

那末 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 data-hk-top-pages="5"> 如许一个元素,便可以将全站接见量最高的五个页面排列在 div 框内。

  • 为用户供应一个很轻易的体式格局来导入初始的接见量数据

  • 完美种种能够的毛病信息(包含效劳端和浏览器端的毛病)

TODO List 可以在 这个 issue 中看到,而且由于 Hit Kounter 是开源项目,也很期待大家可以多吐槽,假如能给 Hit Kounter 孝敬代码那就再好不过啦~。

    原文作者:JerryZou
    原文地址: https://segmentfault.com/a/1190000004500874
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞