为什么调用API时出现CORS错误

时间:2020-03-05 05:33:25

标签: angular asp.net-core cors

我在前端使用Angular,在后端使用C#,在尝试编辑字段并保存时出现此错误:

Access to XMLHttpRequest at 'http://192.168.220.14:81/api/registry' from origin 'http://artc.tj' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

PUT http://192.168.220.14:81/api/reg polyfills-es2015.23e79c711e3c227d781f.js:1 PUT http://192.168.220.14:81/api/registry net::ERR_FAILED

Error Scrinshot

Startup.cs:

 public void ConfigureServices(IServiceCollection services)
 {
     //CORS
     services.AddCors(options =>
     {
         options.AddPolicy(MyAllowSpecificOrigins,
         builder =>
         {
             builder.WithOrigins("http://localhost",
                                 "http://localhost:4200",
                                 "http://artc.tj",
                                 "http://192.168.220.14")
                                    .AllowAnyMethod()
                                    .AllowAnyHeader()
                                    .AllowCredentials();
         });
     });
  }

3 个答案:

答案 0 :(得分:1)

确保在Cors()方法中使用Configure

Startup.cs

public class Startup
{
   //...
   readonly string MyAllowSpecificOrigins = "_myAllowSpecificOrigins";

   public void ConfigureServices(IServiceCollection services)
   {
      //...
         services.AddCors(options =>
         {
             options.AddPolicy(MyAllowSpecificOrigins,
             builder =>
             {
                 builder.WithOrigins("http://localhost:4200")
                     .AllowAnyHeader()
                     .AllowAnyMethod()
                     .AllowAnyOrigin();
             });
         });
      //...
   }

   public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
   {
      //...
      app.UseCors(MyAllowSpecificOrigins);
      //...
   }
   //...
}

P.S。另外,请确保在客户请求withCredentials: false中包含httpOptions

答案 1 :(得分:1)

我认为您从Angular端发送请求时缺少标题。这是我通常的工作:

Startup.cs

public void ConfigureServices(IServiceCollection services)
{
     services.AddCors(options =>
     {
         options.AddPolicy("Default", policy =>
         {
             policy.AllowAnyOrigin()
                   .AllowAnyHeader()
                   .AllowAnyMethod();
         });
     });
}

public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
    app.UseCors("Default");
}

角度请求:

callAPI() {
   return this.httpClient
            .get(API_URL, {headers: {'Access-Control-Allow-Origin' : '*'}});
}

答案 2 :(得分:-1)

你不知道。您所请求的服务器必须实现CORS才能从您的网站访问权限中授予JavaScript。您的JavaScript无法授予自己访问其他网站的权限。

使用chrome浏览器的网络商店中的CORS扩展程序。

希望如此,这可能会改变您的看法