即使响应是json,jquery + jsonp也会返回语法错误

时间:2015-03-24 21:35:47

标签: jquery jsonp

为什么会返回语法错误?

http://jsfiddle.net/syng17fv/

jquery.jsonp https://github.com/jaubourg/jquery-jsonp

响应 http://cvrapi.dk/api?search=test&country=dk

$.jsonp({
    url : 'http://cvrapi.dk/api?search=test&country=dk',
    success : function(json){
        console.log('success')
    },
    error : function(){
        console.log('err')
    }
});

更新

这有效

$.ajax({
        type : 'GET',
        dataType : 'jsonp',
        url : '//cvrapi.dk/api?search=test&country=dk',
        success : function(res){

        }
    });

3 个答案:

答案 0 :(得分:4)

您需要添加回调参数。我将在下面解释原因。

JSONP调用在没有回调的情况下无法正常工作。数据加载在脚本标记中,如果代码不是方法调用的形式,结果将只是一个被丢弃的对象,并且永远不会调用成功回调方法。

  

为什么[不使用回调]会返回语法错误?

这就是你的ajax响应在没有回调的情况下的实际情况(例如http://cvrapi.dk/api?search=test&country=dk):

<script> 
{"vat":11618405,"name":"TESTRUP ... (snip)
</script>

当然这个JavaScript中存在语法错误! :)

以下是带回调的ajax响应(例如http://cvrapi.dk/api?search=test&country=dk&callback=callbackFunc):

<script> 
callbackFunc({"vat":11618405,"name":"TESTR ... (snip)
</script>

现在这是有效的JavaScript。在此示例中,$.jsonp调用了callbackFunc(),而且一切都与世界相符。


JSONP的核心元素,或带有填充&#34;的&#34; JSON,如下:

  1. 您网站上定义的回拨功能。
  2. 通过标记对远程API的请求
    • 包含一个特殊的参数,提供回调函数的名称
  3. 回复:
    • 只是Javascript
    • 包括:
      1. 函数调用,您在请求中指定的名称
      2. 该论点是感兴趣的JSON数据
    • 立即执行,就像从您自己的域中调用一样
  4.   

    您和服务器之间的回调安排,结合使用   避免同源限制,实际上是JSONP的全部技巧

    参考:So how does JSONP really work?Wikipedia: JSONP


    像这样更改你的json代码。奇迹般有效。注意&#34;回调&#34;参数已添加。 JSONP期待这一点。这是您编辑过的JSFiddle:http://jsfiddle.net/Drakes/syng17fv/2/

    参考:https://github.com/jaubourg/jquery-jsonp/blob/master/doc/TipsAndTricks.md

    $.jsonp({
        url : '//cvrapi.dk/api?search=test&country=dk&callback=?',
        success : function(json){
            console.log('success')
        },
        error : function(){
            console.log('err')
        }
    });
    

答案 1 :(得分:1)

在分析插​​件后,url = url.replace( /=\?(&|$)/ , "=" + successCallbackName + "$1" );make the jsonp callback的工作效果不够好,所以添加一些函数使其工作,或尝试更改正则表达式以将回调添加到网址。

尝试使用以下代码替换url = url.replace( /=\?(&|$)/ , "=" + successCallbackName + "$1" ); in the plugin

function addCallback(paramName, paramValue, url) {

    if (url.indexOf(paramName + "=") >= 0) {
        var prefix = url.substring(0, url.indexOf(paramName));
        var suffix = url.substring(url.indexOf(paramName));
        suffix = suffix.substring(suffix.indexOf("=") + 1);
        suffix = (suffix.indexOf("&") >= 0) ? suffix.substring(suffix.indexOf("&")) : "";
        url = prefix + paramName + "=" + paramValue + suffix;
    } else {
        if (url.indexOf("?") < 0)
        url += "?" + paramName + "=" + paramValue;
        else
        url += "&" + paramName + "=" + paramValue;
    }
        return url;

}

url = addCallback('callback', successCallbackName, url);

<强> Updated fiddle

答案 2 :(得分:1)

似乎callback选项不起作用。只需使用默认值(_jqjsp

将回调参数添加到网址
url : '//cvrapi.dk/api?search=test&country=dk&callback=_jqjsp',