AJAX RSS Display

Using JavaScript only without any server-side script, you want to be able to display a RSS feed? Easy! (But it took me 3 hours of hacking.) First setup a web page like this (write your own HTML, this is only an example):

<html>
<head>
<title>JavaScript RSS Reader</title>
<script language="JavaScript" xsrc="rss.js"
mce_src="rss.js" ></script>
</head>
<body>
<h1>JavaScript RSS Reader</h1>
<div id="rss"></div>
<script language="JavaScript">
displayRSS("http://www.domain.com/rssfeed");
</script>
</body>

You can download the rss.js script.

Voilà! No need for any server-side processing of the RSS feeds. You can magically display RSS feeds everywhere. Of course, this will only work with recent browsers.

Why is this useful? I found that the typical PHP-based solutions to parse RSS feeds were a pain to setup.

The downside? The RSS feed is read each time the page is displayed. However, the browser does a lot of the work (XML parsing) so I suspect this is an acceptable solution.

Any limitations? The only limitation is that the RSS feed must come from the same domain name as the HTML page because of the JavaScript security model. You can get around this limitation by making local copies of the RSS feeds using simple tools like wget and cron. I really wish the security model could be relaxed as it would make JavaScript much more potent.

Here’s an excellent reference on AJAX: using the XMLHttpRequest object. It is a bit technical, and it is not complete, but it is the most concise and useful reference I found.

Update: Stephen Downes reported this script in his newsletter.

Update 2: Please do not load the script from my server, make a copy! You are stealing my bandwidth! If so many people keep doing it, I will have to get nasty.

Update 3: No, this will not work with Atom. Nor will it work with all versions of RSS. You need to hack the JavaScript if you want to support anything but RSS 2.0. I have nothing against Atom, I just didn’t need to support it.

18 thoughts on “AJAX RSS Display”

  1. Here is a PHP based AJAX RSS Feed Reader which display RSS Feeds in draggable auto-arranging AJAX Feed Windows which self-update using AJAX as RSS Feed is updated.

  2. how does one use wget so that fresh rss files are loaded to my site /server. I was thinking of using Pbwiki to keep rss files and use similar script as yours !!

  3. Finally got it working, but had some trouble with the HTML code. My browser didn’t like the ” double-quotes, and the missing gave some strange formatting results.

  4. Please ensure, that your script takes care about the namespaces. If you don’t do it, feeds like them from citeUlike.org won’t be accessible.

    If you would like to have a look at my additions, hit me via mail!

    Cheers!

  5. Fails for me because of the “xsrc” and “mce_src” attributes on the script tag. Using “src” does work.

    What are these attributes (“xsrc” and “mce_src”)?
    I can’t find any documentation on them and using them causes pages to fail validation.
    Thanks

  6. Please ensure, that your script takes care about the namespaces. If you don’t do it, feeds like them from citeUlike.org won’t be accessible.info

  7. Dear Daniel,

    I just came across your RSS feed tutorial. Now, for days I’ve been driving myself crazy on how to complete the RSS News feed code. I’m a Graphic and Web Designer, but my Ajax skills aren’t strong. So I need help on this particular feature. Is this code you have accurate? I used it and got no results. If you can, do u think u can e-mail a code that u would use to get live RSS News feeds? If u could I would really appreciate that!

    Thanks

  8. I just came across your RSS feed tutorial. Now, for days I’ve been driving myself crazy on how to complete the RSS News feed code. but my Ajax skills aren’t strong. So I need help on this particular feature. Is this code you have accurate? I used it and got no results. If you can, do u think u can e-mail a code that u would use to get live RSS News feeds?

  9. hELLO, I need help on this particular feature. Is this code you have accurate? I used it and got no results. If you can, do u think u can e-mail a code that u would use to get live RSS News feeds? If u could I would really appreciate that!

Leave a Reply

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