2

我有 2 个 Web API 项目：

  • Api1 是 JavaScript 前端的测试环境，但有一个 API 后端（默认的 ValuesController），也用于测试。
  • Api2 是“真正的”后端，实验性 JavaScript UI 应该从中提取数据。对于测试，我在这里也使用默认的 ValuesController，因为，我希望有相同的输出。

现状

  • Api1-UI可以从自己API的ValuesController中查询Data

  • Api2 返回正确的数据（在 Firefox 和 Fiddler 中测试）

编码

JavaScript 客户端：

    var _load = function (url) {
        $.ajax({
            url: url,
            method: 'GET',
            accepts: "application/json; charset=utf-8",
            success: function (data) {
                alert("Success: " + data);
            },
            error: function (data) {
                alert("Error :" + data);                  
            }
        });
    };

WebApi 控制器方法：

    public IEnumerable<string> Get()
    {
        return new string[] { "value1", "value2" };
    }

问题

实验前端的 JavaScript UI 无法显示，甚至无法接收来自 API 2 的数据，根据 Fiddler 的说法，这些数据是正确发送的。

我的第一个想法是，我使用了错误的方法，但我尝试了 $.getJSON， $.ajax.但我总是以错误告终。它只是说statusText="Error" 我不明白，为什么它可以显示来自自己的 ApiController 的数据，但不能显示来自“外部”的数据......

感谢您的任何帮助/建议

4

1 回答 1

2

您似乎正在使用 ajax 从不同域 Y 访问来自 X 的数据。这似乎是一个经典的跨域访问问题。

您需要在响应标头中将Access-Control-Allow-Origin设置为值“*”。

 Response.Headers.Add("Access-Control-Allow-Origin", "*")

有多种方法可以解决这个问题

  • 在 IIS 中定义此标头
  • 使用如下所示的 actionfilter 属性

过滤器属性

public class AllowCrossSiteJsonAttribute : ActionFilterAttribute
{
    public override void OnActionExecuted(HttpActionExecutedContext actionExecutedContext)
    {
        if (actionExecutedContext.Response != null)
            actionExecutedContext.Response.Headers.Add("Access-Control-Allow-Origin", "*");

        base.OnActionExecuted(actionExecutedContext);
    }
}

在控制器动作上使用属性

[AllowCrossSiteJson]
public Result Get(int id)
{
   //return appropriate result
}
于 2012-12-31T19:12:18.797 回答