不蒜子前端简单实现：

当然，牛逼的不蒜子源码（比较绕，主要是考虑到代码健壮性的问题）是比这个轻量级多了。是使用js请求的方式，进行加载数据的。

网站统计主要看请求头Referer参数，一般是这个页面的链接。

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6     <script  src="https://blog-static.cnblogs.com/files/xunhanliu/jquery.js"></script>>
 7 </head>
 8 <body>
 9 本站总访问量<span id="busuanzi_value_site_pv"></span>次
10 本站访客数<span id="busuanzi_value_site_uv"></span>人次
11 本文总阅读量<span id="busuanzi_value_page_pv"></span>次
12 <script>
13     function BusuanziCallback_1048604830937(b) {
14        console.log(b);
15     }
16     $.ajax({
17             type: "get",
18             url: "//busuanzi.ibruce.info/busuanzi",
19             dataType: 'jsonp',
20             jsonp: 'jsonpCallback',
21             jsonpCallback:'BusuanziCallback_1048604830937',  //后面跟的这个是个随机数，能跟上面那个函数对应起来就行了。
22             beforeSend: function (xhr) {   //beforeSend定义全局变量
23                 xhr.setRequestHeader("Referer", "http://www.xunhanliu.top");  //浏览器上无效！！W3C标准文档规定，此header只能由浏览器进行设置，不允许开发者设置。当然你用其他语言开发就另说了。
24             },
25             success: function (data) {
26                 $('#busuanzi_value_site_pv').text(data.site_pv);
27                 $('#busuanzi_value_site_uv').text(data.site_uv);
28                 $('#busuanzi_value_page_pv').text(data.page_pv);
29             },
30 
31         }
32     );
33 </script>
34 </body>
35 </html>

跨域问题：

参见：https://blog.csdn.net/yesbuy201701/article/details/72616955 （这篇排版确实不咋地，还是转载。。。。，比较切中要害，凑合着看吧。）

setRequestHeader设置请求头

注：下面的内容来源于上面的这个链接！

设置html设置哪些请求头无效。当然你使用python中的request等，那这个东西就限制不住你了。

后来看W3C标准文档发现，这个请求头不是什么都可以设置的，标准里面明确规定了以下请求头信息是浏览器控制，开发者不允许设置这些请求头

Terminate these steps if header is a case-insensitive match for one of the following headers:

Accept-Charset
Accept-Encoding
Access-Control-Request-Headers
Access-Control-Request-Method
Connection
Content-Length
Cookie
Cookie2
Date
DNT
Expect
Host
Keep-Alive
Origin
Referer
TE
Trailer
Transfer-Encoding
Upgrade
User-Agent
Via

… or if the start of header is a case-insensitive match for Proxy- or Sec- (including when header is just Proxy- or Sec-).

The above headers are controlled by the user agent to let it control those aspects of transport. This guarantees data integrity to some extent. Header names starting with Sec- are not allowed to be set to allow new headers to be minted that are guaranteed not to come fromXMLHttpRequest.

不蒜子等网站统计的前端简单实现方式

不蒜子前端简单实现：

跨域问题：

setRequestHeader设置请求头

猜你喜欢