angular - “Access-Control-Allow-Origin” header 的值“http://localhost:4200”不等于提供的来源

（继续标题中的错误消息）“因此不允许访问源'http://127.0.0.1:4200'。
当使用同一个api时，我无法在两个不同的域上运行同一个angular 5站点。
这个错误信息来自chrome。Firefox中的错误是：
已阻止跨源请求：相同源策略不允许读取http://myapitest.local/v1/subscription/current/products处的远程资源。（原因：CORS标题“访问控制允许源”与“http://127.0.0.1:4200”不匹配）
我注意到了这一点，当我们的Angular应用程序的一个白色标签版本将运行在我们的常规应用程序的另一个URL上，但仍然使用相同的Laravel API运行在同一个URL上。我已经添加了适当的cors配置到laravel，这似乎是一个浏览器问题-不知道如何绕过它。
例如，我在localhost上通过从localhost:4200更改为127.0.0.1:4200重新创建了这个。
奇怪的是，飞行前正确的cors头部似乎是成功的。

但是，在get上，它似乎返回了错误的访问控制allow origin头。

这里值得注意的是，将api中允许的源代码更改为allow（'*'）并不能解决此问题。
我不确定我能提供什么其他信息或代码来使这一点更清楚。谢谢。

最佳答案

假设您的api运行在8080上，而角度代码运行在4200上。
在Angular应用程序中创建一个名为proxy.conf.json的文件

{
    "/api/": {
        "target": "http://localhost:8080/",
        "secure": false,
        "changeOrigin": true
    }
}

使用此命令启动角度应用程序

ng serve --port 4200 --proxy-config proxy.conf.json

使用此配置，当您调用localhost:4200/api时，它将调用8080，并且不会有任何cors错误

关于angular - “Access-Control-Allow-Origin” header 的值“http://localhost:4200”不等于提供的来源，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/53087341/