I have a simple script to fetch images from a sub-reddit:
The only issue is that it's pulling the low res thumbs instead of the high res image.
fetch('https://www.reddit.com/r/RoomPorn.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,
})))
.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);
}
Is it possible to pull the high res instead?
try:
fetch('https://www.reddit.com/r/RoomPorn.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.preview.images[0].source.url,
})))
btw post.data.url should be the high res image link from original source.