JavaScript：在 ASP.NET WebAPI 上的本地主机上的跨站点请求答案

【问题标题】：JavaScript: cross site request on localhost on ASP.NET WebAPIJavaScript：在 ASP.NET WebAPI 上的本地主机上的跨站点请求
【发布时间】：2014-11-29 13:42:27
【问题描述】：

我有一个正在运行的 ASP.NET WebAPI 应用程序

http://localhost:13057/worldwind

我正在运行另一个 ASP.NET MVC5 应用程序

http://localhost:2425/worldwind

当 MVC5 应用程序上的客户端代码尝试以下 AJAX 调用时：

 $.ajax(http://localhost:13057/worldwind/images, 
            {                
                type: "GET",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                error: Utilities.Logger.displayAjaxError,
                success: this.onImagesRetrieved,
                context: this               
            });

我得到错误：

XMLHttpRequest cannot load http://localhost:13057/worldwind/api/images. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:2425' is therefore not allowed access.

如果我将 AJAX 请求中的 dataType 更改为 jsonp，即使出现错误也会调用 WebAPI

jQuery18209344927002675831_1412452833242 未被调用

我如何让这个东西工作？

【问题讨论】：

最简单的方法是将两者都托管在 same 域（主机名 + 端口）上。但如果它们要在生产中单独托管，也许可以考虑 CORS/XDR。如果您收到“{JSONP 回调} 未被调用”的警告，那么很可能JSONP 响应无效；也许它仍然返回正常的 JSON 或者使用了错误的函数名？无论如何，查看原始响应将清除该问题。
感谢您的回复。理想情况下，我希望两个应用程序分别托管。将研究 CORS/XDR。现在，我收到一个错误，即未调用 jsonp 回调。我应该对我的服务进行更改以支持 jsonp 吗？
我不相信使用 ASP.NET Web API 可以做到标准，但也许有自定义 MediaTypeFormatters 和/或处理 IHttpHandler 包装器。（也就是说，这是一个已解决的问题，有几种在线可用的实现。）

标签： ajax asp.net-mvc cross-domain jsonp asp.net-web-api2

【解决方案1】：

我最终按照here 的说明启用了 CORS

这涉及 3 个步骤（好吧，在解决其他 NuGet 升级问题之后）：

添加 NuGet 包 Microsoft.AspNet.WebApi.Cors

在 WebApiCconfig.Register 静态方法中添加以下行：

    var cors = new EnableCorsAttribute("http://locahost:2425", "*", "*");
    config.EnableCors(cors);

重建和运行。

【讨论】：

【解决方案2】：

如果你的 .jsp 放入了

http://localhost:13057/MySite/JSONP.jsp

像这样使用你的脚本部分：

<script type = "text/javascript" src="http://localhost:13057/MySite/JSONP.jsp?callback=jsonHandler"></script>

希望对你有所帮助。

【讨论】：