CORS 策略阻止了 Angular AWS

Question

您好，我创建了一个访问 Lambda 函数的 AWS API 网关。

如果我尝试从 Postman 调用网关，一切正常。但是当我尝试使用我的 Angular 应用程序调用 get API 时，我收到以下错误:

Access to XMLHttpRequest at 'apiUrl' from origin 'http://localhost:8100' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

我使用以下代码创建我的 Angular 请求:

let params = new HttpParams().set('username','test@mail.com').append('password','1234');
this.http.get(apiUrl, {params}).subscribe(
res => {alert('success');},
err => {alert('fail');}
)

我已经在我的 API 网关中启用了 CORS。
我希望你们能帮我调用我的 AWS API。

我当前的选项方法如下所示:
Integration Response

Answer 1

您正在 Angular 中正确地形成您的请求。
该问题与您的应用程序的客户端无关，而与您在 AWS 中设置 CORS 支持的方式有关。

Postman 可以正常访问您的 API，因为 Postman 不执行 Web 浏览器执行的“同源”策略，即它完全绕过 CORS。

要使浏览器成功发出请求，API 必须使用 200 返回码响应同一端点上的 OPTIONS 请求，并在该响应中包含 Access-Control-Allow-Origin header ，指示请求的实际来源或通配符“*”。

AWS 在这方面的文档非常清晰和广泛。