# 这是什么一个统计README页面被打开多少次的badge生成服务, 其实原理上可以应用在任何可以显示svg的markdown/issue/html上, 当你每次打开这些页面, 浏览器就会向服务器发送一个请求, 将对应的访问数量加1, 之后生成最新的svg返回给浏览器.# 技术点1. badge的生成, 直接使用了google的开源项目, 非常简单2. 利用Flask写了非常简单的web服务, 接受请求, 缓存访问量, 生成svg并返回# 遇到的问题1. 缓存Github使用了camo作为图片的代理服务器, 当你审查README上的图片元素时, 你会发现所有的图片都不是指向真实的服务器地址, 而是一串的网址, 如下:而camo的服务器会对被代理的图片进行缓存, 使得当第一次刷新页面时, camo会像badge生成服务发起请求, camo记录访问次数为1, 之后再次刷新页面, camo会缓存这个badge图片, 从而无法达到我们想要的效果.经过一番搜索和研究发现, 在badge生成服务返回的http响应的header中, 需要动一些小手脚:1. 设置的内容为, 告诉camo服务器在使用缓存之前进行验证2. 这里我手动将资源的过期时间设置成了当前时间减去10分钟这样的话, 当用户打开README页面之后, camo服务器在返回缓存内容之前, 会像源服务器发起请求, badge生成服务收到请求之后会将访问量加1并生成相应的svg内容同时携带以上2个header信息返回.而正是由于这两个header的设置, camo服务器发现缓存的资源在10分钟之前已经过期, 于是就将最新的svg返回给了浏览器.# 使用方法在你的README里面, 添加一个图片:# 下一步计划1. > 所以如果你哪天发现你的访问量突然从0开始了, 还请见谅 :(3. 4. 新增生成最近7天/30天访问量折线图的badge