jQuery getJSON在本地工作，但不能跨域
我search了FOREVER，不能拿出一个明确的答案来解决我的问题。 所以在这里。 我有一个JSON文件（我去jsonlintvalidation，并说它很好），看起来像这样（修改了一些信息）：
[{ "position":"1", "category":"A", "title":"Title to first story", "description":"The first story." }, { "position":"2", "category":"B", "title":"Title to second story", "description":"The second story" }, { "position":"3", "category":"B", "title":"Title to third story", "description":"The third story" } ] 我使用jQuery来parsing，并使用这个函数放在一个HTML页面：
$.getJSON('page.json', function(data) { var items = []; $.each(data.reponse, function(item, i) { items.push('<li id="' + i.position + '">' + i.title + ' - ' + i.description + '</li>'); }); $('<ul/>', { 'class': 'my-new-list', html: items.join('') }).appendTo('body'); });
它完美的作品！ 现在出现了我的问题，JSON文件将不会在本地托pipe，事实上将托pipe在一个单独的域。 所以我修改了我的代码如下（读一读后）希望得到它的工作：
$.getJSON('http://www.otherdomain.com/page.json?format=json&callback=?', function(data) { var items = []; $.each(data.reponse, function(item, i) { items.push('<li id="' + i.position + '">' + i.title + ' - ' + i.description + '</li>'); }); $('<ul/>', { 'class': 'my-new-list', html: items.join('') }).appendTo('body'); });
通过添加“callback”行，我停止了一个“无法加载资源”的错误。 但是，什么都没有发生。 这就像我添加的function甚至不在那里。 我试图把所有的东西全部拿出来，并添加一个简单的“警报（数据）”，但这甚至没有触发。 我究竟做错了什么？ 一个很大的问题是，我100％仅限于HTML和JavaScript的工作（而不是我的select）。 感谢您的帮助！
编辑好了，我没有能力为其他服务器dynamic添加任何东西到JSON文件。 所以我通过硬编码json（小样本）函数来修改：
storyData( [{ "position":"1", "category":"A", "title":"Title to first story", "description":"The first story." } ])
现在一切正常！ 感谢所有的帮助！
您需要查看JSONP 。
本质上，当您尝试从另一个域加载JSON时，它会失败，因为存在无法跨越的域边界。 为了避免这种情况，你必须PAD （P in JSONP）。 填充它本质上是包装在一个函数调用（其中函数名驻留在您的客户端），例如“正常的”JSON响应（例如，getjson.php）：
{foo:'bar'}
JSON与parseJSONcallback成为（说，例如，getjson.php？callback = parseJSON）：
parseJSON({foo:'bar'})
请注意callback中提供的值是如何包装JSON响应的函数的名称。
然后你的客户端会把它传递给parseJSON ，这个函数存在于你的客户端（你定义的）上。 jQuery（和其他的库）通过生成一些“随机”函数，然后通过原始的callback（所有这些都在引擎盖下）发送回来，来为你处理这个问题。
如果您可以控制生成JSON的服务器页面，请实现一个callback方法，以便提供JSON应该如何打包，以便您可以在最后使用它。 （这只有当您处理来自客户端当前页面以外的域的数据时才是必要的）。
UPDATE
要基本解决您遇到的问题，您需要find一种方法将JSON信息传递给JSONP调用。 不知道你的“page.json”是什么语言，这里是它应该包含的伪代码逻辑：
if GET_VARIABLE("callback") is supplied print GET_VARIABLE("callback") and an open parenthesis print normal JSON data print closing parenthesis else print normal JSON data end if
如果你决定硬编码的函数名称，而不是允许它在url中作为“callback”提供，那么你需要记住它。 对于下一个示例，我们假设我们将其命名为MyJSONPCallback
现在，在您的客户端代码中，您可以先行使用：
$.ajax({ url: 'http://anotherdomain.com/page.json?format=json', dataType: 'json', jsonpCallback: 'MyJSONPCallback', // specify the callback name if you're hard-coding it success: function(data){ // we make a successful JSONP call! } });
对于那些使用MVC ActionResult来生成JSONP的人来说，ASP.NET MVC并没有提供JSONP支持，但是很容易添加：
http://nikcodes.com/2012/02/29/an-asp-net-mvc-jsonp-actionresult
浏览器不要让这个工作作为安全措施。 你可以检查出JSONP作为解决这个问题的方法，虽然这是一个巨大的安全风险，因为它依赖于运行你从JSON文本获得的域提供的JavaScript。
我还没有深入研究这个问题，但我相信你的问题涉及到同一个域的政策…你可能想要看看这个： http : //james.padolsey.com/javascript/cross-domain-请求与- jQuery的/
看到这篇文章 – 你必须提供一个有效的JavaScript对象封装在一个函数。
http://en.wikipedia.org/wiki/JSONP
你会想要返回像这样的东西：
parseResponse({"Name": "Cheeso", "Id" : 1823, "Rank": 7})
但是你的服务器端方法需要知道返回，而不仅仅是里面的JSON。 所有jQuery所做的是自动生成一个函数名（ callback参数中的? ），然后评估从服务器返回的“函数”。 服务器用里面包含的JSON创build函数调用。
Brad Christie的回答帮助我快速地让我的代码工作。 我在这里创build一个新的条目，因为它比其他解决scheme简单一点。
以下是我从http：// localhost：5000运行的代码 –
(function() { var api = "http://www.localhost:3000/auget_from_server?format=json"; var request = $.getJSON( api, { secret : 'secret', appId : 'app', emailId : 'abc@gmail.com', async: false, dataType : 'json', }, function(data, result){ $("div.some_div").append(JSON.stringify(data)); }); request.complete(function(d, status){ console.log('Complete the request and got the data - ' + JSON.stringify(d) + '/' + status, filename); }); request.error(function(err){ console.log('Error happened - ', filename); console.log(err); }); request.success(function( data, status, jqXHR ) { $("div.some_div").append(data); }); })();
从http：// localhost：3000 / auget_from_server的位置 ，我返回下面的JSON作为响应（这部分特定于meteor，但它也适用于非meteor服务器） –
this.response.writeHead('200', {'Content-Type': 'application/json', 'Access-Control-Allow-Origin': '*'}); this.response.end(JSON.stringify([{'works_or_not' : 'works', 'name' : 'akaushik', 'application' : 'Qoll', 'message' : 'hello from server', 'currentTime' : dt+''}]));
这在日志中打印以下内容 –
Complete the request and got the data - {"readyState":4,"responseText":"[{\"works_or_not\":\"works\",\"name\":\"akaushik\",\"application\":\"Qoll\",\"message\":\"hello from server\",\"currentTime\":\"Tue Dec 15 2015 23:59:14 GMT-0500 (EST)\"}]","responseJSON":[{"works_or_not":"works","name":"akaushik","application":"Qoll","message":"hello from server","currentTime":"Tue Dec 15 2015 23:59:14 GMT-0500 (EST)"}],"status":200,"statusText":"OK"}/success
