Angular2对预检请求的响应未通过访问控制检查：请求的资源上不存在“Access-Control-Allow-Origin”标头

Posted 2023-03-04

【中文标题】Angular2对预检请求的响应未通过访问控制检查：请求的资源上不存在“Access-Control-Allow-Origin”标头

【英文标题】：Angular2 Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource

【发布时间】：2017-09-08 05:20:47

【问题描述】：

我试图发出一个简单的 POST 请求以在 .NET 中使用 API 创建一个帐户，但如标题所述，它失败并出现警告。 在 Postman（api 测试工具）中执行相同的请求会返回状态 200：好的，一切正常，数据已保存到数据库中。 但我不能在我的网络应用程序中做同样的事情，这是我的代码：

  register()

let details = 
  Serviceurl: this.serviceUrl,
  CompanyName: this.companyName,
  CompanyFullName: this.companyFullName,
  LanguageCulture: this.languageCulture,
  IsNewUser: this.isNewUser,
  User: 
    UserName: this.userName,
    FirstName: this.firstName,
    LastName: this.lastName,
    Email: this.email,
    Password: Md5.hashStr(this.password)
  


this.authService.createAccount(details)
.then((result) => 

, (err) => 

);

然后是我的 authService 中的请求本身：

  createAccount(details)

return new Promise((resolve, reject) => 

    let headers = new Headers();
    headers.append('Content-Type', 'application/json');

    this.http.post('http://SITEADDRESS/api/IM_Customers/CreateNew', JSON.stringify(details), headers: headers)
      .subscribe(res => 
        let data = res.json();
        resolve(data);

      , (err) => 
        reject(err);
      );

);

【问题讨论】：

你试过谷歌吗？这是由浏览器的 CORS 策略引起的。邮递员不需要它。见developer.mozilla.org/en-US/docs/Web/HTTP/…

No 'Access-Control-Allow-Origin' header in Angular 2 app的可能重复

是的，我尝试用谷歌解决它，我认为我启用了这个，但我的客户端有问题

【参考方案1】：

您需要在 API 项目中启用 No-Access-Control-Allow-Origin。 在 API 项目中，startup.cs：

public void Configure(IApplicationBuilder app)
    app.UseCors(builder=>builder.AllowOrigin().AllowAnyMethod().AllowAnyHeader());