Express Gateway CORS + apiKey 授权 401 Unauthorized

Express Gateway CORS + apiKey authorization 401 Unauthorized

意向

CORS 配置似乎有效且有效,在 React-App 中我可以轻松访问网关。也可以通过 Postman 访问,所以 apiKey 不会导致问题。

但是如果我使用 apiKey 添加身份验证,我会在所有浏览器中收到错误消息。 在 Chrome 中:

问题

OPTIONS https://example-gateway.com/test 401 (Unauthorized)

Access to XMLHttpRequest at 'https://example-gateway.com/test' from origin 'https://example-app.com' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.

是什么导致了这种行为?浏览器是否未通过 OPTIONS-CORS 请求发送所需的 apiKey,因此被阻止?

如何解决?

代码

pipelines:
  adminAPI:
    apiEndpoints:
      - testApi
    policies:
      - cors:
          - action:
              origin: [https://example-gateway.com]
              methods: GET,POST,PUT,DELETE,OPTIONS
              preflightContinue: true
              optionsSuccessStatus: 204
              credentials: true
              maxAge: 600
              allowedHeaders:
                - Authorization
              exposedHeaders:
                - Authorization
      - key-auth:
          - action:
              apiKeyHeader: Authorization
              disableHeadersScheme: false
      - proxy:
          - action:
              serviceEndpoint: testBackend

我认为问题在于 key-auth 为 CORS 的 OPTION 调用返回 401,这可能是您收到此类问题的原因。

您很可能可以通过在 key-auth 调用中添加条件来解决此问题。

http:
  port: ${EG_HTTP_PORT:-8080}
# https:
#   port: 9999
#   tls: {}
admin: # remove this section to disable admin API
  port: 9876
  host: localhost # use 0.0.0.0 to listen on all IPv4 interfaces
apiEndpoints:
  api:
    host: '*'
serviceEndpoints:
  backend:
    url: 'http://localhost:9876' # btw this is EG admin API
policies:
  - proxy
  - key-auth
  - cors
pipelines:
  adminAPI:
    apiEndpoints:
      - api
    policies:
      - cors:
      - key-auth:
        - condition:
            name: not
            condition:
              name: method
              methods:
                - OPTIONS
        action:
          apiKeyHeader: Authorization
          disableHeadersScheme: false
      - proxy:
          action:
            serviceEndpoint: backend