如何使用 JSON 从 Reddit API 中提取 url 数据

Posted 2023-03-15

【中文标题】如何使用 JSON 从 Reddit API 中提取 url 数据

【英文标题】：How to extract url data from Reddit API using JSON

【发布时间】：2012-01-01 17:30:43

【问题描述】：

我正在尝试从 subreddit 提要中提取图片发布 URL，并在我的页面上呈现 <img> 元素。

一段时间以来，我一直试图将 jQuery Docs 中的 .getJSON() Flickr example 拼凑在一起，但我一无所获。

有问题的代码：

$.getJSON('http://www.reddit.com/r/pics.json', function (data) 
  $.each(data.children, function (i, item) 
    $('<img/>').attr("src", url).appendTo("#images");
  );
);

在正文中，我有元素：div#images

我知道我需要使用 JSONP，但不确定如何使用。有人能指出我正确的方向吗？

【参考方案1】：

您使用了错误的网址。使用这个：

$.getJSON("http://www.reddit.com/r/pics/.json?jsonp=?", function(data)  
    // Do whatever you want with it.. 
);

编辑：基于您在 cmets 中的 fiddle 的工作示例。

$.getJSON("http://www.reddit.com/r/pics/.json?jsonp=?", function(data)  
    $.each(data.data.children, function(i,item)
        $("<img/>").attr("src", item.data.url).appendTo("#images");
    );
);

您应该使用data.data.children 而不是data.children

【讨论】：

@ZachL 我试着运行你的小提琴，它也不起作用。从数据变量中提取我想要的内容没有问题。我的函数甚至从未被调用过。

@ZachL 它似乎在 Firefox 中运行，但在 OSX 10.8.4 上的 Chrome 中运行。

@Talon876 Glad you sorted it out（问题是广告拦截。）

【参考方案2】：

迷路的网友：

fetch("http://www.reddit.com/r/pics/.json")
  .then(r => r.json()).then((r) => 
     r.data.children.forEach((i) => 
       try
         document.body.appendChild(Object.assign(document.createElement("img"),src: i.data.thumbnail))
        catch (error)console.log(error.message)
 ))