请求时设置了Header请求和token可是后台接收不到,然后一直报跨域错误

最近项目出了一个疑难杂症,恶心死我。就是后端加上@CrossOrigin后,跨域依然存在,但是我去后端控制台一看,却是一直报token为空得错误,百思不得其解为什么请求到后端了,前端报跨域错误,并且后台还解析不到token,并且服务器看问题截图,有个重要错误信息:就是OPTIONS请求出错。

试着debug了一下,发现携带token得请球头都是空的,也就是压根没传过来!!!

而且前台也压根没有option请求,真是个灵异事件!!

开始自己一边调试一边问ai,一直没有解决,但是后来看了一些博客终于明白了原因。

cors跨域复杂请求会先发送一个方法为OPTIONS的预检请求,这个请求是用来验证本次请求是否安全的 .第二个过滤器判断token时会把预请求当做真正的请求去判断,所以在第二个过滤器判断token之前先判断是不是预请求OPTIONS,不是则验证token,是则放行。

【1】有的说,好像是OPTIONS请求无法携带自定义header

【2】有的说后端网关会拦截OPTIONS请求

也就是说,一次跨域请求会先放过来一次options检测请求,来检测此次请求是否安全  

因此后端拦截器要对options请求放行,否则就是出现上面我那种牛头不对马嘴得恶心错误。

在拦截器中加几行代码:

//添加这行代码,让OPTIONS请求通过
if (httpServletRequest.getMethod().equals("OPTIONS")) {
    httpServletResponse.setStatus(HttpServletResponse.SC_OK);
    return true;
}

或者

//添加这行代码,让OPTIONS请求通过
if (request.getMethod().equals("OPTIONS")) {
     return true;
    }

在HTTP1.1 协议中的,请求方法分为GET、POST、PUT、DELETE、HEAD、TRACE、OPTIONS、CONNECT 八种。浏览器根据这些请求方法和请求类型将请求划分为简单请求和非简单请求。

简单请求浏览器先发送(执行)请求然后再判断是否跨域。

请求方法为 GET、POST、HEAD,请求头header中无自定义的请求头信息,请求类型Content-Type 为 text/plain、multipart/form-data、application/x-www-form-urlencoded 的请求都是简单请求。

非简单请求浏览器先发送预检命令(OPTIONS方法),检查通过后才发送真正的数据请求。

预检命令会发送自定义头为Access-Control-Request-Headers: content-type的请求到服务器,根据响应头的中的 “Access-Control-Allow-Headers”: “Content-Type” 判断服务器是否允许跨域访问。预检命令是可以缓存,服务器端设置 “Access-Control-Max-Age”: “3600”,这样后面发送同样的跨域请求就不需要先发送预检命令了。

请求方法为 PUT、DELETE 的 AJAX 请求、发送 JSON 格式的 AJAX 请求、带自定义头的 AJAX 请求都是非简单请求。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值