让 JSONP 工作答案

【问题标题】：Get JSONPto work让 JSONP 工作
【发布时间】：2013-02-09 20:46:16
【问题描述】：

我正在尝试从具有跨域支持的 php 服务器访问数据。因此，当我使用 dataType 尝试 $.ajax 时：'jsonp' 我在控制台中出现错误：Uncaught SyntaxError: Unexpected token 该文件被解释为 javascript 文件，请求失败。您是否有在没有此错误的情况下获取数据的想法。

$.ajax({
    url : 'http://domaine.com/json.php',
    contentType: "application/json; charset=utf-8",
    dataType : 'jsonp',
    success : function(data){
        console.log(data);
        // no enter in this callback
    },
    complete: function(data1, data2, data3){
        // no data from file.js
    }
});

【问题讨论】：

标签： javascript jquery ajax

【解决方案1】：

您需要将?callback=? 添加到请求中，以便评估正确的回调。不过，它可能不叫callback。您需要从域中找出它的名称。

如果域（和浏览器）支持CORS，你甚至不需要使用 JSONP。您可以使用普通请求。

【讨论】：

jQuery 应该为 JSONP 请求自动添加 callback=?
If the domain supports CORS。我会添加和if the browser supports CORS，因为仅域支持它是不够的。

【解决方案2】：

首先确保您的 PHP 脚本支持 JSONP。识别需要传递的查询字符串参数，以便脚本返回 JSONP。然后在浏览器中直接在地址栏中输入以下地址进行测试：

http://domain.com/json.php?callback=abc

您应该会看到以下内容：

abc({ ... some JSON here ... })

如果您的 PHP 脚本需要不同的名称参数，您可能需要调整 callback 名称参数。如果您看到以下输出（{ ... some JSON here ... } 未包含在您的 javascript 函数中），则可能是这种情况

一旦你确定你有一个返回 JSONP 的有效 PHP 脚本，你就可以使用它：

$.ajax({
    url : 'http://domain.com/json.php',
    jsonp: 'callback',
    dataType : 'jsonp',
    success : function(data){
        console.log(data);
        // no enter in this callback
    },
    complete: function(data1, data2, data3){
        // no data from file.js
    }
});

注意事项：

我已经使用jsonp: 'callback' 参数指定了回调
我已经去掉了contentType: 'application/json' 参数，因为jQuery 的JSONP 实现使用了script 标签，它不允许你设置任何请求头。

【讨论】：