从reddit获取高分辨率图像

时间:2017-04-12 23:51:24

标签: javascript json api reddit

我试图通过新近度从subreddit获取hi res图像。我可以拉缩略图,但无法弄清楚如何拉出真正的高分辨率图像。

这是我的代码:

fetch('https://www.reddit.com/r/cats.json')
  .then(res => res.json())
  .then(res => res.data.children)
  .then(res => res.map(post => ({
    author: post.data.author,
    link: post.data.url,
    img: post.data.thumbnail,
    title: post.data.title
  })))
  .then(res => res.map(render))
  .then(res => console.log(res))

const app = document.querySelector('#app');

const render = post => {
  const node = document.createElement('div');
  node.innerHTML = `
      <a href="${post.link}">
        <img src="${post.img}"/>
      </a>`;
  app.appendChild(node);
}

&安培;这是我的fiddle

有什么想法吗?

1 个答案:

答案 0 :(得分:2)

看起来你需要更换你的href和img src

fetch('https://www.reddit.com/r/cats.json')
.then(res => res.json())
.then(res => res.data.children)
.then(res => res.map(post => ({
  author: post.data.author,
  link: post.data.url,
  img: post.data.thumbnail,
  title: post.data.title
})))
.then(res => res.map(render))
.then(res => console.log(res))

const app = document.querySelector('#app');
const render = post => {
const node = document.createElement('div');
 node.innerHTML = `
  <a href="${post.img}">
    <img src="${post.link}"/>
  </a>`;
app.appendChild(node);
}

小提琴:https://jsfiddle.net/qt7ktv4L/2/