淘宝开发：Nginx模块Nginx-Http-Footer-Filter

最新推荐文章于 2022-10-05 15:38:20 发布
最新推荐文章于 2022-10-05 15:38:20 发布
阅读量1.8k 收藏
点赞数
分类专栏： linux 文章标签： Linux nginx

Nginx-Http-Footer-Filter想必大家都觉得很陌生,那我们就来认识一下它吧,这是淘宝开发的Nginx模块. 它用于nginx在响应请求文件底部追加内容. 今天抽空研究下这个插件，希望对大家有所帮助。为什么发现了这个插件，因为这几天公司需要在所有shtml文件后面追加一个js代码用来做统计（之前统计 代码没加齐全），在寻求解决方法的过程中找到了它认识了它最后喜欢上了它，你可能以为我用这个插件去实现了我要的功能，其实在认识他之前我用shell脚 本替换齐全了. 不过我还是决定研究测试一下Nginx-Http-Footer-Filter，或许以后的需求上能有帮助,更或许能帮上其他需要帮助的人.进入正题吧.

1. Nginx-Http-Footer-Filter到底是做什么的？

说白了，就是在请求的页面底部插入你要插入的代码。

2. 我们能用Nginx-Http-Footer-Filter来做什么？

1、统一追加js代码用于统计(我是这么想的)

2、底部追加响应这个请求的realsver（后端真实服务器）信息,便于系统管理员排查故障.

3、你管理着数量庞大的虚拟主机，在所有web后面追加你的广告代码，黑链什么的（很无耻）

4、举一反三吧,自己想想能用来做什么吧. 淘宝用它来做什么？ 打开淘宝首页，查看他源代码，拖到最下面,内容如下：

 
 
  1. <!--city: fuzhou-->  
  2. <!--province: unknown-->  
  3. <!--hostname: -->  
  4. <!--hostname: home1.cn199--> 

我们可以很清晰的看到，这边有省和地区还有主机名,也就是淘宝真实服务器的主机名,处理我这个请求的主机名为home1.cn199, city取到了fuzhou,provinece省份没取到，估计是它Geo的问题
或者随便打开一个商品页面, 查看源代码,如下：

 
 
  1. </html> 
  2. <script type="text/javascript">TShop.initFoot({});</script> 

可以看到他这边给这页面追加了一个js代码,淘宝开发这个模块的用意想必大家都明白了，集思广益，或许大家还有更好的用处.

3. 怎么安装Nginx-Http-Footer-Filter

3.1 下载地址：

https://github.com/alibaba/Nginx-Http-Footer-Filter/tree/1.2.2

3.2 安装Nginx-Footer模块

之前已经安装过Nginx，所以我选择覆盖Nginx文件。

 
 
  1. # cd /usr/local/src/  
  2. # wget https://codeload.github.com/alibaba/Nginx-Http-Footer-Filter/zip/1.2.2  
  3. # unzip 1.2.2 
  4.  
  5. # http://nginx.org/download/nginx-1.4.1.tar.gz  
  6. # tar -xzvf nginx-1.4.1.tar.gz  
  7. # cd nginx-1.4.1 
  8. # ./configure --prefix=/usr/local/nginx-1.4.1 \  
  9. --with-http_stub_status_module --with-http_realip_module \  
  10. --add-module=../Nginx-Http-Footer-Filter-1.2.2 
  11. # make  
  12. # mv /usr/local/nginx-1.4.1/sbin/nginx /usr/local/nginx-1.4.1/sbin/old_nginx  
  13. # mv objs/nginx /usr/local/nginx-1.4.1/sbin/  
  14. # /usr/local/nginx-1.4.1/sbin/nginx -s stop  
  15. # /usr/local/nginx-1.4.1/sbin/nginx 

3.3 验证模块是否安装成功

 
 
  1. # /usr/local/nginx-1.4.1/sbin/nginx -V  
  2. nginx version: nginx/1.4.1 
  3. built by gcc 4.4.7 20120313 (Red Hat 4.4.7-3) (GCC)  
  4. TLS SNI support enabled  
  5. configure arguments: --prefix=/usr/local/nginx-1.4.1   
  6. --with-http_stub_status_module   
  7. --with-http_realip_module    
  8. --add-module=../Nginx-Http-Footer-Filter-1.2.2 

4. 怎么使用Nginx-Http-Footer-Filter模块

4.1 配置location

