jQuery跨域Ajax
我的ajax代码是
$.ajax({ type: 'GET', dataType: "jsonp", processData: false, crossDomain: true, jsonp: false, url: "http://someotherdomain.com/service.svc", success: function (responseData, textStatus, jqXHR) { console.log("in"); }, error: function (responseData, textStatus, errorThrown) { alert('POST failed.'); } });
这是一个跨域的ajax请求。
我得到了正确的请求响应,而用firebug检查我可以看到响应。
这是我在firebug响应中获得的响应以及通过Web浏览器访问此URL时的响应
{"AuthenticateUserResult":"{\"PKPersonId\":1234,\"Salutation\":null,\"FirstName\":\"Miqdad\",\"LastName\":\"Kumar\",\"Designation\":null,\"Profile\":\"\",\"PhotoPath\":\"\/UploadFiles\/\"}"}
但我收到了错误
SyntaxError: invalid label {"AuthenticateUserResult":"{\"PKPersonId\":8970,\"Salutation\
我是否需要使用任何其他方法来使其工作。 我想在phonegap + jquery移动应用程序中实现这一点。
此外,我没有任何访问Web服务的权限
如果我禁用chrome web security,它运行正常
看起来内部JSON结构作为字符串传递。 您将再次使用JSON.parse()将该数据作为对象获取。
try { responseData = JSON.parse(responseData); } catch (e) {}
编辑:尝试以下内容:
$.ajax({ type: 'GET', dataType: "json", url: "http://someotherdomain.com/service.svc", success: function (responseData, textStatus, jqXHR) { console.log("in"); var data = JSON.parse(responseData['AuthenticateUserResult']); console.log(data); }, error: function (responseData, textStatus, errorThrown) { alert('POST failed.'); } });
不幸的是,似乎这个Web服务返回包含另一个JSON的JSON – 内部JSON的解析内容成功。 解决方案很丑,但对我有用。 JSON.parse(...)
尝试转换整个字符串并失败。 假设您总是得到以{"AuthenticateUserResult":
开头的答案{"AuthenticateUserResult":
并且有趣的数据在此之后,请尝试:
$.ajax({ type: 'GET', dataType: "text", crossDomain: true, url: "http://someotherdomain.com/service.svc", success: function (responseData, textStatus, jqXHR) { var authResult = JSON.parse( responseData.replace( '{"AuthenticateUserResult":"', '' ).replace('}"}', '}') ); console.log("in"); }, error: function (responseData, textStatus, errorThrown) { alert('POST failed.'); } });
dataType
必须是text
以防止自动解析您从Web服务接收的格式错误的JSON,这一点非常重要。
基本上,我通过删除最顶部的大括号并键入AuthenticateUserResult
以及前导和尾随引号来消除外部JSON。 结果是一个格式良好的JSON,可以进行解析。
服务器的响应是JSON字符串格式。 如果将setDataType设置为’json’jquery将尝试直接使用它。 您需要将dataType设置为“text”,然后手动解析它。
$.ajax({ type: 'GET', dataType: "text", // You need to use dataType text else it will try to parse it. url: "http://someotherdomain.com/service.svc", success: function (responseData, textStatus, jqXHR) { console.log("in"); var data = JSON.parse(responseData['AuthenticateUserResult']); console.log(data); }, error: function (responseData, textStatus, errorThrown) { alert('POST failed.'); } });
如果您打算使用JSONP
,可以使用getJSON
来实现。 jQuery有JSONP
帮助方法。
$.getJSON( 'http://someotherdomain.com/service.svc&callback=?', function( result ) { console.log(result); });
阅读以下链接
http://api.jquery.com/jQuery.getJSON/
使用.ajax()和JSONP的基本示例?
跨域jsonp的基本方法
这是我的代码中的片段..如果它解决了你的问题..
客户代码:
设置jsonpCallBack:’photos’和dataType:’jsonp’
$('document').ready(function() { var pm_url = 'http://localhost:8080/diztal/rest/login/test_cor?sessionKey=4324234'; $.ajax({ crossDomain: true, url: pm_url, type: 'GET', dataType: 'jsonp', jsonpCallback: 'photos' }); }); function photos (data) { alert(data); $("#twitter_followers").html(data.responseCode); };
服务器端代码(使用Rest Easy)
@Path("/test_cor") @GET @Produces(MediaType.TEXT_PLAIN) public String testCOR(@QueryParam("sessionKey") String sessionKey, @Context HttpServletRequest httpRequest) { ResponseJSON resp = new ResponseJSON (); resp.setResponseCode(sessionKey); resp.setResponseText("Wrong Passcode"); resp.setResponseTypeClass("Login"); Gson gson = new Gson(); return "photos("+gson.toJson(resp)+")"; // CHECK_THIS_LINE }
你只需要使用JSON.parse解析字符串,如下所示:
var json_result = {"AuthenticateUserResult":"{\"PKPersonId\":1234,\"Salutation\":null,\"FirstName\":\"Miqdad\",\"LastName\":\"Kumar\",\"Designation\":null,\"Profile\":\"\",\"PhotoPath\":\"\/UploadFiles\/\"}"}; var parsed = JSON.parse(json_result.AuthenticateUserResult); console.log(parsed);
在这里你会有这样的东西:
Designation null FirstName "Miqdad" LastName "Kumar" PKPersonId 1234 PhotoPath "/UploadFiles/" Profile "" Salutation null
对于请求,不要忘记设置dataType:'jsonp'
并在站点的根目录中添加一个名为crossdomain.xml
并包含:
编辑照顾Sanjay Kumar POST
所以你可以使用jsonpCallback
设置在JSONP中调用的回调函数!
$.Ajax({ jsonpCallback : 'your_function_name', //OR with anonymous function jsonpCallback : function(data) { //do stuff }, ... });
当使用“jsonp”时,你基本上会返回包含在函数调用中的数据,例如
jsonpCallback([{"id":1,"value":"testing"},{"id":2,"value":"test again"}]) where the function/callback name is 'jsonpCallback'.
如果您有权访问服务器,请首先validation响应是否采用正确的"jsonp"
格式
对于来自服务器的这种响应,您需要在ajax调用中指定一些内容,例如
jsonpCallback: "jsonpCallback", in your ajax call
请注意,回调的名称不需要是“ jsonpCallback
”,它只是作为示例选择的名称,但它需要匹配服务器端完成的名称(包装)。
我对你的问题的第一个猜测是来自服务器的响应不是应该的。