微服务架构：CORS 配置导致访问控制允许来源 header 包含多个值

Question

我正在开发 spring 启动应用程序。其中有 API-Gateway 和三个微服务。当我从 UI 调用 API 时，它会抛出 CORS 错误。

错误：

访问控制允许来源header包含多个值但只允许一个

我已经在 API-Gateway 中的 application.yml 中配置了 cors。

spring:
    application:
        name: api-gateway
    cache:
        type: redis
    redis:
        host: 'http://localhost'
        port: 6379
    cloud:
        gateway:
            globalcors:
                corsConfigurations:
                '[/**]':
                allowedOrigins: "*"
                allowedMethods: "*"
                allowedHeaders: "*"
    eureka:
        client:
            eureka-server-d-n-s-name: my.dns
            eureka-service-url-Context: eureka
            fetch-registry: false
            region: ap-south-1b
            register-with-eureka: false
            use-dns-for-fetching-service-urls: true
        datacenter: cloud
    ribbon:
        eureka:
            enabled: false
    server:
        port: 8765
    zuul:
        routes:
            order-service:
                url: 'http://localhost:8088'
            product-service:
                url: 'http://localhost:8084'
            user-service:
                url: 'http://localhost:8082'

除此之外，我还在每个微服务中配置了 CORS。如果我直接调用微服务，而不是通过 API-Gateway 调用 API，它工作正常。

Answer 1

你需要一个配置UI。

对于 angular 在与 package.json

相同的包中创建 proxy.conf.js

const PROXY_CONFIG = [
  {
    context: [
      '/foo/**',
      '/bar/**'
    ],
    target: "http://localhost:8082",
    secure: false
  }
]

module.exports = PROXY_CONFIG;

您还需要从 ng serve --proxy-config proxy.conf.js

开始

在 React 中你可以在 package.json

中定义代理属性

{
  "name": "client",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "react": "^16.3.2",
    "react-dom": "^16.3.2",
    "react-scripts": "1.1.4"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  },
  "proxy": "http://localhost:<PORT-GOES-HERE>"
}

Answer 2

Access Control Allow Origin header 包含多个值，但只允许一个值 建议您发送多个 header，这不是预期的。

在这里，您在 API 网关和导致问题的每个微服务上都配置了 CORS，为避免此问题，您可以仅在 API 网关上或在每个微服务上配置 CORS 配置微服务。

微服务架构：CORS 配置导致访问控制允许来源 header 包含多个值

MicroService Architecture : CORS Configuration results in Access Control Allow Origin header contains multiple values

java

cors

spring-boot

microservices

api-gateway