JSONP：一种跨域 AJAX 请求方式

引言

如果你尝试向与请求发起方不同的域发送请求，浏览器存在一项策略，不允许你这样做。 有两种主要的技术可以实现这一点：JSONP 或 CORS。 我想分享的示例是关于如何使用 JSONP AJAX 请求。

背景

我们试图与一家服务提供商 (SP) 集成，这家服务提供商完美地补充了我们的服务，以便向我们的客户展示，并获得额外的收益，从而扩展最终的套餐。 这些 SP 拥有自己的公共 Web 服务来发出请求并获取必要的信息，太棒了！！，已经完成了一半的工作 :).

让我们进行异步 AJAX 请求，这样就不会过度加载已经足够繁忙的页面。 于是开始了头疼 :(. 构建请求的 JSON，完成！ 使用 JQuery 发送 AJAX 请求，完成！ 没有返回 JSON，但是打开 Fiddler 却惊喜地发现有响应！！ 如果我能看到响应，为什么它不在我的成功函数中？

我了解了同源策略。

Google 这，Google 那，最终构建了我的 JS 来完成我的任务，现在我分享一个简单的示例。

使用代码

使用以下代码，你将能够从允许回调参数的其他域获取 JSON 响应。

如果你需要使用另一个 JSON 请求，只需将它添加到 data 参数中，就像我在示例文件中注释所示一样。

jQuery.ajax({
        url: URL,
        type: "GET",
        jsonpCallback: "callback",
        contentType: "application/javascript",
        dataType: "JSONP",
        beforeSend: function () {
            //Do your stuff before send, ussually a loading image.
        },
        error: function () {
            //Control the error.
        },
        success: function (data) {
            //Parse the data or do whatever you need.
                }
            }
        }

回调

为了使 JSONP 应用程序工作，它们需要能够指定一个回调参数。 你可以通过附加 ?callback=[function_name] 来指定回调参数，其中 [function_name] 代表要发送 JSON 对象到的 Javascript 函数名。 在 AJAX 请求中，你必须在 JsonCallback 中设置它。

示例调用

http://echo.jsontest.com/Habana/Gropius?callback=callback

响应

callback({"Habana": "Gropius"});

谢谢

http://json-p.org/

http://www.jsontest.com/