带有JSONP的AJAX返回错误回调未定义

Question

这是我的ajax电话.我知道标题是正确的,因为当我直接访问url时它会给我这样的东西:jsonpCallback({"id":"274"})

但是,当我进行ajax调用时 - 它正在说 Uncaught ReferenceError: jsonpCallback is not defined

$.ajax({
    url: 'http://localhost:9000/product/rest/company?' + $('form').serialize(),
    type: 'GET',
    crossDomain: true, // enable this
    dataType: 'jsonp',
    jsonpCallback: 'callback',
    success: function(data) {
        console.log(data);
    },
    error: function(err) {
        console.log(err);
    }
}).then(function(data) {
    console.log(data);
});

我在这次电话会议中做错了什么？

Answer 1

服务器使用错误的回调函数名称返回JSONP资源.

您写道服务器的响应是这样的:

jsonpCallback({"id":"274"})

JSON数据被包装到padding函数中jsonpCallback,该函数的名称与Ajax请求中指定的参数不匹配.它应该是:

callback({"id":"274"})

实际上callback是jsonpCallback在jQuery AJAX调用中作为选项传递的名称

jsonpCallback: 'callback',

编辑生成响应的服务器端脚本以应用适当的回调名称将解决问题.

或者,您可以通过使ajax调用参数与响应中的函数名称匹配来修复"另一方":

jsonpCallback: 'jsonpCallback',

以上是"快速修复".

但是,强烈建议您不要指定自定义回调名称(使用参数jsonpCallback).

相反,让jQuery为每个请求生成一个随机回调名称.

然后,服务器端脚本将解析GET参数,callback并使用为包装JSON数据的回调函数名称传递的名称.

例如,如果您提出以下请求:

http://localhost:9000/product/rest/company?param=123

jQuery会在查询字符串中添加一个参数,如下所示:

http://localhost:9000/product/rest/company?param=123&callback=jQuery1520422276

(它实际上使用更长的回调名称)

服务器应该callback使用作为包装JSON返回数据的填充函数传递的值来解析和构建响应:

jQuery1520422276({"id":"274"})