RSS feed to JSON JavaScript

Many JSON APIs require authentification. What if you simply want to get your latest photos from 500px, without authentificating? Or latest posts from a WordPress site with client-side technology? Well, you could simple use the public RSS feed and convert it into JSON format.

To achieve this conversion from XML to JSON, we will rely on external services. It's also possible to host your own RSS Parser on another server with PHP installed, but I'm not going to cover this. We'll be using Google Feed API which is slighly faster than RSS2JSON.

Let's get straight to the point. To get my latest 5 latest articles from ThemeAvenue, the query looks like this:

https://ajax.googleapis.com/ajax/services/feed/load?v=2.0&q=https://themeavenue.net/author/julienv/feed/

Let's create a re-usable helper functiont to parse the XML feed:

// The helper function to convert XML to JSON
function parseRSS(url, callback) {
	$.ajax({
		url: document.location.protocol + '//ajax.googleapis.com/ajax/services/feed/load?v=2.0&callback=?&q=' + encodeURIComponent(url),
		dataType: 'json',
		success: function (data) {
			callback(data.responseData.feed);
		}
	});
}

Then the function to actually display the 5 latest articles from a WordPress site:

// Get the latest 5 articles from a WordPress site
function showArticles(json) {
	var container = $('#blog-articles').html(''),
		dynamicItems = '';
	$.each(json.entries, function (i, val) {
		dynamicItems += '<li><a href="' + val.link + '">' + val.title + '</a></li>';
		return i < 4;
	});
	container.append(dynamicItems);
}

// Call our function
parseRSS('https://themeavenue.net/author/julienv/feed/', showArticles);

If you know better client-side solutions for getting public feeds from public sites, lemme know in the comments :)