前端跨域之nginx配置跨域问题

  • Z时代
  • 2024-01-10
  • 分类：综合

coding

一、前端跨域问题

　　前端跨域出现在前端得同源策略上，只有满足：协议、域名、端口相同得情况下才是同源，即可以调用对方资源，否则，浏览器端，F12的console会报错：Access_Control_Allow_Origin的问题；

前端地址:http://www.baidu.com

是否跨域

原因

http://www.baidu.com/home

否

域名、协议、端口都相同

https://www.baidu.com/home

是

协议不同

http://www.jd.com/

是

域名不同

https://www.jd.com

是

协议、域名都不同

二、跨域解决的方法

　  1、后端授权：CORS;

　　2、jsonp：利用html标签的中src等不受同源策略影响的漏洞

　　3、nginx代理配置；

三 、利用nginx配置，解决前端跨域问题

　　

//打开nginx的配置文件
vim  nginx.conf

//在指定的代理位置进行设置如下代码
location ^/home {
        add_headeer ‘Access_Control_Allow_Origin’  ’*.huawei.com‘  //控制的域名范围
        add_header 'Access_Control_Allow_Credentials''true'
        add_headeer ‘Access_Control_Allow_Method’  ’GET，POST，PUT，DELETE，HEAD，OPTIONS‘   //控制的请求方法
}

【注释：Access_Control_Allow_Origin      这些请求信息，首字符是否大写，要根据F12中的报错提示，前端报错是小写，在配置过程中，就用小写字母】

  配置完成之后，在浏览器的ResponseHeader中会有Access_Control_Allow_Origin头部信息

四、nginx 配置手动清除缓存

location ~ /purge(/.*) {
allow 127.0.0.1;
allow 192.168.50.0/24;
deny all;
proxy_cache_purge whsir_com $host$1$is_args$args;
}

接下来我们来清除缓存，只需要在清除缓存网页的URI地址前加上purge即可

http://192.168.50.101/purge/

以上是 前端跨域之nginx配置跨域问题 的全部内容， 来源链接： utcz.com/z/509992.html

回到顶部