asp.net - 使用 jQuery/asp.net WebApi 时的奇怪行为

Question

我有 2 个 Web API 项目:

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

现状

• Api1-UI可以从自己的API的ValuesController查询数据

• 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 Controller 方法:

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

问题

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

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

感谢您的帮助/建议

Answer 1

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

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

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

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

• 在 IIS 中定义此 header
• 使用如下所示的 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);
    }
}

在 Controller 操作上使用属性

[AllowCrossSiteJson]
public Result Get(int id)
{
   //return appropriate result
}