Fatal编程技术网
  • javascript/
  • Javascript 使用jQuery发出跨域ajax JSONP请求

Javascript 使用jQuery发出跨域ajax JSONP请求

javascript jquery ajax json

Javascript 使用jQuery发出跨域ajax JSONP请求,javascript,jquery,ajax,json,Javascript,Jquery,Ajax,Json,我想用jquery ajax解析JSON数组数据，代码如下： <!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>Sample</titl

我想用jquery ajax解析JSON数组数据，代码如下：

<!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>Sample</title>
<script type="text/javascript" src="Scripts/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
    var result;
    function jsonparser1() {
        $.ajax({
            type: "GET",
            url: "http://10.211.2.219:8080/SampleWebService/sample.do",
            dataType: "jsonp",
            success: function (xml) {
                alert(xml.data[0].city);
                result = xml.code;
                document.myform.result1.value = result;
            },
        });
    }        
</script>    
</head>
<body>
<p id="details"></p>
<form name="myform">
    <input type="button" name="clickme" value="Click here to show the first name" onclick=jsonparser1() />
    <input type="text" name="result1" readonly="true"/>        
</form>
</body>
</html>
但是我没有得到任何输出…任何人都请帮忙…

您需要使用jquery json parse解析您的xml…即

  var parsed_json = $.parseJSON(xml);
警报（xml.data[0].city）

使用xml.data[“data”][0]。改为使用city

您的JSON数据包含属性
data
，但您正在访问
数据。它是区分大小写的


function jsonparser1() {
    $.ajax({
        type: "GET",
        url: "http://10.211.2.219:8080/SampleWebService/sample.do",
        dataType: "json",
        success: function (xml) {
            alert(xml.Data[0].City);
            result = xml.Code;
            document.myform.result1.value = result;
        },
    });
}        


编辑城市和代码的大小写也不正确。（谢谢@Christopher Kenney）

EDIT2它也应该是json，而不是jsonp（至少在这种情况下）

更新根据您的最新评论，您应该阅读以下答案：Abdul Munim
试试看


alert(xml.Data[0].City)


区分大小写
概念说明
您正在尝试进行跨域AJAX调用吗？也就是说，您的服务不在相同的web应用程序路径中托管？您的web服务必须支持方法注入才能执行JSONP

您的代码看起来不错，如果您的web服务和web应用程序托管在同一个域中，那么它应该可以工作

使用
数据类型执行
$.ajax
时：“jsonp”
意味着jQuery实际上是在向查询URL添加一个新参数

例如，如果您的URL是
http://10.211.2.219:8080/SampleWebService/sample.do
然后jQuery将添加
？回调={some\u random\u dynamic\u generated\u method}

这种方法更像是一种实际附加在
窗口
对象中的代理。这没有什么特别之处，但看起来确实是这样的：


window.some_random_dynamically_generated_method = function(actualJsonpData) {
    //here actually has reference to the success function mentioned with $.ajax
    //so it just calls the success method like this: 
    successCallback(actualJsonData);
}



my_callback_method({your json serialized data});


摘要

您的客户机代码似乎很好。但是，您必须修改服务器代码，以使用随查询字符串一起传递的函数名包装JSON数据。i、 e

如果您已使用查询字符串请求


?callback=my_callback_method


然后，您的服务器必须以如下方式包装响应数据：


window.some_random_dynamically_generated_method = function(actualJsonpData) {
    //here actually has reference to the success function mentioned with $.ajax
    //so it just calls the success method like this: 
    successCallback(actualJsonData);
}



my_callback_method({your json serialized data});



您需要使用ajax跨源插件：


只需添加crossOrigin:true选项


$.ajax({
    crossOrigin: true,
    url: url,
    success: function(data) {
        console.log(data);
    }
});



使用由Yahoo托管的开放公共代理YQL。处理XML和HTML


可能是您的后端没有返回任何内容。发帖！使用JSON.parse解析JSON数据。在success:function（data）{var result=JSON.parse（data）；document…value=result.Code；}中，我在这里为这个问题写了一个答案：–最后一个，支持httpsw如果您尝试直接浏览到URL会发生什么？在浏览器的错误控制台中会出现什么错误？它显示有意外的标记：在JSON数据中。。。但这是在JSON中使用数组的正确方法，对吗？@Christopherkeney:如果我将数据类型设置为“JSON”，则会显示错误。如果我将其设置为“jsonp”，则没有问题。如果我使用json而不是jsonp，则会出现错误：1）XMLHttpRequest无法加载。访问控制不允许原点允许原点。我在这里为这个问题写了一个答案：–最后一个，支持https@AbdulMunim：是否可以在$.ajax的url属性中提及json文件？url属性中支持哪些文件扩展名？是否有任何东西通过填充js回调返回？这就是为什么我在控制台中出现以下错误：
Uncaught SyntaxError:uncontracted token:
？这个错误有一个链接，一旦我点击它就会显示JSON数据。如果我做对了，它会通过第三方代理路由。方便，但通过服务器的通信可能会破坏原始的想法。我添加了相同的想法，但每次都会出现失败的错误。我使用的是jsonp数据类型。它在success函数中吗？因为我在控制台中得到一个错误：
Uncaught SyntaxError:Unexpected token:
，它显示错误函数警报，甚至没有点击成功函数。