update nginx monitoring help doc (#1533)

home/docs/help/nginx.md

@@ -9,11 +9,33 @@ keywords: [open source monitoring tool, open source java monitoring tool, monito
 
 **Protocol Use：Nginx**
 
-### Nginx App Enable `ngx_http_stub_status_module` And `ngx_http_reqstat_module` Configure
+### Need Enable `ngx_http_stub_status_module` And `ngx_http_reqstat_module` Module
 
 If you want to monitor information in 'Nginx' with this monitoring type, you need to modify your nginx configure file for enable the module monitor.
 
-**1、Add `ngx_http_stub_status_module` Configure:**
+### Enable `ngx_http_stub_status_module`
+
+1. Check if `ngx_http_stub_status_module` has been added
+
+```shell
+nginx -V
+```
+View whether it contains `--with-http_stub_status_module`, if not, you need to recompile and install Nginx.
+
+2. Compile and install Nginx, add `ngx_http_stub_status_module` module
+
+Download Nginx and unzip it, execute the following command in the directory
+
+```shell
+
+./configure --prefix=/usr/local/nginx --with-http_stub_status_module
+
+make && make install
+```
+
+3. Modify Nginx configure file
+
+Modify the `nginx.conf` file and add the monitoring module exposed endpoint, as follows:
 
 ```shell
 # modify nginx.conf
@@ -28,10 +50,16 @@ server {
         }
 }
 ```
+4. Reload Nginx
 
+```shell
+
+nginx -s reload
+```
 
+5. Access `http://localhost/nginx-status` in the browser to view the Nginx monitoring status information.
 
-**2、Add `ngx_http_reqstat_module` Configure:**
+### Enable `ngx_http_reqstat_module`
 
 ```shell
 # install `ngx_http_reqstat_module`
@@ -41,33 +69,48 @@ unzip ngx_req_status.zip
 
 patch -p1 < ../ngx_req_status-master/write_filter.patch
 
-./configure --prefix=/usr/local/nginx-1.4.2 --add-module=../ngx_req_status-master
+./configure --prefix=/usr/local/nginx --add-module=/path/to/ngx_req_status-master
 
 make -j2
 
 make install
 ```
 
+2. Modify Nginx configure file
+
+update `nginx.conf` file, add status module exposed endpoint, as follows:
+
 ```shell
 # modify nginx.conf
 http {
-        req_status_zone server_name $server_name 256k;
-        req_status_zone server_addr $server_addr 256k;
-        req_status_zone server_url  $server_name$uri 256k;
-        req_status server_name server_addr server_url;
-        server {
-            server_name xxx; // server_name
-            location /req-status {
-              req_status_show on;
-            }
+    req_status_zone server_name $server_name 256k;
+    req_status_zone server_addr $server_addr 256k;
+
+    req_status server_name server_addr;
+
+    server {
+        location /req-status {
+            req_status_show on;
+            #allow 127.0.0.1;	#only allow requests from localhost
+ 	        #deny all;		#deny all other hosts
         }
+    }
 }
 ```
 
-**⚠️`ngx_http_reqstat_module` need to download it ourselves, If we don't need to monitor this module, we can only collect information about the `ngx_http_stub_status_module` module**
+3. Reload Nginx
+
+```shell
+
+nginx -s reload
+```
+
+4. Access `http://localhost/req-status` in the browser to view the Nginx monitoring status information.
+
 
-**There is help_doc: https://blog.csdn.net/weixin_55985097/article/details/116722309**
+**Refer Doc: https://github.com/zls0424/ngx_req_status**
 
+**⚠️Attention: The endpoint path of the monitoring module is `/nginx-status` `/req-status`**
 
 ### Configuration parameter
 

home/i18n/zh-cn/docusaurus-plugin-content-docs/current/help/nginx.md

@@ -9,11 +9,32 @@ keywords: [开源监控工具, 开源Java监控工具, 监控Nginx指标]
 
 **使用的协议：Nginx**
 
-### 启用 Nginx 的 `ngx_http_stub_status_module` 和 `ngx_http_reqstat_module` 配置
+### 需要启用 Nginx 的 `ngx_http_stub_status_module` 和 `ngx_http_reqstat_module` 监控模块
 
 如果你想使用这种监控方式监控 'Nginx' 的信息，你需要修改你的 Nginx 配置文件以启用监控模块。
 
-**1、添加 ngx_http_stub_status_module 配置：**
+### 启用 ngx_http_stub_status_module    
+
+1. 检查是否已添加 `ngx_http_stub_status_module`
+
+```shell
+nginx -V
+```
+查看是否包含 `--with-http_stub_status_module`，如果没有则需要重新编译安装 Nginx。
+
+2. 编译安装 Nginx, 添加 `ngx_http_stub_status_module` 模块
+
+下载 Nginx 并解压，在目录下执行 
+
+```shell
+./configure --prefix=/usr/local/nginx --with-http_stub_status_module
+
+make && make install
+```
+
+3. 修改 Nginx 配置文件
+
+修改 `nginx.conf` 文件，添加监控模块暴露端点，如下配置：
 
 ```shell
 # modify nginx.conf
@@ -29,9 +50,17 @@ server {
 }
 ```
 
+4. 重新加载 Nginx
 
+```shell
+nginx -s reload
+```
+
+5. 在浏览器访问 `http://localhost/nginx-status` 即可查看 Nginx 监控状态信息。
+
+### 启用 `ngx_http_reqstat_module` 
 
-**2、添加 ngx_http_reqstat_module 配置：**
+1. 安装 `ngx_http_reqstat_module` 模块
 
 ```shell
 # install `ngx_http_reqstat_module`
@@ -41,33 +70,47 @@ unzip ngx_req_status.zip
 
 patch -p1 < ../ngx_req_status-master/write_filter.patch
 
-./configure --prefix=/usr/local/nginx-1.4.2 --add-module=../ngx_req_status-master
+./configure --prefix=/usr/local/nginx --add-module=/path/to/ngx_req_status-master
 
 make -j2
 
 make install
 ```
 
+2. 修改 Nginx 配置文件
+
+修改 `nginx.conf` 文件，添加状态模块暴露端点，如下配置：
+
 ```shell
 # modify nginx.conf
 http {
-        req_status_zone server_name $server_name 256k;
-        req_status_zone server_addr $server_addr 256k;
-        req_status_zone server_url  $server_name$uri 256k;
-        req_status server_name server_addr server_url;
-        server {
-            server_name xxx; // server_name
-            location /req-status {
-              req_status_show on;
-            }
+    req_status_zone server_name $server_name 256k;
+    req_status_zone server_addr $server_addr 256k;
+
+    req_status server_name server_addr;
+
+    server {
+        location /req-status {
+            req_status_show on;
+            #allow 127.0.0.1;	#only allow requests from localhost
+ 	        #deny all;		#deny all other hosts
         }
+    }
 }
 ```
 
-**⚠️`ngx_http_reqstat_module` 需要自行下载安装，如果不需要监控该模块，只需收集 `ngx_http_stub_status_module` 模块的信息即可**
+3. 重新加载 Nginx
+
+```shell
+nginx -s reload
+```
+
+4. 在浏览器访问 `http://localhost/req-status` 即可查看 Nginx 监控状态信息。
+
 
-**这里有帮助文档： https://blog.csdn.net/weixin_55985097/article/details/116722309**
+**参考文档： https://blog.csdn.net/weixin_55985097/article/details/116722309**
 
+**⚠️注意监控模块的端点路径为 `/nginx-status` `/req-status`**
 
 ### 配置参数
 

web-app/src/app/routes/status-public/status-public.component.ts

@@ -138,7 +138,7 @@ export class StatusPublicComponent implements OnInit {
     } else if (hours > 0) {
       processTime += `${hours} hour${hours > 1 ? 's' : ''} `;
     } else if (minutes > 0) {
-      processTime += `${minutes} minute${minutes > 1 ? 's' : ''} ago`;
+      processTime += `${minutes} minute${minutes > 1 ? 's' : ''} `;
     } else {
       return 'few seconds';
     }