SpringBoot跨域问题解决

前端访问后台接口时,浏览器报错,跨域无法访问。

报错信息如下:

Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

经过一番百度之后,需要在控制器上添加处理跨域的注解,

注解添加后,再次访问接口,又有了新的报错:

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

根据资料显示,这个是因为浏览器预检请求失败,复杂请求会做预检请求,比如header中有自动以的属性等情况,当前的报错是指OPTION 请求失败,需要后端放行 OPTION 请求。

解决方法是定义个拦截器: 

CorsInterceptor.java

package com.interceptor;

import jakarta.servlet.http.HttpServletRequest;
import jakarta.servlet.http.HttpServletResponse;
import org.springframework.http.HttpMethod;
import org.springframework.http.HttpStatus;
import org.springframework.stereotype.Component;
import org.springframework.web.servlet.HandlerInterceptor;

@Component
public class CorsInterceptor implements HandlerInterceptor {

    @Override
    public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) {
        response.setHeader("Access-Control-Allow-Origin", "*");
        response.setHeader("Access-Control-Allow-Credentials", "true");
        response.setHeader("Access-Control-Allow-Methods", "GET, HEAD, POST, PUT, PATCH, DELETE, OPTIONS");
        response.setHeader("Access-Control-Max-Age", "86400");
        response.setHeader("Access-Control-Allow-Headers", "*");

        // 如果是OPTIONS则结束请求
        if (HttpMethod.OPTIONS.toString().equals(request.getMethod())) {
            response.setStatus(HttpStatus.NO_CONTENT.value());
            return false;
        }

        return true;
    }
}

然后将拦截器注册到全局拦截器中,使其生效。

WebConfig.java

package com.config;

import com.interceptor.CorsInterceptor;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.InterceptorRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;



@Configuration
public class WebConfig implements WebMvcConfigurer {

    @Autowired
    private CorsInterceptor corsInterceptor;

    @Override
    public void addInterceptors(InterceptorRegistry registry) {
        //跨域拦截器需放在最上面
        registry.addInterceptor(corsInterceptor);

    }
}

 

再次访问接口,请求正常返回了

参考链接:

「日常报错」Response to preflight request doesn't pass access control check: It does not have HTTP ok status. - Posase - 博客园 (cnblogs.com)

为什么出现OPTIONS?SpringBoot接口跨域解决方案 - 简书 (jianshu.com) 

相关推荐

  1. 解决问题

    2024-01-21 02:34:01       45 阅读
  2. 解决问题

    2024-01-21 02:34:01       28 阅读
  3. 问题+解决express

    2024-01-21 02:34:01       37 阅读
  4. SpringBoot系列】一键解决问题

    2024-01-21 02:34:01       54 阅读

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-01-21 02:34:01       94 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-01-21 02:34:01       100 阅读
  3. 在Django里面运行非项目文件

    2024-01-21 02:34:01       82 阅读
  4. Python语言-面向对象

    2024-01-21 02:34:01       91 阅读

热门阅读

  1. 2024年对我懒这件事的弥补

    2024-01-21 02:34:01       46 阅读
  2. 调试工具gdb的常用命令总结

    2024-01-21 02:34:01       71 阅读
  3. MVC和MVVM区别和VUE关系

    2024-01-21 02:34:01       54 阅读
  4. html+css3 补充学习

    2024-01-21 02:34:01       67 阅读
  5. 2024QS世界大学排名完整榜单

    2024-01-21 02:34:01       53 阅读
  6. Druid连接池工具公式化SQL附踩坑记录

    2024-01-21 02:34:01       60 阅读
  7. RHCE: 主从DNS服务器配置 (实现正反向解析)

    2024-01-21 02:34:01       62 阅读
  8. Vue-Router: 如何使用路由钩子函数来处理路由变化

    2024-01-21 02:34:01       64 阅读