难以理解带有jQuery的JSONP

Trouble understanding JSONP with jQuery

本文关键字：jQuery JSONP      更新时间：2023-09-26

如果我想从远程服务器获取数据，那么我相信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，其实现是将参数传递给成功函数？

(

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

谢谢

保罗

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

是的，这是正确的 JSONP 格式

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

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

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

(

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

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

来自jsonp选项的ajax文档：

覆盖 jsonp 中的回调函数名称 请求。此值将用于代替 url 中查询字符串的"callback=？"部分。所以 {jsonp：'onJSONPLoad'} 将导致 'onJSONPLoad=？' 传递给 服务器。

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

你看到的其他东西是由jQuery生成的，所以你不必自己做。 您可以简单地像对待jquery中的任何其他ajax请求一样对待此请求，而不必担心jsonp的实现。

相关文章：