首先我们写这个系统之前,要先构建一个示例网站,因为我对前端也不太懂。所以就下载了一套电影网站做为示例站。

attachments-2018-06-doXiykr85b10b0b070ac4.

首先我介绍一下为什么要建示例网站,因为我们这套流量分析系统是用来分析NGINX的日志数据的,NGINX的日志数据是用户网站访问后生成的,所以我们需要搭建一个网站,来产生一些用户行为数据。然后通过javascript快速上报到打点服务器,然后打点服务器再上报到nginx,nginx会生成用户行为日志,再通过我们用GO开发的流量统计系统分析处理后中,再由前台数据展示出来。

现在我们来看看如何创建一个示例网站,这里我用的是光线CMS电影系统。需要的同学请自行百度下载。

架设网站之前我们要有一个PHP环境,光线CMS电影系统是用PHP开发的。所以我测试过护卫神nginx大师,安装的时候竟然空白页,调试过多次也没成功。所以最后换成了宝塔LINUX套件(我用的WINDOWS版),这个就没问题了。PHP版本选择5.2就可以。MYSQL用5.7.

这是我安装上的。

attachments-2018-06-uzoRJ1y95b10b1fdb7822.

WEB SERVER直接安装nginx,PHP安装php5.2,mysql安装5.7就可以了。然后到首页把web面版安装上。必须装这个。要不没法改nginx配置文件

attachments-2018-06-3TailBSk5b10b2553ebc3.attachments-2018-06-fHjkZ1mQ5b10b267a2911.

安装这些就可以了,好了现在开始开一个网站空间,按下图开就可以了(参数看自己喜好设置)PHP必须选5.2

attachments-2018-06-xlJgcZRD5b10b30996bbc.开好后列表中就多一条网站记录

attachments-2018-06-77XqwMja5b10b35f62d8e.在这个网站上按右键。打开根目录,把下载好的GXCMS源码放到里面

attachments-2018-06-s4dyiLfY5b10b4315f921.这3个文件可以删除了

好了。我们开始安装,打开浏览器,输入网址http://www.rizhi.test:8888

attachments-2018-06-lOnmODs65b10b47f468d3.

提示未安装,稍等3秒,直接跳到安装界面

attachments-2018-06-UR7iH67p5b10b4a5dfbd7.点接受许可,开始安装,没有出错,或权限都对号就直接下一步,没红的都是绿的就行

attachments-2018-06-tyjjRYM65b10b4db3d667.创建数据库并写入数据,不知道数据库信息的可以到宝塔面版里数据库里查看。都显示的

attachments-2018-06-UZtQs8Vg5b10b554a5890.attachments-2018-06-tmZy4wI85b10b5ab0c90a.把这三项都填好。点下一步。

好了。安装好了。直接进入后台,后台用户名admin,密码admin888

attachments-2018-06-ztwf4X7g5b10b5ef70a08.attachments-2018-06-FdXV4DZP5b10c08865d20.这是后台

attachments-2018-06-8lrBzXFI5b10c0ae63cad.

这是主页,因为新网站。没有数据。我们先采集一些。后台有一键采集功能,不用采集太多。采集几百条就够了

attachments-2018-06-w5a8t1Zo5b10c0e50b9ce.进入后台后,点采集管理,然后点采集本周,就够用了

开始采集了。会采集12页数据,每页20条,一共240条。测试够用了。几分钟就采集完了。请稍等一下。

attachments-2018-06-PlLl8fit5b10c207d8c1b.采集完后,到主页看看,发现有很多电影数据。点列表页,内容页,发现都能进入。就可以了,够用了

attachments-2018-06-wWoyiy545b10cd96e40bb.有了网站后,我们下一步,就是通过创建一个JS获取用户的数据上报到打点服务器。

要上报数据。肯定是全局上报,即网站每个页面都要上传到打点服务器的。

我们先创建一个tongji.js文件,把这个文件链接到网站里。让网站的所有页面都能访问到这个js文件。

attachments-2018-06-PwQ60TUG5b10ce879e4cc.

在光线CMS后台就可以一键设置全局统计代码。是不是很方便。系统设置-网站信息设置-第三方统计代码。把里面的代码网址改成我们自己的就可以了http://www.rizhi.test:8888/tongji.js

修改完后保存一下该页,虽然我们添加了统计代码,但是现在还没有tongji.js文件。所以我们现在需要先创建一个

到网站根目录下新建一个tongji.js文件。我们发现光线CMS系统下面用的jquery,所以我们用jquery来实现统计代码