在location中使用footer "你的内容" 即可.看如下配置

 
 
  1. server {  
  2. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; listen&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 173.255.219.122:80;  
  3. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; server_name&nbsp; test.ttlsa.com;  
  4. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; access_log&nbsp; /data/logs/nginx/test.ttlsa.com.access.log&nbsp; main;  
  5.  
  6. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; index index.html index.php index.html;  
  7. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; root /data/site/test.ttlsa.com;  
  8.         location / {  
  9.            footer "<!-- $date_gmt -->";  
  10.            index index.html;  
  11.         }  
  12.  
  13.         location =/html/2252.css {  
  14.            footer_types text/css;  
  15.            footer "/* host: $server_name - $date_local */";  
  16. } 

4.2 测试Nginx-Footer效果

 
 
  1. # cat 2252.shtml  
  2. <html>  
  3.     <head>  
  4.     <title>test</title>  
  5.     </head>  
  6.     <body>  
  7.         this is webpage  
  8.     </body>  
  9. </html> 

访问站点test.ttlsa.com/html/2252.shtml

nginx追加底部代码

nginx追加底部代码

如图，我们可以看到文件最底部加上了<!-- 1376063369 -->,怎么变成了时间撮了,因为我这边是ssi的语法，如果你不知道什么是ssi，那么请参考文章什么是ssi.

他仅仅是在文件的最后一行追加,而不是<body>里面.这点大家要注意了.

4.3 再来测试一下css文件

 
 
  1. # cat 2242.css  
  2. # this is css file 

如下是访问结果：

 
 
  1. # this is css file  
  2. /* host: test.ttlsa.com - 1376064324 */  

看图：

nginx footer追加底部代码css

nginx footer追加底部代码css


5. 我能写多个footer指令吗？

不行，以下我写了两个footer

 
 
  1. location / {  
  2.     footer "12312321321";  
  3.     footer "<!-- $date_gmt -->";  
  4.     index index.html;  
  5. } 

如下测试，提示footer指令重复了

 
 
  1. # /usr/local/nginx-1.4.1/sbin/nginx -t  
  2. nginx: [emerg] "footer" directive is duplicate in /usr/local/nginx-1.4.1/conf/vhost/test.ttlsa.com.conf:13 
  3. nginx: configuration file /usr/local/nginx-1.4.1/conf/nginx.conf test failed 

6. 只能用ssi变量吗？

当然不是,随便你写，可以是ssi指令，也可以是nginx变量，也可以是任何无意义的字符串

如下：

 
 
  1. footer "12312321321";  
  2. footer "<!--12312321321-->";  
  3. footer "<!--$remote_addr-->";  

比如我想知道这个页面是哪台web服务器处理的,那么我在底部插入主机名即可.这样，有500错误，我便可以马上定位到具体的服务器了

 
 
  1. footer "<!--$hostname-->"; 

返回结果如下：

nginx footer 追加底部代码nginx变量hostname

nginx footer 追加底部代码nginx变量hostname

7. 服务器返回500,404,403等错误, 是否还会追加内容到底部

会,如果不追加,就无法通过返回的页面得知哪台web出现故障,这明显就不符合作者的初衷了,有些同学可能觉得我在后端设置一个header不就可以了，为什么还要去装一个插件，麻烦不麻烦？不信你试试404,500这些错误头部能不能看到。况且你面对的用户都是小白们，难道让他提交错误的时候，问他你看下你的http头部的某值是多少，别人傻眼了。现在你只要说，哥们，网页保存下来传给我。

配置如下：

 
 
  1. location / {  
  2.     return 500;  
  3.     footer "<!--$hostname-->";  
  4. } 

结果如下：

nginx footer追加底部代码500错误

nginx footer追加底部代码500错误

8. 模块指令说明：

footer模块非常简单，就只有两个指令，具体说明如下

footer字符串

默认值: ``

配置段: http, server, location

这个定义了将什么内容追加到文件内容的底部 footer_types MIME类型

默认值: footer_types: text/html

配置段: http, server, location

定义被追加底部文件的MIME返回类型,默认值是text/html

原文链接：http://www.ttlsa.com/html/2252.html


Chili_min
关注
专栏目录
tengine配置ngx_http_footer_filter_module模块自动添加页脚信息 标识服务器信息
水奈濑结花的博客哦！
04-14 214
使用ngx_http_footer_filter_module包含的语法 注意确认是否已经加载此模块 ①修改配置文件并重载服务 shell > vim /usr/local/tengine/conf/nginx.conf 语法规则： #可定义在http、server、location中，建议在server中 #定义需要插入footer的响应类型（Response Content-Type）。 footer_types "text/plain" "text/css" "application/x
Nginx --高阶
neei的博客
07-16 5138
学习笔记
详解Nginx服务器的nginx-http-footer-filter模块配置
09-30
主要介绍了Nginx服务器的nginx-http-footer-filter模块配置,nginx-http-footer-filter用作在请求的页面底部插入代码,需要的朋友可以参考下
nginx模块nginx-http-footer-filter研究使用
程序员写的技术 FAQ 和杂文
09-03 1358
nginx-http-footer-filter想必大家都觉得很陌生,那我们就来认识一下它吧,这是淘宝开发的nginx模块. 它用于nginx在响应请求文件底部追加内容. 今天抽空研究下这个插件，希望对大家有所帮助。为什么发现了这个插件，因为这几天公司需要在所有shtml文件后面追加一个js代码用来做统计（之前统计代码没加齐全），在寻求解决方法的过程中找到了它认识了它最后喜欢上了它，你可能以为我用
Nginx源码分析-ngx_htttp_footer_filter_module
yzq的专栏
09-24 1142
目录 1、模块介绍 2、配置项和上下文 3、定义http_footer_filter模块 4、初始化ngx_http_footer_filter_module过滤模块 5、处理请求中的HTTP头部 6、处理请求中的HTTP包体   1、模块介绍 模块功能：This module implements a body filter that adds a given string t
Nginx服务器配置：nginx-http-footer-filter模块深度解析
"这篇文章主要介绍了Nginx服务器的nginx-http-footer-filter模块，这是一个由淘宝开发的模块，主要用于在HTTP响应的底部添加自定义内容，如统计代码或服务器信息。通过这个模块，我们可以实现多种功能，比如统一添加...
Nginx-Http-Footer-Filter模块详解：在页面底部插入内容
"Nginx-Http-Footer-Filter是一个由淘宝开发的Nginx模块，它的主要功能是在HTTP响应的页面底部添加自定义内容，如JavaScript代码、服务器信息或广告等。这个模块对于网站运维人员来说，可以用来实现统一的统计追踪、...
nginx模块nginx-http-footer-filter(淘宝开发)
weixin_34295316的博客
08-26 121
为什么80%的码农都做不了架构师？>>> ...
六.Tengine的footer模块(ngx_http_footer_filter_module),主机信息调试
u010889990的专栏
10-24 1449
六.Tengine的footer模块(ngx_http_footer_filter_module),主机信息调试 1.描述   显示对运维人员更友好的出错信息，便于定位出错机器。 2.配置     $ vi /usr/local/tengine/conf/nginx.conf     location / {         footer "";         in
ngx_http_footer_filter_module导致的问题
weixin_34252090的博客
10-15 175
问题背景：今天对公司的一款产品的前端nginx接入层新加了一个淘宝开发的nginx模块ngx_http_footer_filter_module，加这个模块主要是给运维人员显示更友好的出错信息，便于定位出错机器，指令如下：footer "<!-- $hostname, $year/$month/$day $hour:$minute:$second, $request -...
Nginx的目录文件列表功能,和自定义header和footer
climbs的专栏
11-30 2107
ngx_http_autoindex_module  此模块用于自动生成目录列表，ngx_http_autoindex_module只在 ngx_http_index_module模块未找到索引文件时发出请求. nginx默认是不允许列出整个目录的。 开启目录列表： 打开nginx.conf文件，在location server 或 http段中加入  autoindex on;
nginx 服务器的响应头,详解Nginx服务器中HTTP Headers相关的模块配置使用
weixin_30139729的博客
07-30 3849
ngx_http_headers_module模块一. 前言ngx_http_headers_module模块提供了两个重要的指令add_header和expires，来添加 “Expires” 和 “Cache-Control” 头字段，对响应头添加任何域字段。add_header可以用来标示请求访问到哪台服务器上，这个也可以通过nginx模块nginx-http-footer-filter研究...
Nginx内置模块简介
寄蜉蝣於天地，渺滄海之一粟。
10-05 1万+
这里建议大家一定要多看官方文档！！！官方文档里的内容才是最全的：包括说明、指令、作用域等等。官方文档 http://nginx.org/en/docs中文文档 http://tengine.taobao.org/nginx_docs/cn/docs/
淘宝版本nginx使用纯干货
apple_56973763的博客
06-10 681
1.配置系统开发环境 yum install gcc patch libffi-devel python-devel zlib-devel bzip2-devel openssl-devel ncurses-devel sqlite-devel readline-devel tk-devel gdbm-devel db4-devel libpcap-devel xz-devel openssl openssl-devel -y 2.进入淘宝nginx官网，下载源代码进行编译安装 # 官网 http://
nginx文件服务器美化autoindex显示
witton的专栏
05-15 5458
网络上很多使用nginx来作为文件服务器的，前段时间公司也有这个需求，就研究了一下使用nginx来做文件服务器，参见前面两篇文章： 容器中使用ngnix搭建支持上传下载的文件服务器 使用nginx容器并搭建sftp服务 但是nginx原生的autoindex显示界面很一般，网上也有使用Nginx-Fancyindex插件来的，但是需要自己编译nginx，比较麻烦，笔者使用的容器版本的nginx，所以放弃了它，而选择了add_after_body的方式。 感谢 phuslu 写了一个 autoindex.ht
一键在线生成Nginx 配置
qiangw09的博客
06-04 422
本文转载来自http://code520.net/archives/949 Nginx作为一个轻量级的HTTP服务器，相比Apache优势也是比较明显的,在性能上它占用资源少,能支持更高更多的并发连接,从而达到提高访问效率;在功能上它是一款非常优秀的代理服务器与负载均衡服务器;在安装配置上它安装，配置都比较简单。 但在实际的生产配置环境中，肯定会经常遇到需要修改、或者重新增加Nginx配...
让网页中footer总在底部的有效办法
github_38589282的博客
07-09 505
DOM结构：html 　body 　　#wrap 　　　#header 　　　#main 　　#footer-spacer 　　#footer其中，主要内容放在#wrap中。#footer-spacer是为了占位的透明元素。设置css：html,body{ min-height: 100vh; overflow: auto; padding: 0; margin: 0; bird
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值