所以,我有(事实上我们都有)这个由 Telerik Kendo UI 提供的很酷的 WCF Odata 服务,例如:(已使用工作链接更新)http://demos.telerik.com/kendo-ui/Service/Northwind.svc 。对于测试目的来说这是非常少的。
我想从 JavaScript 调用它并将结果显示为警报。所以,我的代码是:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript">
function button(src1) {
$.getJSON('http://demos.kendoui.com/service/Northwind.svc/Tasks(4)/Start?$format=json',
function(json) {
alert(json.d.Start);
});
}
</script>
</head>
<body>
<form id="form1">
<div><input type="button" onclick="javascript:button();" value="Call WCF Service" /></div>
</form>
</body>
</html>
但仍在 Google Chrome 控制台中,我收到此消息“Access-Control-Allow-Origin 不允许 Origin null”。为什么这样?
UPD:奇怪的是,我在 stackoverflow 上的某个地方发现了这段代码,但是用这个调用而不是我的:
$.getJSON('http://www.panoramio.com/wapi/data/get_photos?v=1&key=dummykey&tag=test&offset=0&length=20&callback=?&minx=-30&miny=0&maxx=0&maxy=150',
function(json) {
alert(json.photos[1].photoUrl);
});
这个有效。为什么剑道没有?
最佳答案
您正在进行跨源调用。出于安全原因,浏览器不直接允许这些操作。跨源调用意味着您正在从另一个域、协议(protocol)或其他端口调用 URL。这意味着如果您的代码位于 http://demos.kendoui.com/yourpage
上,您就不会收到错误。
首先不要只在本地文件系统上运行代码。将其放在网络服务器上。然后你会收到类似的错误(“Access-Control-Allow-Origin 不允许”),但是...
您有几个选择:
如果您可以控制服务器:
- enable cors (=跨源资源共享;发送额外的 header 信息)
- enable jsonP (=带有填充的 json;用回调方法包装 json)
如果您无法控制服务器:
- 使用proxy script (服务器上的脚本获取数据并将其传递)
更新:
为什么它可以与 panoramio url 一起使用?服务器启用了 jsonP。通过输入: callback=?
jquery 知道它应该使用 jsonP 并填写回调。尝试一下并检查 Chrome 开发人员工具中的网络选项卡。您将看到回调参数已填充,并且响应以该函数开始。
关于jquery - 使用jquery从odata wcf服务获取json,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18343453/