使用 Spring Boot 和 Vue.JS 的 Access-Control-Allow-Origin 多个值

Posted 2023-02-27

【中文标题】使用 Spring Boot 和 Vue.JS 的 Access-Control-Allow-Origin 多个值

【英文标题】：Access-Control-Allow-Origin multiple values with Spring Boot and Vue.JS

【发布时间】：2019-11-20 10:08:27

【问题描述】：

我的 API 上有这个 CORS 类：

    import org.springframework.context.annotation.Configuration;
    import org.springframework.web.servlet.config.annotation.CorsRegistry;
    import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;

    @Configuration
    public class CorsConfiguration implements WebMvcConfigurer 
        @Override
        public void addCorsMappings(CorsRegistry registry) 
            registry.addMapping("/**").allowedMethods("*").allowedOrigins("*").allowedHeaders("*");

 

Request 返回 200，这是我对前端的回答：

[日期：“2019 年 7 月 10 日，星期三，格林威治标准时间 18:11:54”，服务器：“Apache/2.4.18 (Ubuntu)", Vary:"Authorization", Cache-Control:"no-cache, private", X-Robots-Tag:"noindex", Access-Control-Allow-Origin:"*", Access-Control-Allow-Methods:"POST, GET, PUT, PATCH, DELETE, OPTIONS", Access-Control-Allow-Headers：“授权，内容类型，接受”， Access-Control-Allow-Credentials:"true", Keep-Alive:"timeout=5, max=100", 连接:"Keep-Alive", 传输编码:"chunked", 内容类型：“应用程序/json”]

但在我的 chrome 控制台中，我看到了：

在“http://localhost:3000/api/v1/empresas”访问 XMLHttpRequest 来自原点“http://localhost:8080”已被 CORS 策略阻止： 'Access-Control-Allow-Origin' 标头包含多个值 '*, *'，但只允许一个。

我的控制器：

@GetMapping(value = "empresas", produces = "application/json;charset=UTF-8")
public ResponseEntity listaEmpresa(@NotNull @RequestHeader String authorization) throws IOException 
    tokenValidatorService.validaToken(authorization);
    return companyModel.listaEmpresas(authorization);

我能做什么？我没有在我的代码中随时设置访问控制允许来源..

【问题讨论】：

您可以简单地将@CrossOrigin 放在方法的开头。

嗨，苏达尔。 @CrossOrigin 没有结果。如果有帮助，我会添加我的控制器

看起来您可能有另一个过滤器或其他也添加了该标头的东西 - 可能值得使用调试日志记录运行，以查看您是否可以找到可能添加第二个 Access-Control-Allow 的内容- *的来源标题。我在配置错误的 websocket 服务器和 Spring Cloud 网关时遇到了这个问题。

Spring 中的某个点正在添加此标头，但我不知道如何将其配置为不这样做

【参考方案1】：

我通常使用这种配置，它可以工作。

确保@Configuration 类已加载到应用程序上下文中

@Configuration
public class CorsConfiguration 

    @Bean
    public WebMvcConfigurer corsConfigurer() 
        return new WebMvcConfigurer() 
            @Override
            public void addCorsMappings(CorsRegistry registry) 
                registry.addMapping("/**")
                    .allowedOrigins("*")
                    .allowedHeaders("*")
                    .allowedMethods("*");
            
        ;
    

如果您有触发飞行前请求的安全机制，您还必须允许HttpMethod.OPTIONS 在您的所有应用程序上调用，如下所示

@Configuration
@EnableWebSecurity
@EnableGlobalMethodSecurity(prePostEnabled = true)
public class KsSecurity extends WebSecurityConfigurerAdapter 

    ...

    @Override
    public void configure(WebSecurity web) throws Exception 
        web.ignoring()
                .antMatchers(HttpMethod.OPTIONS, "/**")    // <---------- You need this
                .antMatchers(
                        "/**/*.js,html,css,ico",
                        "/i18n/**",
                        "/assets/**",
                        "/v2/api-docs/**",
                        "/webjars/**",
                        "/swagger-resources/**",
                        "/swagger-ui.html");
    

    ...

【讨论】：

嗨，ValerioMC。 “确保 @Configuration 类已在应用程序上下文中加载”是什么意思？你能证明一下吗？另外，我用过你的课......同样的错误......

@FearX 您的类可能没有被 Spring Boot 应用程序加载。您是否将类放在 SpringBoot 入口点类的子包中？如果你有疑问，你可以放一个记录器并检查它啊启动

更新的答案也允许飞行前请求HttpMethod.OPTIONS

【参考方案2】：

如果您使用的是 spring-cloud-gateway api，请在下面尝试

弹簧： 云： 网关： 全球企业： cors配置： '[/]': 允许的来源：“” 允许的方法：“” 允许的标题：“” 允许凭据：true

  routes:
  - id: login-users
    uri: http://localhost:1000/
    filters:
    - DedupeResponseHeader=Access-Control-Allow-Credentials Access-Control-Allow-Origin
    predicates:
    - Path=/login/v1/post/login
    - Method=POST
  - id: loginservice
    uri: http://localhost:1001/
    predicates:
    - Path=/login/v1/**
    - Method=POST