已拦截跨源请求:同源策略禁止读取位于 http://192.168.88.111:8080/aa/xx的远程资源。(原因:CORS 头缺少 ‘Access-Control-Allow-Origin‘)

项目场景:

页面需要一个js请求第三方接口

问题描述:

代码如下:

function getBoJunBrand() {
	$.ajax({
		method: 'GET',
		url: 'http://192.168.88.111:8080/aa/xx',
		data: {			
		},
		success:function(data){
            console.log(data);
			alert("【Success】"+data);
			return data;
        },
        error:function(XMLHttpRequest, textStatus, errorThrown) {
            alert("Error");
        }
	});
}

使用postman能够正常获得对应接口的数据,表示接口逻辑是没问题的,但是用js调用的时候,就出现错误了


原因分析:

在开发者模式下面,根据已经出现的错误:
已拦截跨源请求:同源策略禁止读取位于 http://192.168.88.111:8080/aa/xx的远程资源。(原因:CORS 头缺少 ‘Access-Control-Allow-Origin’)
得知,这是浏览器的安全策略导致。


解决方案:

参考了多方意见,得知以下几个解决方案:

首先讲我使用的方案:
因为接口也是我自己写的,所以我直接找到/aa/xx方法
从原先代码:
@RequestMapping(value = "/xx")
    @ResponseBody
    public Object xx() throws SQLException {         

        OracleJdbcTest test = new OracleJdbcTest();

        List<HashMap<String, String>> returnStringList = test.query("select  ID,attribcode,ATTRIBNAME from M_DIM  where dimflag='DIM1' ", true);        

        test.close();
        return returnStringList;
    }
改成代码:

	@RequestMapping(value = "/xx")
    @ResponseBody
    public Object xx() throws SQLException {
        
        ServletRequestAttributes attributes = (ServletRequestAttributes) RequestContextHolder.getRequestAttributes();
        HttpServletRequest request = attributes.getRequest();
        HttpServletResponse response = attributes.getResponse();
        //值为*或指定的域名。
        response.addHeader( "Access-Control-Allow-Origin", "*" );

        OracleJdbcTest test = new OracleJdbcTest();

        List<HashMap<String, String>> returnStringList = test.query("select  ID,attribcode,ATTRIBNAME from M_DIM  where dimflag='DIM1' ", true);
        

        test.close();
        return returnStringList;
    }

【特别注意】
在我解决这个问题以后,我后来在其他方法:A中,又出现了这个错误,但是对应代码却正常执行了,我查看代码,也的确已经加入了跨域代码。
后来经过排查,因为报错误方法调用了其他方法B,而B方法也有这个跨域代码。初步怀疑B方法顶掉了当前A的。(有知道的,讲得清楚的大佬可以留言回复一下哈!)
所以只要删掉B中的跨域方法即可。如果还想API调用B,估计要重新写一个方法了。

其他方案(未尝试):
  1. 通过服务器端代理实现跨域
  2. 防火墙处理,参考文献:https://blog.csdn.net/qq_36454619/article/details/108536568
  3. 使用JSONP格式,即在jQuery中ajax请求参数dataType:‘JSONP’ (本人试了一下,失败了,出现错误:即使其 MIME 类型(“application/json”)不是有效的 JavaScript MIME 类型,仍已加载来自“http://192.168.88.111:8080/aa/xx?callback=jQuery21406702477081808836_1614645899349&_=1614645899351”的脚本。)
  4. 还看到有说在conf文件中该配置的
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值