angular - Angular 客户端对后端 API 的请求无法通过访问控制检查

Question

我有一个 Angular 6 客户端，它向单独的 ASP.NET Core API 发送请求，在startup.cs文件中具有以下配置：

在ConfigureServices方法中：

services.AddCors(options =>
{
    options.AddPolicy(
        "MyPolicy",
        builder =>
        {
            builder.AllowAnyOrigin()
                .AllowAnyMethod()
                .AllowAnyHeader()
                .AllowCredentials();
        });
});

在配置方法中：

// called before UseMvc
app.UseCors("MyPolicy");

在本地测试时，调用工作正常。在测试机器上部署并通过其 ip 和端口访问 angular 客户端时，请求给出：

Failed to load http://xxxIPxx:xxxPortxxx/xxxURLxxx:  Response to
preflight request doesn't pass access control check: No
'Access-Control-Allow-Origin' header is present on the requested
resource.  Origin 'http://xxxIPxx:xxxPortxxx' is therefore not allowed
access. The response had HTTP status code 502.

（这是谷歌浏览器显示的错误信息）

我可能错过了什么？

Answer 1

Access-Control-Allow-Origin从 Angular 应用程序触发请求时，您应该包含标头。

axios 的快速示例：从 'axios' 导入 axios；

const Http = axios.create({
  baseURL: 'https://example.com/api',
  headers: { 'Access-Control-Allow-Origin': '*' }
});

export default Http;