从angular2访问web-api时没有'Access-Control-Allow-Origin'错误[重复]

Posted 2023-03-03

【中文标题】从angular2访问web-api时没有\'Access-Control-Allow-Origin\'错误[重复]

【英文标题】：No 'Access-Control-Allow-Origin' error when accessing web-api from angular2 [duplicate]从angular2访问web-api时没有'Access-Control-Allow-Origin'错误[重复]

【发布时间】：2018-07-18 08:26:09

【问题描述】：

一方面，我有一个 ASP.net Web 应用程序，其中包含一个 Web api 模块。 在同一台机器上，我有一个 angular 2 客户端应用程序，它正在使用 web api 控制器 crud 方法。 angular 2 使用基本的 http 服务，其 localhost 的 uri 和运行 web api 的端口号。我运行 web api 应用程序，当 angular 2 尝试使用 Get 请求时，我收到此错误消息（22770 是 web-api 的端口，4200 是 angular 2 应用程序的端口）：

无法加载http://localhost:22770/api/：请求的资源上不存在“Access-Control-Allow-Origin”标头。 Origin 'http://localhost:4200' 因此不允许访问。

虽然这是一个很常见的问题，但我的问题有点不同： CORS 定义为： 跨域资源共享 (CORS) 是一种使用 额外的 HTTP 标头让用户代理获得访问权限 从不同来源（域）上的服务器中选择的资源 当前使用的网站

但是 - 我正在使用同一个域 - 在我的本地计算机 (localhost) 上。

问题是什么，我该如何解决？

【问题讨论】：

见***.com/questions/tagged/…

看看这个post，我也遇到了同样的问题

【参考方案1】：

好的 - 稍微调查了一下，发现在同一本地主机上工作时出现该错误消息的原因 - 似乎不同的端口被视为不同的域。 我注意到的特殊补充： "Internet Explorer 在比较来源时不考虑端口"

【参考方案2】：

您需要在您的 Web api 中启用 CORS（跨源请求）。按照以下页面中的说明进行操作

https://docs.microsoft.com/en-us/aspnet/web-api/overview/security/enabling-cross-origin-requests-in-web-api