YUI和json数据

时间:2012-12-15 13:02:27

标签: jsonp yui

我一直在尝试使用YUI库,并且基于以下内容而遇到以下代码: http://yuilibrary.com/yui/docs/jsonp/index.html

我已经存储了一些localhost json数据,它确实有效,文件名是data.json,数据如下:

[
   {
      "created_at":"Wed Nov 28 23:13:00 +0000 2012",
      "id":273927502659981312,
      "id_str":"273927502659981312",
      "text":"Get INTO this Season 5 promo for Drag Race - before Viacom sics their copyright-nazis on me.  It's sickening.... http:\/\/t.co\/a6Ld4mKN",
      "source":"\u003ca href=\"http:\/\/www.facebook.com\/twitter\" rel=\"nofollow\"\u003eFacebook\u003c\/a\u003e",
      "truncated":false,
      "in_reply_to_status_id":null,
      "in_reply_to_status_id_str":null,
      "in_reply_to_user_id":null,
      "in_reply_to_user_id_str":null,
      "in_reply_to_screen_name":null,
      "user":{
         "id":8394862,
         "id_str":"8394862",
         "name":"mralexgray",
         "screen_name":"mralexgray",
         "location":"NYC",
         "url":"http:\/\/mrgray.com",
         "description":"Fierceness Incarnate",
         "protected":false,
         "followers_count":129,
         "friends_count":385,
         "listed_count":0,
         "created_at":"Fri Aug 24 01:00:57 +0000 2007",
         "favourites_count":7,
         "utc_offset":-18000,
         "time_zone":"Quito",
         "geo_enabled":true,
         "verified":false,
         "statuses_count":147,
         "lang":"en",
         "contributors_enabled":false,
         "is_translator":false,
         "profile_background_color":"53777A",
         "profile_background_image_url":"http:\/\/a0.twimg.com\/profile_background_images\/88810365\/x86b7f9c12df0fa38ce1a4f29b759706.png",
         "profile_background_image_url_https":"https:\/\/si0.twimg.com\/profile_background_images\/88810365\/x86b7f9c12df0fa38ce1a4f29b759706.png",
         "profile_background_tile":false,
         "profile_image_url":"http:\/\/a0.twimg.com\/profile_images\/2563994027\/2ls5b34rje2nrkqriw2i_normal.png",
         "profile_image_url_https":"https:\/\/si0.twimg.com\/profile_images\/2563994027\/2ls5b34rje2nrkqriw2i_normal.png",
         "profile_link_color":"C02942",
         "profile_sidebar_border_color":"542437",
         "profile_sidebar_fill_color":"ECD078",
         "profile_text_color":"D95B43",
         "profile_use_background_image":true,
         "default_profile":false,
         "default_profile_image":false,
         "following":null,
         "follow_request_sent":null,
         "notifications":null
      },
      "geo":null,
      "coordinates":null,
      "place":null,
      "contributors":null,
      "retweet_count":0,
      "entities":{
         "hashtags":[

         ],
         "urls":[
            {
               "url":"http:\/\/t.co\/a6Ld4mKN",
               "expanded_url":"http:\/\/fb.me\/1IJWfEnth",
               "display_url":"fb.me\/1IJWfEnth",
               "indices":[
                  113,
                  133
               ]
            }
         ],
         "user_mentions":[

         ]
      },
      "favorited":false,
      "retweeted":false,
      "possibly_sensitive":false
   }
]

然后我有这个简单的html文件,其代码如下:

<!DOCTYPE html>
<html>
<head>
<script src="http://yui.yahooapis.com/3.8.0/build/yui/yui-min.js"></script>
<script>
// Create a new YUI instance and populate it with the required modules.
YUI().use('jsonp', 'jsonp-url', 'node' , function (Y) {
    // JSONP is available and ready for use. Add implementation
    // code here.
    var url = "http://localhost/yui/data.json?callback={callback}";

    function handleJSONP(response) {
    // response is a JavaScript object. No parsing necessary
    console.log(response);
    Y.one('#output').setHTML(response.outputHTML);
}
Y.jsonp(url, handleJSONP);
});
</script>
</head>
<body>
<div id="output"></div>
</body>
</html>

控制台没有输出,div标签没有输出,有人知道为什么吗?

1 个答案:

答案 0 :(得分:1)

您要求的网址是文件data.json,服务器将使用文件内容回复该文件。您需要的是对由读取名为“callback”的查询参数的服务器代码处理的URL发出请求,并使用“{callback}({content of data.json})回复”;。

例如,您可以使用响应foo.bar.baz([{"created_at":…<the rest of data.json>…]);编写一个getData.php来处理对“http://localhost/yui/getData.php?callback = foo.bar.baz”的请求。

如果访问数据的页面与数据位于同一个域中,则使用Y.io()+ Y.JSON.parse()而不是Y.jsonp()。