0

我有一个简单的方法，它创建一个对象列表 Team，将其转换为 Json，然后返回它。

public ActionResult Index()
{
    var teams = new List<Team>() {
       new Team{ Name = "Caracas F.C", City = "Caracas", Id = 1},
       new Team{ Name = "Millonarios", City = "Bogota", Id = 2},
       new Team{ Name = "Independiente", City = "Bogota", Id = 3}};

    var jsonData = new { teamsData = teams };
    return Json(jsonData, JsonRequestBehavior.AllowGet);
}

当我去那个网址（http://prototypeteam.apphb.com/，自己检查一下），我可以清楚地看到 Json

{"teamsData":[{"Id":1,"Name":"Caracas FC","City":"Caracas"},{"Id":2,"Name":"Millonarios","City": "波哥大"},{"Id":3,"Name":"Independiente","City":"Bogota"}]}

但是当我尝试使用 JQuery 获取 Json 时，它会返回而没有响应：

self.allTeams = ko.observableArray();
    $.getJSON("http://prototypeteam.apphb.com/", function (data) {
        var mappedTeams = $.map(data.teamsData, function (item) {
            return new TeamViewModel(item);
        });
        self.allTeams(mappedTeams);
});

TeamViewModel = function (data) {
    self = this;
    self.Id = data.Id;
    self.Name = data.Name;
    self.City = data.City;
}

这就是我使用 Mozilla 的 Firebug 所得到的。

在此处输入图像描述

如果有人可以帮助我理解为什么会这样。我不明白为什么我在 URL 上清楚地看到了 Json，但 JQuery 似乎不明白发生了什么。谢谢。

4

1 回答 1

1

你看到的是同源政策。

Javascript 有一个安全措施，你不能从外部 URL 获取内容，你只能从同一个域获取带有 ajax 的文件。

有两个例外：

  1. JSONP。由于 jsonp 并不是真正的 ajax，而是像任何其他脚本标签一样将脚本标签插入 DOM，因此它避免了同源策略。该服务必须支持这一点，并将 json 字符串包装在一个函数中，该函数在脚本加载后执行。

  2. CORS。启用 CORS 标头可让您使用来自其他域的脚本，但同样必须在服务器端进行设置。

还可以选择使用 Yahoo YQL 或 Pipes 之类的服务，但这只是获取内容并将其包装在 JSONP 中或添加 CORS 标头，因此它使用上述两个选项之一。

相同的来源策略适用于任何地方，即使您在 localhost 上运行所有内容并尝试从 Web 获取文件，相同的来源策略也不会允许它，因为 URL 不匹配。

于 2013-07-22T21:34:19.053 回答