我们先测试一下tongji.js能不能被调用成功。写一个测试代码

$(document).ready(function () {
alert(123)
})

然后保存tongji.js,然后刷新一下网站。应该弹出窗口123,无论是首页,列表页,内页都会弹出123,就说明可以调用。

现在我们来编写上报用户信息的代码。用原生js来实现

代码如下:

$(document).ready(function () {
$.get("上报到打点服务器",
{
"time":gettime(),
"url":geturl(),
"refer":getrefer(),
"ua":getuser_agent()
        }
    )
function gettime(){
var nowDate = new Date();
return nowDate.toLocaleString();
}
function geturl(){
return window.location.href;
}
function getip(){
return returnCitySN["cip"]+','+returnCitySN["cname"];
}
function getrefer(){
return document.referrer;
}
function getcookie(){
return document.cookie;
}
function getuser_agent(){
return navigator.userAgent;
}
})

解释下代码的功能:

gettime(); //js获取当前时间
getip(); //js获取客户端ip,这个也可以不需要上报,因为NGINX日志access_log有获取用户的IP
geturl(); //js获取客户端当前url
getrefer(); //js获取客户端当前页面的上级页面的url,这个非常重要。做统计系统这个是最重要的
getuser_agent(); //js获取客户端类型
getcookie() //js获取客户端cookie,这个比较大。看情况上报


