Nginx Ingress跨域配置说明

验证跨域配置是否生效

curl -X OPTIONS -H 'Origin: <来源站点>' <您配置了跨域规则所在Ingress对应的url>如curl -X OPTIONS -H 'Origin: https://frontend.example.com'  http://api.example.com/test跨域规则会在原始后端响应下添加Access-Control-xx相关header，例如：

HTTP/1.1 200 OK
Access-Control-Allow-Origin: https://frontend.example.com
Access-Control-Allow-Methods: GET, PUT, POST, DELETE, PATCH, OPTIONS
Access-Control-Allow-Headers: DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range
Access-Control-Allow-Credentials: true
Content-Type: application/json

如果服务器响应中没有正确设置CORS头部（如Access-Control-Allow-Origin），浏览器会阻止前端 JavaScript访问响应数据，这就是所谓的CORS错误发生跨域错误对应的浏览器行为。

1. 发送预检请求：

   浏览器将CORS请求分成两类：

   • 简单请求（simple request），直接发送请求，不需要发送预检请求。

   • 非简单请求（not-so-simple request）。

   浏览器发送预检请求：

   OPTIONS /data HTTP/1.1
   Host: api.example.com
   Origin: https://frontend.example.com
   Access-Control-Request-Method: POST
   Access-Control-Request-Headers: X-Custom-Header

2. 预检请求的响应：

   服务器响应预检请求，但未包含POST方法：

   HTTP/1.1 204 No Content
   Access-Control-Allow-Origin: https://frontend.example.com
   Access-Control-Allow-Methods: GET, OPTIONS
   Access-Control-Allow-Headers: X-Custom-Header

3. 浏览器决定是否发送实际请求：

   • 浏览器检查预检请求的响应，发现Access-Control-Allow-Methods中不包含POST方法。

   • 浏览器会阻止后续的实际POST请求。

   • 控制台会报类似以下的CORS错误：

   Access to fetch at 'https://api.example.com/data' from origin 'https://frontend.example.com' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: xxxx.

   或者

   Method POST is not allowed by Access-Control-Allow-Methods in preflight response

FAQ

在设置了nginx.ingress.kubernetes.io/cors-allow-credentials: "true"后，是否允许将nginx.ingress.kubernetes.io/cors-allow-origin配置为"*"?

不允许。由于浏览器安全策略限制，当Access-Control-Allow-Credentials设置为true时，Access-Control-Allow-Origin不能设为通配符"*"。这一限制旨在防止未经授权的域访问敏感资源，例如携带用户凭证信息的Cookies或者Authorization头部等。

nginx.ingress.kubernetes.io/cors-expose-headers（或Access-Control-Expose-Headers HTTP header）的作用对象是什么？

nginx.ingress.kubernetes.io/cors-expose-headers用于设置Access-Control-Expose-Headers 的HTTP响应头，以决定哪些非标准响应头字段可以通过客户端的JavaScript代码获取，例如通过XMLHttpRequest的getResponseHeader()方法获取。

默认情况下，浏览器在处理跨域请求时只能访问标准的响应头，包括Cache-Control、Content-Language、Content-Type、Expires、Last-Modified和Pragma。服务端返回的任何自定义头字段在没有配置的情况下对客户端JavaScript都是不可见的。

通过配置Access-Control-Expose-Headers头部，服务器可以指定哪些自定义响应头字段可以被浏览器暴露给JavaScript。例如，如果希望使自定义头X-Custom-Header在JavaScript中可访问，服务器需在响应中添加以下头部：

Access-Control-Expose-Headers: X-Custom-Header