How to add WP API and JS featured image attachment

I would like to fetch the image from the wordpress rest api – I have the following code:
HTML:

<div class=”post-item”>
<div id=”posts”>Loading posts…
</div>

Ajax script:

<script type=”text/javascript”>
$(document).ready(function () {
$.ajax({
type: ‘GET’,
url: ‘https://mysite.io/blog/wp-json/wp/v2/posts?_embed&per_page=3’,

success: function (data) {
var posts_html = ”;
$.each(data, function (index, post) {

posts_html += ‘<div class=”post-item-image”>’;
posts_html += ‘<a href=”‘ + post.source_url + ‘”></a>’;
posts_html += ‘<img src=”‘ + + ‘”</div>’;
posts_html += ‘<div class=”post-item-header”>’;
posts_html += ‘<span class=”date”>’ + post.date + ‘</span>’;
posts_html += ‘<span class=”user”>’;
posts_html += ‘<a href=”‘ + post.link +'”>’;
posts_html += ‘<img src=”https://mysite.io/images/users/mysite-1548344709.jpg”>Mysites</a></span></div>’;
posts_html += ‘<div class=”post-item-body”>’;
posts_html += ‘<a href=”‘ + post.link + ‘” style=”text-decoration: underline;”> ‘+ post.title.rendered + ‘</a>’;
posts_html += ‘<div class=”post-short-text”> ‘ + post.excerpt.rendered + ‘</div></div>’;
});
$(‘#posts’).html(posts_html);
},
error: function (request, status, error) {
alert(error);
}
});
});
</script>

The problem is with wp:featuredmedia… this line:

posts_html += ‘<a href=”‘ + post.source_url + ‘”></a>’;

I tried also tried, but no luck so far

posts_html += ‘<a href=”‘ + post.embed[“wp:featuredmedia”][0].media_details.sizes.full.source_url + ‘”></a>’;

Any advices?

Read more here:: How to add WP API and JS featured image attachment

Leave a Reply

Your email address will not be published. Required fields are marked *