当前位置: 澳门新濠3559 > 操作系统 > 正文

使用nginx反向代理处理前后端跨域访问的问题,使

时间:2019-12-26 00:20来源:操作系统
3.跨域访谈实例 使用nginx反向代理管理前后端跨域访谈,nginx 正文主要化解:使用nginx反向代理管理前后端跨域访谈的难题 1.何为跨域访谈? 主题材料如下: Failed to load http://192.168.1.1

3.跨域访谈实例

使用nginx反向代理管理前后端跨域访谈,nginx

正文主要化解:使用nginx反向代理管理前后端跨域访谈的难题

1.何为跨域访谈?

主题材料如下:

Failed to load http://192.168.1.137:8081/service/getStation?Line=1: No 'Access-Control-Allow-Origin'header is present on the requested resource. Origin 'http://192.168.1.136:8081' is therefore not allowed access.

2.跨域的宽泛解决情势(摘录)

https://www.cnblogs.com/gabrielchen/p/5066120.html

当前来说未有不依靠劳动器带来跨域诉求资源的技术

1.jsonp 内需指标服务器同盟三个callback函数。
2.window.name+iframe 亟需指标服务器响应window.name。
3.window.location.hash+iframe 相仿要求指标服务器作管理。
4.html5的 postMessage+ifrme 那些也是索要指标服务器或然说是指标页面写贰个postMessage,主要注重于前面八个通信。
5.CO凯雷德S 索要服务器设置header :Access-Control-Allow-Origin。
6.nginx反向代理,能够找技能人员帮助管理

进展2.跨域的科学普及化解措施(摘录)

https://www.cnblogs.com/gabrielchen/p/5066120.html

方今来说未有不相信任劳动器带给跨域诉求财富的才干

1.jsonp 亟需目的服务器合作二个callback函数。
2.window.name+iframe 内需指标服务器响应window.name。
3.window.location.hash+iframe 相符须求目标服务器作管理。
4.html5的 postMessage+ifrme 这些也是亟需指标服务器大概说是指标页面写一个postMessage,主要重申于前面三个通信。
5.CO福睿斯S 亟待服务器设置header :Access-Control-Allow-Origin。
6.nginx反向代理,能够找技巧人士扶助管理

告竣,呵呵呵呵

本文首要消除:使用nginx反向代理管理前后端跨域访问的标题 难点如下: Failed to load ...

以下类别为本域访谈:

1)同意气风发域名不一样的子路线

www.zuiyoujie.com/a.html和www.zuiyoujie.com/b.html

难题浅析:

取缔跨域难点莫过于是浏览器的蓬蓬勃勃种安全行为

该难题是出于前端和后台服务器在不一致服务器(IP卡塔尔(قطر‎上,前端访谈后台不可能透过平等条链路传输数据导致的,这个时候倘使直接ajax远程后台服务器,则会报错

消逝方法:

布局nginx,将前端的拜谒需要和后端的响应都通过nginx反向代理进行拍卖

贴近上边这几个:

192.168.1.136:8081  是前端,
192.168.1.137:8081  是后台,tomcat
192.168.1.11           是nginx服务器

编写nginx配置文件,配置以下内容

vim from_front_to_background.conf

# For Front end
server {
    listen 8136;
    server_name 192.168.1.11;
    charset utf-8;
    location / {
        proxy_pass http://192.168.1.136:8081;
    }
}
# For background
server {
    listen 8137;
    server_name 192.168.1.11;
    charset utf-8;
    location / {
        proxy_pass http://192.168.1.137:8081;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For    $proxy_add_x_forwarded_for;
    }
}

以下参数可加可不加,看是还是不是能用到

proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;

布署完毕,重新加载nginx配置文件,前端访问192.168.1.11:8136拓宽后续调节和测量试验就可以

service nginx reload

其他能够增进的参数:
据他们说报错内容里找到的,小编要好弄的话没用到也得以消除该难题,
借使不平时可以将以下参数增加到location标签里

add_header 'Access-Control-Allow-Origin' 'http://www.zuiyoujie.com'; 
add_header 'Access-Control-Allow-Credentials' 'true'; 
add_header 'Access-Control-Allow-Methods' 'GET';

先是条:授权从www.zuiyoujie.com的伸手,假设要相应来自任何域的诉求能够将域名改成“*”,

也是有说该方法适用于外人访问大家的情况

其次条:当该标识为真时,响应于该央求是还是不是足以被爆出
其四日:内定要求的主意,能够是GET,POST等

ajax跨域诉求测试
中标时,响应头是之类所示:

HTTP/1.1 200 OK 
Server: nginx 
Access-Control-Allow-Origin: www.zuiyoujie.com

 

张开1:何为跨域访谈?
以下项目为跨域访谈:
1.差异地名间访谈

www.zuiyoujie.com和www.baidu.com

2.同域名分裂端口

www.zuiyoujie.com和www.zuiyoujie.com:8080

3.同于名不一致左券,

http和https

4.域名和该域名友好的IP,

www.zuiyoujie.com和自己解析的IP:192.168.1.1

5.二级域名肖似,三级级域名分化,

aaa.zuiyoujie.com和ttt.zuiyoujie.com
www.zuiyoujie.com和zuiyoujie.com等

以下种类为本域访谈:

1.同生机勃勃域名分化的子路径,

www.zuiyoujie.com/a.html和www.zuiyoujie.com/b.html

以下项目为跨域访谈

1)差别域名间访谈

www.zuiyoujie.com和www.baidu.com

2)同域名分化端口

