jQuery JSON Parse - 意外的令牌错误

时间:2012-01-19 20:57:43

标签: javascript jquery json api

我正在尝试使用Envato API来收集一些带有jQuery的用户统计信息。我将展示一个示例响应JSON:

{
"new-files-from-user":[
    {
    "thumbnail":"http://3.s3.envato.com/files/60560.jpg",
    "tags":"",
    "user":"collis",
    "url":"http://themeforest.net/item/manilla-photoshop-design/22803",
    "live_preview_url":"http://2.s3.envato.com/files/60561/1_Home.__large_preview.jpg",
    "uploaded_on":"Wed Dec 03 03:32:35 +1100 2008",
    "cost":"10.00",
    "item":"Manilla Photoshop Design",
    "sales":"294",
    "rating":"4",
    "id":"22803"
    },
    {
    "thumbnail":"http://2.s3.envato.com/files/60223.jpg",
    "tags":"clean",
    "user":"collis",
    "url":"http://themeforest.net/item/black-white-simple-theme/22705",
    "live_preview_url":"http://0.s3.envato.com/files/60224/1_home.__large_preview.jpg",
    "uploaded_on":"Tue Dec 02 04:01:12 +1100 2008",
    "cost":"8.00","item":"Black + White Simple Theme",
    "sales":"272","
    rating":"4",
    "id":"22705"
    },
    {
    "thumbnail":"http://1.s3.envato.com/files/44556.jpg",
    "tags":"clean",
    "user":"collis",
    "url":"http://themeforest.net/item/quik-v1-admin-skin/17314",
    "live_preview_url":"http://3.s3.envato.com/files/44557/1_green.__large_preview.jpg",
    "uploaded_on":"Fri Sep 05 07:30:24 +1000 2008","cost":"12.00",
    "item":"Quik v1 Admin Skin",
    "sales":"336",
    "rating":"5",
    "id":"17314"
    },
    {"thumbnail":"http://3.s3.envato.com/files/45212.jpg",
    "tags":"clean",
    "user":"collis",
    "url":"http://themeforest.net/item/freshcorp-business-template/17528",
    "live_preview_url":"http://3.s3.envato.com/files/45213/1_Homepage.__large_preview.jpg",
    "uploaded_on":"Tue Sep 09 06:10:50 +1000 2008",
    "cost":"20.00",
    "item":"FreshCorp - Business Template",
    "sales":"277",
    "rating":"4","id":"17528"
    },
    {"thumbnail":"http://0.s3.envato.com/files/45739.jpg",
    "tags":"clean",
    "user":"collis",
    "url":"http://themeforest.net/item/real-estate-html-template/17732",
    "live_preview_url":"http://0.s3.envato.com/files/45740/1_homepage.__large_preview.jpg",
    "uploaded_on":"Fri Sep 12 14:22:45 +1000 2008",
    "cost":"20.00","item":"Real Estate HTML Template",
    "sales":"175",
    "rating":"4",
    "id":"17732"
    }
]
}

这是我的剧本:

<script type="text/javascript">
//this gets JSON data from an url
$.getJSON("http://marketplace.envato.com/api/edge/new-files-from-user:collins,themeforest.json?callback=?",
//this function gets called when data has been recieved
function(data){
    //parsing JSON data, line by line(like foreach)
    $.each(data['new-items-from-user'], function(i,item){
        //puts all titles in our div
        $("#test").append(item.item+"<br />");
    });
});
</script>
<div id="test"></div>

以下是我在Chrome控制台中获得的内容:'未捕获的SyntaxError:意外的令牌:'(图片http://imgur.com/8qoqO)。

我不确定我的代码中是否有导致此问题的错误,但是这里有一个小问题可以看到结果:http://jsfiddle.net/wkmDj/

谢谢, 马特

3 个答案:

答案 0 :(得分:2)

在JSON响应列表的第二个对象中,属性名称中间有一个换行符:

"sales":"272","
rating":"4",
"id":"22705"

也许这只是一个转录错误。

编辑 - 确定这是一个转录错误。我认为问题在于您正在与之交谈的网站并不能真正理解JSONP。它返回的JSON看起来很好,但是JSONP要求在函数调用中返回JSON。换句话说,响应应该如下:

somefunction({"new-items-from-user":[{ ... }]});

它没有这样做,所以当JSON自身评估时,它构成语法错误,因为JavaScript认为前导{代码块的开头,而不是对象字面值

查看该API的文档,我没有看到任何暗示其旨在用作JSONP服务的内容。看起来他们打算从手机应用程序,网络服务器或类似的东西中使用它,但不能通过JSONP从浏览器中使用JavaScript。

答案 1 :(得分:0)

一个可能的问题,代码有:

data['new-items-from-user']

但数据看起来像这样:

{"new-files-from-user":[]}

答案 2 :(得分:0)

就像@Pointy所说,响应不会被解析为json,而是作为脚本。所以正在执行eval函数。

eval('{"new-files-from-user":[]}');

并且它给出了错误。

如果网址是 http://marketplace.envato.com/api/edge/new-files-from-user:mechabyte,themeforest.json ,则在jsonp的情况下,应该调用作为

http://marketplace.envato.com/api/edge/new-files-from-user:mechabyte,themeforest.json?callback=mycallback

并且响应应该是

mycallback({"new-files-from-user":[]});

如果你有一个功能mycallback

eval('mycallback({"new-files-from-user":[]});');

将起作用

或者如果您没有设置回叫

http://marketplace.envato.com/api/edge/new-files-from-user:mechabyte,themeforest.json?callback=

响应应该是

({"new-files-from-user":[]});

然后

eval('({"new-files-from-user":[]});');

将起作用

在您的情况下,您可以看到每次jQuery设置参数callback时都喜欢

callback=jQuery171009222313176259944_1327017091413

所以答案应该是

jQuery171009222313176259944_1327017091413({"new-files-from-user":[]});

例如:https://twitter.com/statuses/user_timeline/tomhanks.json?callback=myCallback&count=5

但是由于响应是一个json字符串,这将起作用。 (根据同一原产地政策)

$.get("http://marketplace.envato.com/api/v3/new-files-from-user:turkhitbox,themeforest.json?callback=?",
function (data){
   data = $.parseJSON(data);
   console.log(data);
});