反向代理域名名单
用map方法做的键值对映射,举例如下
map $uri $match {
~^/api/test/(.*) http://www.test.com;
}
location /api/ {
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Host $proxy_host;
proxy_pass $match/$1$is_args$args; //这里是填实际访问的地址(ip或者域名),我是用变量做了一个多域名的管理,可选择直接填地址
//添加跨域请求头
add_header 'Access-Control-Allow-Origin' $host;
add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range';
add_header 'Access-Control-Expose-Headers' 'Content-Length,Content-Range';
if ($request_method = 'OPTIONS') { //针对 option请求做了一个特殊的返回码
return 204;
}
}
对命令参数的一些解释
proxy_set_header是nginx配置指令,用于设置向后端代理服务器转发请求时的请求头。
具体含义是设置转发请求时需要包含的请求头信息。语法为proxy_set_header header value;
常见用法包括:
1. 传递客户端真实IP地址:proxy_set_header X-Real-IP $remote_addr;
这样设置后,代理服务器会将客户端真实的IP地址作为X-Real-IP的值传递给后端服务器。
2. 传递协议版本信息:proxy_set_header X-Forwarded-Proto $scheme;
这样设置后,代理服务器会将协议版本信息(http或https)作为X-Forwarded-Proto的值传递给后端服务器。
3. 传递客户端来源信息:proxy_set_header Referer $http_referer;
这样设置后,代理服务器会将客户端的来源信息作为Referer的值传递给后端服务器。
4. proxy_set_header Host $http_host ($http_host代理服务器本身IP)
通过proxy_set_header配置可以控制转发请求时所带的请求头信息,从而实现更灵活的代理转发功能。
基础的反向代理配置命令
location /test/ {
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Host $proxy_host;
proxy_pass https://www.test.com/;
add_header 'Access-Control-Allow-Origin' $host;
add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range';
add_header 'Access-Control-Expose-Headers' 'Content-Length,Content-Range';
if ($request_method = 'OPTIONS') {
return 204;
}
}
vue本地通过反向代理解决跨域
devServer: {
host: “0.0.0.0”,
port: 3000,
hot: true,
proxy: {
“/api”: {
target: http://www.test.com/,
changeOrigin: true, //是否支持跨域
pathRewrite: { “^/api”: “” },//重写路径
secure: false // 如果是https接口,需要配置这个参数,
}
}
},