nginx performance monitor

nginx performance monitor

Nginx中的stub_status模块主要用于查看Nginx的一些状态信息

示例 

Active connections: 2
server accepts handled requests
12055 12055 34907
Reading: 0 Writing: 1 Waiting: 1

这些状态信息包括

1. Active connections:

对后端发起的活动连接数.

2. server accepts handled requests:

Nginx总共处理了12055个连接,成功创建12055握手(证明中间没有失败的),总共处理了34907个请求.

3. Reading:

Nginx读取到客户端的Header信息数.

4. Writing:

Nginx 返回给客户端的Header信息数.

5. Waiting:

开启keep-alive的情况下,这个值等于 active – (reading + writing),意思就是Nginx已经处理完成,正在等候下一次请求指令的驻留连接.所以,在访问效率高,请求很快被处理完毕的情况下,Waiting数比较多是正常的.如果reading +writing数较多,则说明并发访问量非常大,正在处理过程中.

开启Nginx的stub_status模块

在Server块中添加如下location规则,重新加载配置文件。

location /nginx-status {
    stub_status on;
        access_log  off;
    #加入访问限制
    allow 127.0.0.1;
    deny all;
}

通过/nginx-status便可以查看nginx的性能参数状态。
在linux中默认是不会将stub_status编译进来的，所以要开启此功能，需要编译时增加配置 ./configure –with-http_stub_status_module

但是这样这样简单的即时值无法直观的展示nginx负载、性能的变化趋势，如果能够有一个实时趋势图是最好了。
如下代码使用highchart linechart图来展示nginx负载、性能趋势。
javascript code

$(function() {
      $(document).ready(function() {
          Highcharts.setOptions({
              global: {
                  useUTC: false
              }
          });
 
          function initData() {
              var data = [],
                  time = (new Date()).getTime(),
                  i;
              for (i = -100; i <= 0; i++) {
                  data.push({
                      x: time + i * 1000,
                      y: 0
                  });
              }
              return data;
          }
          $('#container').highcharts({
              chart: {
                  type: 'spline',
                  animation: Highcharts.svg, // don't animate in old IE
                  marginRight: 10,
                  events: {
                      load: function() {
                          var series = this.series;
                          setInterval(function() {
                              $.get('/nginx-status', {}, function(data) {
                                  var status = data.split(' ');
                                  var x = (new Date()).getTime(); // current time
                                  var y0 = Number(status[2]);
                                  var y1 = Number(status[11]);
                                  var y2 = Number(status[13]);
                                  var y3 = Number(status[15]);
                                  series[0].addPoint([x, y0], true, true);
                                  series[1].addPoint([x, y1], true, true);
                                  series[2].addPoint([x, y2], true, true);
                                  series[3].addPoint([x, y3], true, true);
                              }, 'text');
                          }, 3000);
                      }
                  }
              },
              title: {
                  text: 'nginx stub-status'
              },
              xAxis: {
                  type: 'datetime',
                  tickPixelInterval: 150
              },
 
              tooltip: {
                  formatter: function() {
                      return '<b>' + this.series.name + '</b><br/>' +
                          Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', this.x) + '<br/>' +
                          Highcharts.numberFormat(this.y, 2);
                  }
              },
              legend: {
                  enabled: true
              },
              series: [{
                  name: 'Active connections',
                  data: (function() {
                      var data = [],
                          time = (new Date()).getTime(),
                          i;
                      for (i = -100; i <= 0; i++) {
                          data.push({
                              x: time + i * 1000,
                              y: 0
                          });
                      }
                      return data;
                  })()
              }, {
                  name: 'Reading',
                  data: initData()
              }, {
                  name: 'Writing',
                  data: initData()
              }, {
                  name: 'Waiting',
                  data: initData()
              }]
          });
      });
 
  });

html page

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta name="format-detection" content="telephone=no">
    <title> performance monitor</title>
    <script type="text/javascript" src="http://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
    <script type="text/javascript" src="http://cdn.hcharts.cn/highcharts/highcharts.js"></script>
    <script>
    /* highchart code */
    </script>
</head>
<body>
<div id="container" style="min-700px;height:400px"></div>
</body>
</html>

监控图像如下