www.zuiyoujie.com和www.zuiyoujie.com:8080

澳门新濠3559,3)同于名分裂合同

http和https

4)域名和该域名友好的IP

www.zuiyoujie.com和自己解析的IP:192.168.1.1

5)二级域名相像,三级级域名不一致

aaa.zuiyoujie.com和ttt.zuiyoujie.com
www.zuiyoujie.com和zuiyoujie.com等

本文首要清除:使用nginx反向代理管理前后端跨域访谈的主题材料

荒诞解析:

禁绝跨域难题实际上是浏览器的意气风发种安全作为

该难题是出于前端和后台服务器在差异服务器(IP卡塔尔(قطر‎上,前端访问后台不能透过类似条链路传输数据招致的,当时假如直接ajax远程后台服务器,则会报错

报错如下:

Failed to load http://192.168.1.137:8081/service/getStation?Line=1: No 'Access-Control-Allow-Origin'header is present on the requested resource. 
Origin 'http://192.168.1.136:8081' is therefore not allowed access.

缓和方式:

布局nginx,将前端的探望央求和后端的响应都由此nginx反向代理举行管理

看似下面那些:

192.168.1.136:8081  是前端,
192.168.1.137:8081  是后台,tomcat
192.168.1.11            是nginx服务器

编制nginx配置文件,配置以下内容

vim from_front_to_background.conf

# For Front end
server {
    listen 8136;
    server_name 192.168.1.11;
    charset utf-8;
    location / {
        proxy_pass http://192.168.1.136:8081;
    }
}
# For background
server {
    listen 8137;
    server_name 192.168.1.11;
    charset utf-8;
    location / {
        proxy_pass http://192.168.1.137:8081;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For    $proxy_add_x_forwarded_for;
    }
}

以下参数可加可不加,看是还是不是能用到

proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;

布局达成,重新加载nginx配置文件,前端访谈192.168.1.11:8136进展三番五次调节和测量检验就可以

service nginx reload

其它能够增进的参数:
依据报错内容里找到的,笔者自个儿弄的话没用到也得以解决该难题,
假设一时得以将以下参数加多到location标签里

add_header 'Access-Control-Allow-Origin' 'http://www.zuiyoujie.com'; 
add_header 'Access-Control-Allow-Credentials' 'true'; 
add_header 'Access-Control-Allow-Methods' 'GET';

率先条:授权从www.zuiyoujie.com的伏乞,如若要相应来自任何域的哀求能够将域名改成“*”,

也是有说该措施适用于旁人访谈大家的处境

其次条:当该标识为真时,响应于该须求是还是不是能够被人暴光光
其15日:钦赐诉求的章程,能够是GET,POST等

ajax跨域伏乞测验,成功时,响应头是之类所示:

HTTP/1.1 200 OK 
Server: nginx 
Access-Control-Allow-Origin: www.zuiyoujie.com

利落,呵呵呵呵

编辑:操作系统 本文来源:使用nginx反向代理处理前后端跨域访问的问题,使

关键词:

  • 上一篇:没有了
  • 下一篇:没有了