nginx反向代理的妙用

不止可以反向代理,还能自定义修改内容

Nginx是一个高性能的HTTP服务器,它可以实现反向代理的功能,即将客户端的请求转发到后端的服务器,并将后端服务器的响应返回给客户端。这样可以实现负载均衡、安全防护、缓存加速等目的。但是,有时候我们不仅仅想要转发请求和响应,还想要对目标网站的内容进行一些自定义的修改,比如替换某些字符串、添加或删除某些标签、修改某些链接等。这种情况下,我们就需要使用Nginx的内容替换模块,即ngx_http_sub_module模块。

ngx_http_sub_module模块是一个过滤器,它可以修改网站响应内容中的字符串。这个模块已经内置在Nginx中,但是默认未安装,需要安装需要加上配置参数:–with-http_sub_module。如果已经安装Nginx,只需要再添加这个模块就可以了。安装完成后,我们就可以在Nginx的配置文件中使用sub_filter指令来设置需要替换的字符串和新的字符串。例如:

1
2
3
4
5
6
7
8
9
10
server {
listen 80;
server_name www.example.com;
location / {
proxy_pass http://127.0.0.1:8080;
proxy_redirect off;
sub_filter '原内容' '替换成的内容';
sub_filter_once on;
}
}

这样,当我们访问 www.example.com 时,Nginx会将请求转发到127.0.0.1:8080,并将响应内容中的’原内容’替换成’替换成的内容’,然后返回给客户端。注意,sub_filter_once指令表示只替换第一次匹配到的字符串,如果想要替换所有匹配到的字符串,可以设置为off。

三个实例

使用Nginx进行反向代理后自定义修改目标网站内容的用处有很多,例如:

  • 可以实现网页内容定制化,根据不同的客户端或用户需求,显示不同的内容或样式。
  • 可以实现网页内容优化,比如去除一些无用的标签或注释,减少网页大小和加载时间。
  • 可以实现网页内容安全化,比如过滤掉一些恶意的脚本或链接,防止网页被篡改或劫持(ps:替换原网站内容在某种情况下已经可以算是篡改了吧)。
  • 可以实现网页内容扩展化,比如添加一些额外的内容。

下面是三段示例代码,由简到难使用了Nginx反向代理后自定义内容的功能。
1.第一段代码是给原有的网页注入了一段本地js;
2.第二段反向代理某网站后,会在原网站的登录页注入一个js脚本,实现了对element输入框的自动登录效果;
3.第三段代码是局域网服务器无法访问高德api时,在有公网权限的服务器上使用Nginx反向代理高德api后,将原有js中的地址替换成本地代理的地址;点击跳转至原作者网站

1
2
3
4
5
6
7
8
9
10
server {
listen 80;
server_name www.example.com;
location / {
proxy_pass http://127.0.0.1:8080;
proxy_redirect off;
sub_filter '<script src="/js/app.skd78945.js"></script>' '<script src="/js/app.skd78945.js"></script><script>alert("本地js执行成功")</script>';
sub_filter_once on;
}
}
1
2
3
4
5
6
7
8
9
10
server {
listen 80;
server_name www.example.com;
location / {
proxy_pass http://127.0.0.1:8080;
proxy_redirect off;
sub_filter '</body>' '<script>let name=document.getElementsByTagName('input')[0];name.value="woshiyonghuming";const event1 = document.createEvent("HTMLEvents");event1.initEvent("input", false, true);name.dispatchEvent(event1);let pass=document.getElementsByTagName("input")[2];pass.value=woshimima';const event2 = document.createEvent("HTMLEvents");event2.initEvent("input", false, true);pass.dispatchEvent(event2);document.getElementsByTagName("button")[0].click()</script></body>';
sub_filter_once on;
}
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
server {
listen 80;
server_name localhost;
#add_header Access-Control-Allow-Origin *;
add_header Access-Control-Allow-Headers X-Requested-With;
add_header Access-Control-Allow-Methods GET,POST,OPTIONS;
location / {
root html;
index index.html index.htm;
}
location /restapi/ {
proxy_pass https://restapi.amap.com/;
}
location /webapi/ {
proxy_pass https://webapi.amap.com/;
}
location /vdata/ {
proxy_pass https://vdata.amap.com/;
}
location /wprd01/ {
proxy_pass https://wprd01.is.autonavi.com/;
}
location /wprd02/ {
proxy_pass https://wprd02.is.autonavi.com/;
}
location /wprd03/ {
proxy_pass https://wprd03.is.autonavi.com/;
}
location /wprd04/ {
proxy_pass https://wprd04.is.autonavi.com/;
}
location /webrd01/ {
proxy_pass https://webrd01.is.autonavi.com/;
}
location /webrd02/ {
proxy_pass https://webrd02.is.autonavi.com/;
}
location /webrd03/ {
proxy_pass https://webrd03.is.autonavi.com/;
}
location /webrd04/ {
proxy_pass https://webrd04.is.autonavi.com/;
}
location /style_icon/ {
proxy_pass http://vdata.amap.com/style_icon/;
}
#代理获取js api文件并修改文件内容
location /maps {
proxy_set_header Accept-Encoding "";
proxy_pass https://webapi.amap.com/maps;
sub_filter_types *;#重要·对所有请求响应类型都进行替换
sub_filter_once off;
sub_filter 'http://webapi.amap.com' 'http://代理服务器ip/webapi';
sub_filter 'https://webapi.amap.com' 'http://代理服务器ip/webapi';
sub_filter 'http://restapi.amap.com' 'http://代理服务器ip/restapi';
sub_filter 'http://vdata.amap.com' 'http://代理服务器ip/vdata';
sub_filter 'vdata.amap.com' '代理服务器ip/vdata';
sub_filter 'webapi.amap.com/count' '代理服务器ip/webapi/count';
sub_filter 'wprd0{1,2,3,4}.is.autonavi.com' '代理服务器ip/wprd0{1,2,3,4}';
sub_filter 'webapi.amap.com/theme' '代理服务器ip/webapi/theme';
sub_filter 'restapi.amap.com/v4' '代理服务器ip/restapi/v4';
sub_filter 'webapi.amap.com/style' '代理服务器ip/webapi/style';
}
}

nginx反向代理的妙用
https://xiyu.pro/2023/04/12/25/
作者
Xi Yu
发布于
2023年4月12日
许可协议