Angular + NET Core“(未知URL)的HTTP失败响应:0未知错误”

Mar*_*way 5 http cors .net-core asp.net-core-webapi angular

我正在尝试从我的角度应用程序向我的.NET Core WebAPI后端发送GET请求。两者都在localhost上运行。Angular在端口4200上运行,WebAPI在端口5001上运行。当我在Angular中发出GET请求时,控制台中显示以下错误:

控制台错误

在线搜索后,几乎每个答案都归结为一个问题,即后端服务器上未正确启用CORS。但是,据我所知,我已经正确设置了CORS。这是我对CORS的配置:

在此处输入图片说明

在此处输入图片说明

这是Angular中的服务功能以及WebAPI中的GET方法:

在此处输入图片说明

在此处输入图片说明

我知道URL是正确的,因为当我将URL复制到Postman时,它可以按预期工作。

主要是我想知道我是否搞砸了CORS,因为这似乎是此错误消息的主要问题,或者是否还有其他我可能错过的事情。

编辑(解决方案):好的,通过各种尝试和错误,我相信我已经找到了问题。当我进行初始项目时,我是在JetBrains Rider中进行项目的。我决定尝试在Visual Studio中创建一个新项目,看看会发生什么,但是问题仍然存在。事实证明,问题不在于CORS,而在于无效的HTTPS localhost证书。当我尝试运行console命令时,dotnet dev-certs https --trust我没有弹出确认证书的提示,而只是显示一条没有用的通用错误消息。这是我解决问题的方式(无论这是否是正确的讨论方式)。

  1. 运行WebAPI并在Chrome中打开该网站。
  2. 在HTTPS连接上,Chrome将允许您通过单击URL旁边的“安全”或“不安全”标签来查看证书信息。我单击了该按钮,然后打开了证书信息窗口。
  3. 有一个名为“详细信息”的选项卡,可以将证书保存到计算机中。
  4. 保存证书后,我可以右键单击它,然后有一个名为“安装证书”的右键单击选项。
  5. 我安装了证书,只需单击下一步,然后将值保留为默认值。之后,Angular应用现在可以按预期进行GET,POST,PUT等请求,并且当我将Web API URL复制到Chrome中时,Chrome现在表示连接是安全的,而不是像以前那样不安全。

Mar*_*way 4

好吧,通过各种尝试和错误,我相信我已经找到了问题所在。当我制作最初的项目时,我在 JetBrains Rider 中制作了该项目。我决定尝试在 Visual Studio 中创建一个新项目,看看会发生什么,但是问题仍然存在。事实证明,问题不在于 CORS,而在于无效的 HTTPS 本地主机证书。当我尝试运行控制台命令时,dotnet dev-certs https --trust我没有收到确认证书的弹出窗口,而只是一条没有用的通用错误消息。以下是我解决这个问题的方法(是否正确可以讨论)。

  1. 运行 WebAPI 并在 Chrome 中打开该网站。
  2. 在 HTTPS 连接上,Chrome 将允许您通过单击 URL 旁边的“安全”或“不安全”标签来查看证书信息。我单击它并打开证书信息窗口。
  3. 有一个名为“详细信息”的选项卡,我可以在其中将证书保存到我的计算机上。
  4. 保存证书后,我可以右键单击它,然后会出现一个名为“安装证书”的右键单击选项。
  5. 我只需单击“下一步”并将值保留为默认值即可安装证书。之后,Angular 应用程序现在按预期发出 GET、POST、PUT 等请求,当我将 Web API URL 复制到 Chrome 中时,Chrome 现在表示连接是安全的,而不是像以前那样不安全。

这是我运行时遇到的错误dotnet dev-certs https --trust供参考:

在此输入图像描述