Response to preflight request doesn‘t pass access control check: It does not have HTTP ok status.

前端使用ajax向springboot写的后端服务器(配了拦截器)时出现Response to preflight request doesn’t pass access control check: It does not have HTTP ok status.问题的解决办法。如果可以确定跨域不存在问题,那问题很可能就出现在拦截器上!

完整的报错长这样:

Access to XMLHttpRequest at 'http://localhost:8881/user/userInfo' from origin 'http://127.0.0.1:5500' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status. 


看见CORS,一开始以为是跨域问题,随后逐步调试了一下,发现跨域改写的代码都写了,拦截器也可以正常放行。实在找不到什么错误了。
于是就在网上找了一下解决办法,发现这个错误的产生原因是在使用axios发送请求的时候,加入了自定义请求头headers: { ‘Content-Type’: 'application/j // 其他需要的头},然后 axios 就会产生options试探请求。
折腾了很久才知道。是配置的拦截器拦截了预检请求(preflight request)。预检请求是一种由浏览器自动发送的、使用OPTIONS方法的HTTP请求,它用于检查实际请求是否可以被服务器接受。
当你的拦截器拦截到这种OPTIONS请求时,如果没有正确地处理(例如,返回正确的CORS头部信息),那么浏览器就会认为服务器是不可连接到的所以阻止实际的请求发送,从而导致你看到的错误Response to preflight request doesn’t pass access control check: It does not have HTTP ok status.
所以我们需要确保拦截器在处理OPTIONS请求时,返回正确的CORS头部信息。要在拦截器中检查请求的HTTP方法,如果是OPTIONS方法,那么就直接返回一个包含正确CORS头部信息的响应。

下面是拦截器应该写的代码

//配置拦截器
@Component
public class LoginInterceptor implements HandlerInterceptor {

    @Override
    public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception {
        //处理预请求的代码
        if (request.getMethod().equals("OPTIONS")) {
            response.setHeader("Access-Control-Allow-Origin", "*");//*表示放行所有的源,http://127.0.0.1:5500
            response.setHeader("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, HEAD, OPTIONS");
            response.setHeader("Access-Control-Allow-Headers", "*");
            response.setHeader("Access-Control-Allow-Credentials", "true");
            response.setStatus(HttpServletResponse.SC_OK);
            return false;
        }
//其他代码……

        }

}

/*

Access-Control-Allow-Origin: 这个头部指定了哪些源(origin)可以访问该资源。在这里,它被设置为"*",这意味着任何源都被允许访问。
Access-Control-Allow-Methods: 这个头部指定了在实际请求中可以使用哪些HTTP方法。在这里,它包括"GET", "POST", "PUT", "DELETE", "HEAD", "OPTIONS"。
Access-Control-Allow-Headers: 这个头部指定了在实际请求中可以使用哪些HTTP头部。在这里,它被设置为"*",这意味着任何头部都被允许。
Access-Control-Allow-Credentials: 这个头部指定了是否允许发送Cookie。在这里,它被设置为"true",这意味着允许发送Cookie

*/

  • 4
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
"Access to XMLHttpRequest at xx from orgin xx has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status." 这个错误是由浏览器的同源策略引起的。当前端向不同的域名发送请求时,浏览器会发出预检请求,以确定是否允许跨域访问。预检请求的响应必须包含一个HTTP状态码200(HTTP ok status),才能通过访问控制检查。如果预检请求的响应没有返回200状态码,就会出现这个错误。 解决这个问题的方法有几种,以下是一些可能的解决方案: 1. 在后端服务器上配置CORS(跨域资源共享)策略,允许特定的域名或所有域名进行跨域访问。可以使用CORS过滤器或在后端代码中添加相应的配置。这将允许浏览器接受来自其他域的请求,并将正确的响应返回给预检请求。 2. 在前端代码中使用代理服务器。可以通过在前端代码中设置代理服务器,将所有跨域请求发送到代理服务器,然后由代理服务器将请求转发到后端服务器。这样可以绕过浏览器的同源策略,解决跨域问题。但是需要注意,代理服务器必须配置正确,并且具有足够的安全性措施,以防止滥用。 3. 使用JSONP(JSON with padding)技术。JSONP是一种通过动态创建`<script>`标签来实现跨域请求的技术。通过在请求中指定一个回调函数名,并将响应数据作为函数的参数传回来,从而绕过浏览器的同源策略。但是JSONP只能用于GET请求,且需要后端服务器支持返回JSONP格式的响应。 综上所述,要解决"Response to preflight request doesn't pass access control check: It does not have HTTP ok status."错误,可以根据具体情况选择合适的解决方案。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *2* [关于Springboot中跨域问题的解决(Response to preflight request doesn‘t pass access control check)](https://blog.csdn.net/java0506/article/details/120620447)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] - *3* [230208-033shopDemo(抽离跨域(Cors)限制依赖注入和管道中间件之AddCors和UseCors)](https://download.csdn.net/download/zhoujian_911/87427748)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值