Angular 6 中的 cors 策略已阻止从源访问 xmlhttprequest答案

【问题标题】：Access to xmlhttprequest at from origin has been blocked by cors policy in Angular 6Angular 6 中的 cors 策略已阻止从源访问 xmlhttprequest
【发布时间】：2019-06-30 00:06:45
【问题描述】：

我在服务器端项目中使用 Asp.Net Core Boilerplate 框架。 Angular 6 用于客户端项目。服务器端项目工作没有任何错误。（显示 Swagger API - 并且 API 也在工作）

Angular 项目没有任何编译错误。使用 Google chrome 运行 Angular 项目时，(http://localhost:4200/) 它显示以下错误消息。

浏览器控制台显示如下：-

从源访问“http://server.projectName.lk//AbpUserConfiguration/GetAll”处的 XMLHttpRequest 'http://localhost:4200' 已被 CORS 策略阻止：对预检请求的响应未通过访问控制检查：请求的资源上不存在“Access-Control-Allow-Origin”标头。

当点击“http://server.projectName.lk//AbpUserConfiguration/GetAll”链接时，它会在另一个选项卡中打开并显示以下错误，

非常感谢您解决此问题的想法..

注意：之前的任何问题都没有给我解决方案。

这是您收到的有关此问题的调试错误日志

> The thread 0x54b0 has exited with code 0 (0x0).
> Microsoft.AspNetCore.Hosting.Internal.WebHost:Information: Request
> starting HTTP/1.1 OPTIONS
> http://localhost:21021/AbpUserConfiguration/GetAll  0
> Microsoft.AspNetCore.Cors.Infrastructure.CorsService:Information: CORS
> policy execution failed.
> Microsoft.AspNetCore.Cors.Infrastructure.CorsService:Information:
> Request origin http://localhost:4200 does not have permission to
> access the resource.
> Microsoft.AspNetCore.Hosting.Internal.WebHost:Information: Request
> finished in 311.689ms 204 
> Microsoft.AspNetCore.Mvc.Internal.ControllerActionInvoker:Information:
> Route matched with {action = "Index", controller = "Home", area = ""}.
> Executing action San.BA.Web.Host.Controllers.HomeController.Index
> (San.BA.Web.Host) The program '[21292] dotnet.exe' has exited with
> code -1 (0xffffffff).

startup.cs File

【问题讨论】：

"server.projectName.lk/AbpUserConfiguration/GetAll" ，你能不能打开新标签并输入这个网址。
是的。但它给出了上述 404.0 错误消息..
您对默认 abp 项目模板进行了哪些更改？您是否发布了后端或从 VS 运行？ 404，好像是请求的url错误，检查一下swagger中的方法，分享一下你是怎么从客户端发送请求的。
api AbpUserConfiguration/GetAll 方法在您的服务器端不存在。
嗨涛，我将现有的项目文件添加到下载的默认 Abp 项目模板中。我用 VS 运行了 Abp 项目..

标签： c# angular asp.net-core aspnetboilerplate

【解决方案1】：

跨域资源共享 (CORS) 是一项 W3C 标准，允许服务器放宽同源策略。使用 CORS，服务器可以明确地允许一些跨域请求，同时拒绝其他请求。 CORS 比 JSONP 等早期技术更安全、更灵活。本主题介绍如何在 ASP.NET Core 应用中启用 CORS。

这是由于服务器端的 CORS 策略失败而发生的。因为您需要在宿主项目的 appsettings.json 文件中添加客户端 url。

"App": { ...... "CorsOrigins": "@987654321@" ...... }

有关更多信息，您可以查看以下网址：
https://docs.microsoft.com/en-us/aspnet/core/security/cors?view=aspnetcore-2.2

【讨论】：

非常有价值和有用的答案。但是 "CorsOrigins" 正如你回答的那样，我的 appsettings.json 文件中已经定义了。
您是否在 IIS 中托管 API？

【解决方案2】：

我知道这是一个老问题，但我认为这会对任何面临这个问题的人有所帮助。我们最近将基于 ASP.NET WebAPI 的应用程序移至 AWS 时遇到了同样的错误。事实证明，负载均衡器 (ALB) 的超时时间为一分钟，这意味着如果任何 API 花费的时间超过一分钟，ALB 就会取消请求，奇怪的是 Chrome 会给出与 CORS 相关的错误。在 IIS HTTPERR 日志中，此类请求被标记为 Request_Cancelled。由于我们的一个 API 花费了超过一分钟，我们不得不更改 ALB 中的超时配置，事情开始顺利进行！不过，Chrome 为何将其称为 CORS 是个谜！

【讨论】：

【解决方案3】：

只需进入 web.config 文件并将下面的代码粘贴到

system.web服务器

<httpProtocol>  
    <customHeaders>  
     <add name="Access-Control-Allow-Origin" value="*" />  
     <add name="Access-Control-Allow-Headers" value="Content-Type" />  
     <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />  
    </customHeaders>  
  </httpProtocol>

【讨论】：