Question

如果我想从远程服务器获取数据，那么JSONP是我认为的首选工具。但我对我看到的一个例子感到困惑：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script type="text/javascript">

    $(document).ready(function() {

        $.ajax({
            dataType: 'jsonp',
            data: 'p3=c',
            jsonp: 'callback',
            url: 'http://someserver.com/app?p1=a&p2=b',
            success: function (data) {
                console.log("data="+data);

                $.each(data, function (i, r) {
                    console.log("i="+i);
                    console.log("r="+r);
                });
            },
        });
    });

</script>

我可以看到在请求中，添加了一个回调参数，其值为jQuery1234567890。当我查看处理该请求的应用程序时，它从请求中提取回调参数，并使用该括号和相关括号包装要返回的json数据，因此它最终会返回如下内容：

jQuery1234567890([{"x":"100","y":"101"},{"x":"200","y":"201"}])

所以我的第一个问题是：

（1）应用程序是否正确完成了它的工作？

（2）jQuery / JSONP实际为我们做了什么？

我假设jQuery会看到“jsonp”的dataType，在DOM中插入一个脚本标签，然后浏览器会下载并执行脚本。如果这是正确的，jQuery是否创建了函数jQuery1234567890，其实现是将参数传递给成功函数？

（3）我的理解是否正确（我认为不是）？

谢谢，

保

Answer 1

（1）应用程序是否正确完成了它的工作？

是的，这是一个正确的JSONP格式

（2）jQuery / JSONP实际为我们做了什么？

通过在请求中放置&callback=jQuery1234567890来通知需要JSONP的服务器应用程序

我假设jQuery会看到“jsonp”的dataType，在DOM中插入一个脚本标签，然后浏览器会下载并执行脚本。如果这是正确的，jQuery是否创建了函数jQuery1234567890，其实现是将参数传递给成功函数？

（3）我的理解是否正确（我认为不是）？

是的，您的理解是正确的。它创建了一个带有script函数的jQuery1234567890，在加载请求的脚本时调用该函数。正如您所说，参数接收数据并将其传递给$.ajax内部，这会调用success回调

Answer 2

来自ajax选项的jsonp文档：

覆盖jsonp中的回调函数名称请求。将使用此值代替＆＃39;回调＆＃39;在里面＆＃39;回调=＆＃39？; url中查询字符串的一部分。所以 {jsonp：＆＃39; onJSONPLoad＆＃39;}会导致＆＃39; onJSONPLoad =？＆＃39;传递给了服务器

因此，jsonp: 'callback'使用callback覆盖callback，基本上什么都不做。

您看到的其他内容是由jQuery生成的，因此您不必自己动手。您可以像在jquery中的任何其他ajax请求一样处理此请求，而不用担心jsonp的实现。

无法用jQuery理解JSONP

2 个答案: