Parsing External RSS Feeds with jQuery

If you were like me the first time you try to grab a feed via AJAX from another server you’ll spend quite some time trying to figure out why the hell your script isn’t working when everything is written perfectly. Then you do some research and find out you’re not allowed to use AJAX from server to server due to security issues. Darn it. Well, here is the work around I’ve been using for quite some time, and best of all, it’s only 2 lines of PHP and 1 line of jQuery.

First, create a new file on your server for the PHP code which creates the RSS feed using the XML from the other server. I just put mine in the root and name it rss.php

Next, add this PHP code.

<?php
	header('Content-type: application/xml'); //Changes the format from plain text to XML
	echo file_get_contents($_GET['feed_url']); //Echos the RSS feed from the GET feed address
?>

Below is the jQuery. It grabs the rss.php page which we just created above, and sends the “feed_url” variable with the URL of the feed you want to that page. The “xml” in function(xml){} holds the XML. Inside of that function I did a little alert as an example on how to parse the XML. It’s just like jQuery with HTML, except you need to add “,xml” to your selector as seen below so it knows not select an HTML element and to select an XML element from the newly returned data.

$(function(){
	$.get('/rss.php',{feed_url:'http://kneedeepincode.com/feed/'},function(xml){ //Grab rss.php, enter in the GET feed_url attribute and set it to the URL of the feed you want.
		alert($('item:first title',xml).text()); //Just for example's sake, this will alert you with the latest item in the feed's title
	});
});

This is personally my favorite method as it’s easy and flexible and you can grab as many feeds as you want. No cURL or anything. Just straight up jQuery!

Posted in PHP, Programming, jQuery