0


Postman调用接口正常,前端页面调用报跨域

背景:

(该接口为POST接口)配置了跨域,并自定义了一个拦截器,拦截器写了根据自定义注解放行接口的代码,结果前端报跨域,后端也没放行接口。

产生原因:

前端跨域:由于请求处理的顺序问题导致的。当请求打到后端时,是先被拦截器拦截处理的,也就是我们配置的addCrosMappings并没有起到作用,请求直接被拦截器拦截了,而由于此时请求还没有配置跨域信息,所以就出现了跨域问题。

后端未获取到HandlerMethod:
当使用addCorsMappings()方法配置跨域请求后,Spring Boot默认会将CORS请求映射为预检请求(PreFlight OPTIONS请求)。因此,在获取HandlerMethod对象时可能会遇到问题。

解决办法:

一、配置CorsFilter

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
import org.springframework.web.filter.CorsFilter;

import java.util.Arrays;

@Configuration
public class CorsConfig {

    @Bean
    public CorsFilter corsFilter(){

    UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
      CorsConfiguration config = new CorsConfiguration();
      // 允许发送Cookie
      config.setAllowCredentials(true);
      // 允许所有来源的请求
      config.addAllowedOriginPattern("*");
      // 允许所有的请求头字段
      config.addAllowedHeader("*");
      // 允许所有的请求方法(GET, POST, PUT, DELETE等)
      config.addAllowedMethod("*");
      // 对所有的路径都应用跨域配置
      source.registerCorsConfiguration("/**", config);
      // 创建并返回一个跨域过滤器实例
      return new CorsFilter(source);
    }

}

注:AllowCredentials设置为true后,无法和设置为的AllowedOrigin一起使用,且AllowedOriginPatterns也无法直接设置为,所以这里我使用的addAllowedOriginPattern("*")

二、配置放行接口

2.1、根据放行该接口(这样写的话跨域问题实际并没有解决,只是配置了放行的接口没问题)

2.2、由于POST接口,在实际调用前会有一个预调用(OPTIONS类型),该调用正常响应才会实际调接口,所以可以设置OPTIONS类型的接口放行也可以(这个没试过不清楚有没有效,推荐还是配置CorsFilter,配置完CorsFilter后可以不用配置addCorsMapping)

标签: java postman 前端

本文转载自: https://blog.csdn.net/m0_50137812/article/details/134039425
版权归原作者 ICMB方然 所有, 如有侵权,请联系我们删除。

“Postman调用接口正常,前端页面调用报跨域”的评论:

还没有评论