Angular ';访问控制允许原点';请求的资源上存在标头
我正在尝试使用Cors在Angular和我的.NETAPI之间建立连接。我不断地发现这个错误:Angular ';访问控制允许原点';请求的资源上存在标头,angular,api,cors,Angular,Api,Cors,我正在尝试使用Cors在Angular和我的.NETAPI之间建立连接。我不断地发现这个错误: localhost/:1 Access to XMLHttpRequest at 'https://localhost:44378/api/OffRec' from origin 'http://localhost:4200' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on t
localhost/:1 Access to XMLHttpRequest at 'https://localhost:44378/api/OffRec' from origin 'http://localhost:4200' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
以修复此错误。我在ConfigureServices中添加了AddCor,在Configure中添加了UserCor,如下所示:
public void ConfigureServices(IServiceCollection services)
{
services.AddCors(options =>
{
options.AddPolicy("CorsPolicy",
builder =>
{
builder.WithOrigins(new string[] { "http://localhost:4200" , "https://localhost:44378/api/offrec" }).AllowAnyMethod().WithHeaders("Access-Control-Allow-Origin");
});
});
services.AddMvc().SetCompatibilityVersion(CompatibilityVersion.Version_3_0);
services.AddControllers();
services.AddDbContext<db_recloadContext>();
}
我的api有一个返回字符串的非常简单的代码,当我运行api时,它工作正常
在过去的两天里,我一直在努力解决这个错误。任何提示或帮助都将不胜感激
这是我根据下面的答案尝试的,仍然得到相同的错误:
services.AddCors(options =>
{
options.AddPolicy("CorsPolicy",
builder =>
{
builder.WithOrigins(new string[] { "http://localhost:4200" , "https://localhost:44378/api/offrec" }).AllowAnyMethod().WithHeaders("Access-Control-Allow-Origin:*");
});
});
下面是错误的图像:
以下是我的api:
namespace RecLoad.Controllers
{
[Route("api/[controller]")]
[EnableCors("AllowAnyCorsPolicy")]
[HttpGet]
public ActionResult<string> Get()
{
return "This is a test";
}
命名空间重新加载.控制器
{
[路由(“api/[控制器]”)]
[启用公司(“AllowAnyCorsPolicy”)]
[HttpGet]
公共行动结果获取()
{
返回“这是一个测试”;
}
CORS是一种允许某些服务的所有者限制访问该服务的位置的工具。您在localhost:4200有一个网站,它正在与localhost:44378的web服务联系以请求一些数据。我知道这两个都是localhost,但它们是不同的东西;它们可能是试图从中获取数据的脚本
因此,在4200站点的页面上运行脚本的浏览器知道它正在联系一个与下载脚本的服务器不同的服务器,因此它对另一个服务器说“嘿,告诉我您将接受来自哪个服务器的请求,该服务器位于/api/offRec”,服务器(位于44378)的响应如下“我只允许从我这里下载的脚本”
此时,您的浏览器将停止请求;“外部”服务器尚未表示愿意为您的脚本提供该资源
作为44378服务器的管理员,您需要做的是在其配置中添加一些CORS头,说明“Access Control Allow Origin:*”或“Access Control Allow Origin:“etc,这样当浏览器在端口4200的站点上运行脚本时,从44378资源请求信息,它得到的响应也包含允许访问的头
只是重申一下,如果我不完全清楚的话:必须添加头的是运行44378站点的服务器,而不是4200站点
使用web浏览器向44378站点发出请求,并在dev tools inspector中查看标题。如果您没有看到Access Control Allow Origin标题,请重新配置它,直到执行此操作。因此,从技术上讲,错误消息所述内容与问题标题所述内容完全相反!?请检查浏览器的URL并确保源代码正确这是您列表中的一个来源。
namespace RecLoad.Controllers
{
[Route("api/[controller]")]
[EnableCors("AllowAnyCorsPolicy")]
[HttpGet]
public ActionResult<string> Get()
{
return "This is a test";
}