使用 jQuery 无法理解 JSONP答案

【问题标题】：Trouble understanding JSONP with jQuery使用 jQuery 无法理解 JSONP
【发布时间】：2013-09-25 21:52:45
【问题描述】：

如果我希望从远程服务器获取数据，那么 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”的数据类型，在 DOM 中插入一个脚本标签，然后浏览器会下载并执行脚本。如果是的话，jQuery有没有创建函数jQuery1234567890，其实现是把参数传给success函数？

(3) 我的理解正确吗（我认为不正确）？

谢谢，

保罗

【问题讨论】：

嗨，保罗，请read up on JSONP

标签： javascript ajax jquery jsonp

【解决方案1】：

(1) 应用程序是否正确地完成了它所拥有的功能？

是的，这是正确的 JSONP 格式

(2) jQuery / JSONP 实际上为我们做了什么？

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

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

(3) 我的理解正确吗（我认为不正确）？

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

【讨论】：

【解决方案2】：

来自ajax 文档的jsonp 选项：

覆盖jsonp中的回调函数名要求。在 “回调=？” url 中查询字符串的一部分。所以 {jsonp:'onJSONPLoad'} 会导致 'onJSONPLoad=?'传递给服务器。

所以使用jsonp: 'callback' 会覆盖callback 和callback，基本上什么都不做。

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

【讨论】：