This sketch is for two really simple RSS readers.
One with php and one with javascript.

RSS or Really Simple Syndication is an text based format for publishing news and information. Being text makes it easy to manipulate with your language of choice. I like php and javascript so I’m using php and javascript for this example.

Download my code for these examples

Files included in this example
Files included in this example

First lets look at the php example:

If you open reader.php, you’ll see two functions:

One is a php environment test that checks out your php instance to make sure the functions  using are turned on.
Some hosting companies disable some of these extensions. If you don’t have direct control over the server environment, its always good to do a little probing to make sure things are going to work as expected. It also has a constant at the top  of the page which will disable the test. Once you’ve run this code on your server successfully, there is no need to waste CPU cycles on this test with every page load.

The second function is the rss reader. Lets looks at the feed data so we can understand what is going on here.

Example RSS2.0 feed data:

<xml>
<rss>

<channel>
<item>
<title>Welcome to my blog</title>
<link>http://127.0.0.1/my-blog</link>
<description>A simple example from my blog</description>
</item>

<channel>
</rss>

With SimpleXML, if I want the title from the first post your code would look something like this:

$strData = file_get_contents(‘http://www.127.0.0.1/rss);
$oXml = simple_xml_load_string($strData);
$title = $oXml->channel->item[0]->title;

PHP allows urls to be loaded with any of the file functions as if they are a file on the local filesystem. As such, I can use file_get_contents() to load the data from the url into the string. (This depends on PHP’s ‘allow_url_fopen’  setting, which must be enabled.)

SimpleXML is doing all the hard work. Its going to turn that string of xml in to a set of nested objects which will allow us to programmaticly get at the data in the xml document without having to build a complicated custom string parser.

In the example, all operations with SimpleXML are enclosed in a try-catch block. This is because SimpleXML will throw exceptions the XML is not formed correctly(missing open or close tag, including reserve characters where there shouldn’t be any, ect…) , or if you try to access an element that does not exist.

You’ll also notice from the example that third parameter of ‘simplexml_load_string’. By giving the function ‘LIBXML_NOCDATA’, SimpleXML will automatically convert any <![CDATA] blocks it encounters into strings. This sort of block is used to safely enclose characters that would otherwise be reserved by the xml format without breaking the XML format. Without that option, our feed will return an empty SimpleXML object every time it encounters a <![CDATA] block.

That is all you need to read XML with PHP.

One note: Most servers send XML as ‘UTF-8’ instead of simple ASCII text. If your feed reads some UTF-8 text and tries to  display it as ASCII text without properly converting it first, you may notice artifacts in the text that don’t make sense. These kinds of issues can be fixed with PHP’s multi-byte string functions at the expense of added complexity to the feed reader code.

This is not ‘production’ code.

The php example is not really production code. The PHP process is blocked while waiting for the feed to be read. It won’t continue loading the page until the feed is loaded or the connection between your server and the feed server times out.  A workaround to this is to load the feed and cache it on the server as a file or in memory with a tool like memcache. In most cases this scales well and mitigates the dependency on the other site but does not eliminate the problem.

Reading feeds with Javascript:

A javascript example from scratch would be a lot more complicated that this php example so I’m using Jean-Francois Hovinne’s jQuery plug-in, jFeed.

This implementation has the added bonus of dealing well with other character sets like UTF-8.
The files included in the example code:

  • jquery.js – The core of the jQuery javascript library
  • jquery.jfeed.pack.js – A mini-fied version of the jFeed plug-in
  • reader.js – A simple reader which works just like the php reader, except with javascript.
  • proxy.php – Built on Jean’s example with an extra security check.

In this case, the page will load completely before the jFeed library tries to load the feed. jFeed will use a XMLHttpRequest to load the feed data and jquery’s DOM function to parse the data giving us access to the data elements similar to SimpleXML in php.

Once the feed is loaded, it then uses jQuery’s DOM function to add the content to the page. The user will notice some lag between the page loading and the feed loading, but the feed won’t slow down the rest of the page as it did with the php example. Caching could also be used here with a quick php script to speed things up a bit.

Javascript does have limitations. You won’t be able to read a feed from another domain, which is why Jean-Francois included the ‘proxy.php’ script. This script loads the feed and presents it to the javascript as if it came from the same domain. He says, “don’t use this in production” and I would agree. I made on little change to his script, adding a check to make sure the request is coming from local host and not some external site using us as generic proxy which should make it a little safer to use. Having something like this on your server also opens your domain to XSS attacks.

Javascript Example Code

To read the feed, include the required javascript file in your documents head (which are included in the sample code):

<html>
<head>

<script type=”text/javascript” src=”jquery/jquery.js”></script>
<script type=”text/javascript” src=”jquery/jquery.jfeed.pack.js”></script>
<script type=”text/javascript” src=”jquery/reader.js”></script>

Add a div tag place holder for where you would like your rss feed to appear

<div id=”feedReplace”></div>

Add this just above the closing body tag.

<script type=”text/javascript”>getFeed(‘#feedReplace’, ‘http://yoururl.com/rssfeed’,5);</script>

When the page loads, the javascript will load the rss, parse it, format it and append it into the page at the location specified. You can also specify how many items it should show. The example above shows the top 5 items.


Which approach is better?

If the feed data is a featured item of your site it may make more sense to use php because you can be sure the content will load. If the feed is just extra on a larger site, javascript makes a lot of sense because it doesn’t bog down the site while feed is loading.

Tags

Verified by MonsterInsights