28

在最新的 beta 2 版本中，我在获取跨域 POST 请求以访问 Api 控制器时遇到了很多麻烦。

Chrome（和其他浏览器）吐槽：

OPTIONS http://api.hybridwebapp.com/api/values 400 (Bad Request)
POST http://api.hybridwebapp.com/api/values 404 (Not Found)

它可能与此问题有关，但我已经应用了该解决方法和其他几个修复程序，例如此处的 web.config 添加

我已经为此苦恼了一段时间，所以我创建了一个解决方案来准确地重现该问题。

加载 Web 应用程序将有 2 个按钮，一个用于 GET，一个用于 POST，响应将显示在按钮旁边。GET 工作。无法让 POST 成功返回。

在此处输入图像描述

我可以从 Fiddler 那里得到原因的提示，但这没有任何意义，因为如果您查看响应，它确实在 Access-Controll-Allow-Origin 标头中包含域：

在此处输入图像描述

解决方案中有一个名为“ConfigurationScreenshots”的文件夹，其中包含一些 IIS 配置（网站绑定）和项目属性配置的屏幕截图，以便尽可能轻松地帮助我 :)

编辑：不要忘记将此条目添加到主机文件（%SystemRoot%\system32\drivers\etc）：

 127.0.0.1     hybridwebapp.com  api.hybridwebapp.com

**状态：** 似乎某些浏览器（例如 Chrome）允许我继续 POST，而不管 OPTIONS 响应中的错误消息如何（而其他浏览器（例如 Firefox）则不允许）。但我认为这还没有解决。

查看它具有的 OPTIONS 请求的 Fidler 屏幕截图

访问控制允许来源：http ://hybridwebapp.com

然而错误：

来源http://hybridwebapp.com是不允许的

这是完全矛盾的，就好像它忽略了标题一样。

4

5 回答 5

24

好的，我克服了这一点。这一定是我遇到过的最奇怪的问题。以下是如何“解决”它：

  1. 像往常一样继续生活，直到突然出现对这个域的 OPTIONS 请求开始返回 200 OK（而不是 400 Bad Request）并且 POST 永远不会发生（或者至少看起来它没有发生，因为浏览器吞下了它）
  2. 意识到 Fiddler 的 OPTIONS 响应神秘地包含“Access-Control-Allow-XXX”的重复项。
  3. 尝试从 web.config 中删除以下语句，即使您清楚地记得尝试修复之前的问题但它不起作用：

删除这个：

    <httpProtocol>
       <customHeaders>
         <remove name="X-Powered-By" />
         <add name="Access-Control-Allow-Origin" value="http://mydomain.com" />
         <add name="Access-Control-Allow-Headers" value="Accept, Content-Type, Origin" />
         <add name="Access-Control-Allow-Methods" value="GET, PUT, POST, DELETE, OPTIONS" />
       </customHeaders>
    </httpProtocol>

因为你已经有了这个：

 var enableCorsAttribute = new EnableCorsAttribute("http://mydomain.com",
                                                   "Origin, Content-Type, Accept",
                                                   "GET, PUT, POST, DELETE, OPTIONS");
        config.EnableCors(enableCorsAttribute);

道德：你只需要一个。

于 2013-07-23T01:22:58.253 回答
12

如果您使用 OAuth 授权 。请求不直接转到 web api。您需要为该端点启用 OWIN CORS 支持。

我在我的网站上的做法：安装 owin cors

Install-Package Microsoft.Owin.Cors

注意：请不要使用：Install-Package Microsoft.AspNet.WebApi.Cors

在文件 Startup.Auth.cs

 //add this line
            app.UseCors(Microsoft.Owin.Cors.CorsOptions.AllowAll);

            // Enable the application to use bearer tokens to authenticate users
            app.UseOAuthBearerTokens(OAuthOptions);
于 2014-12-15T17:34:13.220 回答
3

我有一个 MVC 控制器（不是 ApiController），但我提出的解决方案可能对其他人有所帮助。为了允许跨域访问/data/xlsx控制器上的 POST 操作 ()，我实施了 2 个操作：

  1. 用于飞行前检查
  2. 对于帖子

如果您没有 HttpOptions 操作，那么您会在飞行前检查中得到 404。

代码：

[HttpOptions]
public ActionResult Xlsx()
{
    // Catches and authorises pre-flight requests for /data/xlsx from remote domains
    Response.AddHeader("Access-Control-Allow-Origin", "*");
    Response.AddHeader("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
    Response.AddHeader("Access-Control-Allow-Methods", "GET, PUT, POST, DELETE, OPTIONS");
    return null;
}

[HttpPost]
public ActionResult Xlsx(string data, string name)
{
    Xlsx(); // Add CORS headers

    /* ... implementation here ... */
}

我已经在 IE 11、Chrome、FireFox 中对其进行了测试。

于 2015-06-01T13:10:44.117 回答
2

将此添加到 ConfigureOAuth 中的 startup.cs 文件中

app.UseCors(Microsoft.Owin.Cors.CorsOptions.AllowAll);

于 2016-02-05T10:14:03.750 回答
0

尝试在您的响应标头中添加以下代码：

Response.AddHeader("Access-Control-Allow-Origin", "*");
于 2013-07-23T02:19:42.627 回答