$(document).ready(function () { //这个网页准备充分以后准备这个方法
$.get("http://www.rizhi.test:8888/dig", //发起一个get请求的ajax请求,第一个参数是目标地址,第二个参数是ajax带过去的数据
{
"time":gettime(),
"url":geturl(),
"refer":getrefer(),
"ua":getuser_agent()
        }
    )

cookie信息我们就不上报了。

改好了。我们现在访问一下网站。用谷歌浏览器。打开网站后打开开发者工具,按F12快捷键就能打开

然后刷新一下网页,在network标签搜索框中搜索dig应该能搜索到dig上报记录,如果没有。请清空浏览器缓存,或检查tongji.js代码a
attachments-2018-06-2yINz77k5b110571a7132.

我这边看到能正常上报,上报的参数有哪些呢?我们去看一下

我们从下图可以看到tongji.js上报了用户的time,url,refer,user_agent信息到打点服务器,当然jquery已经帮我们decode以后的数据上报了

attachments-2018-06-0TxBSnjN5b110740e4fa3.attachments-2018-06-NP9wbWNV5b11074e959bd.

但是是404错误。当然是404,因为我们还没有创建dig。现在我们一会去创建一下

 

还有一个问题。就是如果同一个页面防止同一个页面上报多次的情况,统计就不准了。比如说。同一个页面里面套多层页面。比如页面里套iframe多个的情况。这样统计就不准了。为了

防止情况发生我们可以加上锁。

在get之前上锁:

var lock=true;

然后get后解锁:

function(){

    lock=false;

}

代码如下:这样就可以有效的防止同一个页面被引用多次上报多次的问题了。具体不太懂jquery,道理这样的。想要详细了解的请自行GG

$(document).ready(function () {
var lock=true;
$.get("http://www.rizhi.test:8888/dig",
{
"time":gettime(),
"url":geturl(),
"refer":getrefer(),
"ua":getuser_agent()
        },function () {
            lock=false;
}
    )

统计学的方面看,每天多几个少几个是没有关系的。如果你的网站量是100万。少几个多几个是没关系的

但是如果因为tongji.js引用不当,被多次调用。如果你每天 有100访问量。你上传了200万300万,那最上层的漏斗就统计结果就不准了。

好了。最后我们就实现了这样一个网站,然后每个页面都上报用户数据到打点服务器上。接下来我们来架设打点服务器。


打点服务器设置

在一个比较大的WEB网站,几百万几千万流量的上报打点请求,如果我们用一个低性能的WEBSERVER做打点服务器,会非常卡,影响效率,所以最好用好一些的服务器。

我们的打点服务器需要用到nginx的一个模块,ngx_http_empty_gif_module,这个模块,这个module可以生成1x1像素大小的透明的gif图片。非常小的,我们的宝塔虽然已经支持这个模块。但是我是没弄明白,用他自己生成的日志看不到dig上传的信息,很奇怪,调了好久都不行,最后不行,我还是自己到官方下载原版NGINX安装一下。下面的配置都是用官方NGINX配置的。可以一次成功。

我们现在去配置一下这个模块

去官网下载最新版的nginx,解压,我是WIN10不需要编译,如果是linux或mac系统的,请自行编译一下

编译方法:

#./configure --prefix=/usr/local/nginx

#make

#make install

编译完成后我们去/usr/local/nginx下看看。

我是 win10

放到D:\nginx-1.13.12

我们进到conf,打开nginx.conf

找到这段代码 location / {
            root   html;
            index  index.html index.htm;
        }

在代码下面加入如下代码

location = /dig{
            empty_gif;
           error_page 405 =200 $request_uri;
        }

上面的端口改成8000
attachments-2018-06-PrjS4lPY5b114ec053456.

然后我们开启一下服务,最后开启之前把服务名改一下。要不然和宝塔的冲突了。

attachments-2018-06-TMZOtfFS5b114fb436cd2.双击nginx11.exe,窗口闪退,就说明成功了。到任务管理器中看看有没有两个nginx11.exe进程。有就说明成功了

attachments-2018-06-1AcO9kn55b115000392ec.

然后打开网页。访问http://localhost:8000/dig,看看网页中间有没有一个小白点。

或看浏览器标题attachments-2018-06-xE40LrGf5b1140f1c0f2d.说明有一个1x1像素

现在我们用浏览器访问一下GXCMS随便打开一个网页。打开开发者工具。然后在network 里搜索dig然后刷新一下网页。应该出现

一条dig记录上报到指定打点服务器的地址。

这样的话就没问题了。

关于打点服务器,我们只需要客户上报上来数据就行了。我不返回也可以。但是不返回也不可能。因为根据HTTP请求的三次握手原理,肯定打点服务器要返回一个response headers内容的,这个模块返回的数据。1像素,我们看了。才229B,是很小的。

attachments-2018-06-56Dfcdo85b11460f8a785.

这样就很好的解决了高并发的承载能力,如果上传的是JSON文件。那上传数据是非常大的。按K计算了。并发大了怕服务器就受不了了。

这个模块一般都是我们需要高并发。并且不需要返回什么东西。就用这个empty_gif模块

我们还用到了nginx的access.log日志服务,但是你要问了。我们不是用tongji.js来上报请求了吗。直接让GO来处理这个数据不就行了吗。

但是我们尽量解偶这个方法,把上报的数据让access.log来处理,我们只需要用GO把access.log处理的数据分析出来就可以了。

如果单独用GO来即记录日志又数据分析,那也是可以实现的。如果再做一个webserver的话,那复杂度就太高了。尽量本教程简单一些。不要搞的太复杂。大家都学的没兴趣就不好玩了。

那么我们就去打开access.log日志服务吧,进到D:\nginx-1.13.12\conf\目录,修改nginx.conf配置文件。

去nginx.conf里把access_log注释打开再nginx -s reload重载就可以了。

attachments-2018-06-wRI3WUs25b115132e3aa9.

一般只打开access_log会出错

attachments-2018-06-z1k2KZoV5b11484b8ee0f.

nginx不知道format main是什么格式的,这们还要在nginx.conf做一下设置。打开一个选项

attachments-2018-06-GuVASQma5b114887a3782.把上面几行打开。上面几行的意思是按指定格式生成日志,用户的IP地址,请求状态码,发送的包大小,refer地址,客户端类型等信息

我们先看一下log是否可以正常写入日志

tail -f D:\nginx-1.13.12\logs\dig.log

attachments-2018-06-ZAAP5OnW5b1151bcb1efb.发现上报的日志很正确的,确定是/dig上报的数据。 这样就很完美了。

现在我们就用nginx开好了一个高并发性负载的打点服务器。这个NGINX一定是能抗很高的并发量的。

如果想调优可以按下面调一下就能抗更高并发。

worker_processes  1; 这个是处理器开几核。如果是服务器CPU有几十核。可以开到最大。就能承载更高的并发。

gzip  on; 这个是页面压缩。如果页面很大的话。开启的话效果会好一些。如果数据很小,开不开影响不大。但是开gzip开启的话要浪费额外的CPU计算。

gzip内置的字典功能。如果重复数据越多。压缩效果越好。

要想让nginx达到最大的并发承载性能,就需要精细的对nginx进行调优,不过我们不建议这么做。最好是让nginx专一做同一件事,因为做打点服务器承载已经很大了。不要让它再额外的处理其它的事。

到这里我们在写GO之前做的事已经都跑通了。下一节课我们通过写一个GO程序来批量刷网站。让LOG日志产生足够的日志量。因为现在日志太少了。没办法很好的分析。

以后我们会用GO处理一个大的日志文件。