Angular2: http.get return "No 'Access-Control-Allow

本文关键字:No Access-Control-Allow quot get return Angular2 http | 更新日期: 2023-09-27 18:02:05

我得到以下错误:

对预飞行请求的响应未通过访问控制检查:No"访问-控制-允许-起源"标头出现在请求上资源。

当从我的angular2应用向我的web API发出以下请求时:

     return this.http.get("http://localhost/api/test", { headers })
    .map(res => this.extractData(res))
    .catch(this.handleError);

一些注意事项:

  • 我用的是microsoft . win. cors
  • 请求工作正常时,他们不包括头。这个包含用于身份验证的头。
  • 我可以使用Chrome浏览器请求。
  • Microsoft.Owin。Cors安装在解决方案
  • app.UseCors(CorsOptions.AllowAll);处于startup.cs
  • 配置方法的起始位置。

以下内容包含在web中。配置文件:

 <system.webServer>
<handlers>
  <remove name="ExtensionlessUrlHandler-Integrated-4.0" />
  <remove name="OPTIONSVerbHandler" />
  <remove name="TRACEVerbHandler" />
  <add name="ExtensionlessUrlHandler-Integrated-4.0" path="*." verb="*" type="System.Web.Handlers.TransferRequestHandler" preCondition="integratedMode,runtimeVersionControllerv4.0" />
</handlers>

谢谢!

Angular2: http.get return "No 'Access-Control-Allow

我认为问题是你没有在服务器端配置预飞行请求(对于OPTIONS方法)。

CORS有两种类型的请求:

    <
  • 简单的请求/strong>。这个用例适用于使用HTTP GET、HEAD和POST方法的情况。对于POST方法,只支持以下值的内容类型:text/plain、application/x-www-form-urlencoded和multipart/form-data。
  • <
  • 起飞前的请求/strong>。当"简单请求"用例不适用时,第一个请求(使用HTTP OPTIONS方法)被用来检查在跨域请求的上下文中可以做什么。

添加标头时,从简单请求切换到飞行前请求。因此,在目标请求之前执行OPTIONS请求。

详细信息请参阅本文:

  • http://restlet.com/blog/2015/12/15/understanding-and-using-cors/

将这些行添加到webapiconfig.cs文件

var cors = new EnableCorsAttribute("", "", "*"); 
config.EnableCors(cors);

你可以在ApplicationOAuthProvider.cs中再做一件事,在GrantResourceOwnerCredentials方法中添加这行

context.OwinContext.Response.Headers.Add("Access-Control-Allow-Origin", new[] { "*" });