这篇文章是一个记录，记录我的一个 GitHub 仓库即将收获 500 个star
还差一个 😄
接下来简单介绍一下这个仓库： visitor-badge
这个是我很久之前准备开始用 Github issue 做博客时做的，从 hexo 迁移过去之后 发现用 github issue 写博客没有访客统计功能（虽然本来也没人看）。
但是由于不管是 github issues，还是 github 的 README，都只支持 markdown 语法，不能使用各种第三方统计了。
就自己做了一个访客统计的徽章（ badge ）服务。
原理很简单，徽章是一个 svg，你只需要在你的 issues 或者 readme 中添加一个 markdown 的图片：
当有人打开你的 issue 或者 github 仓库时，浏览器会加载这个图片，服务器就会发出一个请求。
之后根据请求里的 page_id 来计数，并将最新的数量生成到一个 svg 图片中，将这个 svg 返回，浏览器就可以显示出来了。
注意这里的参数：page_id, 需要自己手动给一个唯一的字符串，没有特定规则，只要能唯一标识当前页面即可。
最开始想用 http request header 里面的 referrer 字段，但是后来发现 github 对图片进行了代理，服务器收到的图片请求中没有了原先的 referrer 字段。
另外实现过程中还有一点，就是缓存，github 的图片代理服务器会对你的图片进行缓存，所以我在做第一版的时候发现这个 svg 图片更新有问题，就开始研究 github 用的这个 camo 服务器，后来在返回 svg 的时候在 response 的 header 中做了点手脚：
添加一个 no-cache 的 header： 'Cache-Control': 'no-cache,max-age=0'
将 Expires header 的值设置为了当前时间减去 10 分钟
这样设置了之后，就可以绕过 camo 的缓存策略，每次都可以顺利的 +1， 实际效果可以点击：https://github.com/jwenjian 体验。
最后补充一点小知识：
这个原理被很多恶意的网站用来收集隐私信息，比如说有的网站给你发的邮件里，不管是营销邮件还是垃圾邮件或者其他的东西，在邮件正文中插入一个 1像素 的图片，图片的url地址都是精心构造好的，当你打开邮件时，发送者就可以知道：
谁，在什么时间，用什么设备，什么ip，什么网络打开了这个邮件。
有了ip就知道你是在什么地方（大致）打开的这个邮件。
从而可以对这个营销邮件的效果进行分析，比如发送了 10000 个邮件，有多少人打开之类的。
再往后挖，甚至还可以挖出你的兴趣，比如给你发不同的主题邮件，购物的，创业的，培训班的等等，一样发一个，看看你都打开了哪些，给你打标签...
所以现在一般邮件客户端都默认不加载图片，一是节省打开邮件的时间，加快打开速度，二也是为了保护你的隐私。