Este pequeño ejercicio lo voy a dejar aquí subido por que después de haber creado una APP como lector rss-feed para android, me he acordado de que «alguien» me había preguntado una manera sencilla de crear un lector de este estilo utilizando PHP. Crearlo utilizando solo PHP se volvería un poco cutre, por eso decidí utilizar PHP y Ajax para hacerlo un poco más interactivo, versátil y ligero.
En el ejemplo que nos ocupa, se mostrará un lector de RSS donde se carga el canal que se seleccione en un desplegable sobre la página web sin necesidad de tener que recargar. Esto lo conseguiremos mediante unas cuantas líneas de AJAX y PHP.
El lector RSS se va a componer de dos archivos, uno que será la página en la que se seleccionará y mostrará el contenido del canal seleccionado y otro para obtener todos los valores del canal seleccionado.
Se puede ver el ejemplo en funcionamiento en el siguiente enlace.
Crear un lector RSS – FEED con Ajax y PHP
showrss.php
Cuando un usuario selecciona una canal en la lista desplegable que se muestra, una función llamada ‘showRSS ()’ se ejecuta. La función es activada por el evento ‘onchange‘
La función showRSS () hace lo siguiente:
- Comprueba si se ha seleccionado una fuente.
- Crea un objeto XMLHttpRequest.
- Crea la función a ejecutar cuando el servidor está listo
- Envía la solicitud en el Aviso al servidor con un parámetro (q) que se añade a la URL (con el contenido de la lista desplegable)
<title>Lector RSS - PHP - Ajax</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script> function showRSS(str) { if (str.length==0) { document.getElementById("rssOutput").innerHTML=""; return; } //El objeto XMLHttpRequest se usa para intercambiar datos con un servidor. if (window.XMLHttpRequest) { // código para IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else { // código para IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } //Cuando se envía una petición a un servidor y queremos realizar algunas acciones sobre la base de la respuesta se //utiliza el evento onreadystatechange y se dispara cada vez que cambia el readyState. xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { // getElementById sirve para obtener el elemento con el ID especificado: document.getElementById("rssOutput").innerHTML=xmlhttp.responseText; //Si la respuesta del servidor no es XML, se utiliza la propiedad responseText. //La propiedad responseText devuelve la respuesta como una cadena. } } // Para enviar una petición a un servidor, se utiliza el open() y send() métodos del objeto XMLHttpRequest: //GET es más simple y más rápido que POST, y se puede utilizar en la mayoría de los casos. //Aun que POST es mucho más rápido y seguro xmlhttp.open("GET","getrss.php?q="+str,true); xmlhttp.send(); } </script> </head> <body> <form> <select onchange="showRSS(this.value)"> <option value="">Selecciona un RSS-feed:</option> <option value="herbalist">Herbalist GrowShop</option> <option value="elpais">elpais</option> <option value="eldiario">eldiario</option> </select> </form> <br> <div id="rssOutput">El RSS-feed será listado aquí ...</div> </body>
getrss.php
Cuando una solicitud de una fuente RSS se envía desde el JavaScript, ocurre lo siguiente:
- Comprobar el canal seleccionado.
- Crear un objeto nuevo XML DOM.
- Coloca el documento RSS en los elementos de la variable XML, extracto y de salida del elemento de canal.
- Extraer la salida de los elementos de los elementos item.
<?php //obtener el parámetro q de la URL $q=$_GET["q"]; //se carga el canal seleccionado en el formulario if($q=="herbalist") { $xml=("http://www.herbalistgrow.es/modules/feeder/rss.php"); } elseif($q=="elpais") { $xml=("http://ep00.epimg.net/rss/tags/ultimas_noticias.xml"); } elseif($q="eldiario"){ $xml=("http://www.eldiario.es/rss/"); } // Representa un documento HTML o XML en su totalidad; Sirve Como Raíz del Árbol de documento. $xmlDoc = new DOMDocument(); $xmlDoc->load($xml); //obtener elementos desde "<channel>" $channel=$xmlDoc->getElementsByTagName('channel')->item(0); $channel_title = $channel->getElementsByTagName('title')->item(0)->childNodes->item(0)->nodeValue; $channel_link = $channel->getElementsByTagName('link')->item(0)->childNodes->item(0)->nodeValue; $channel_desc = $channel->getElementsByTagName('description')->item(0)->childNodes->item(0)->nodeValue; $channel_url = $channel->getElementsByTagName('url')->item(0)->childNodes->item(0)->nodeValue; //mostrar la salida de los elementos del "<channel>" echo("</p>"); echo("<br>"); echo("<p><a href='" . $channel_link . "'>" . $channel_title . "</a>"); echo("<br>"); echo($channel_desc . "</p>"); echo("<hr>"); //obtener la entrada y salida de los elementos "<item>" $x=$xmlDoc->getElementsByTagName('item'); for ($i=0; $i<=3; $i++) { $item_title=$x->item($i)->getElementsByTagName('title')->item(0)->childNodes->item(0)->nodeValue; $item_link=$x->item($i)->getElementsByTagName('link')->item(0)->childNodes->item(0)->nodeValue; $item_desc=$x->item($i)->getElementsByTagName('description')->item(0)->childNodes->item(0)->nodeValue; echo ("<p><a href='" . $item_link . "'>" . $item_title . "</a>"); echo ("<br>"); echo ($item_desc . "</p>"); } ?>
6 Comentarios
Me viene genial. Me apunto tu página. saludos.
Espero ver tus comentarios más a menudo :). Salu2.
interesante y útil. Gracias por compartirlo, me lo guardo
Gracias a ti por la visita. Me alegra que te haya sido útil. Salu2.
Me ha gustado el lector, aun que no consigo que se vean las imágenes de algunos canales.
¿a qué se puede deber?. Gracias por compartir
Échale un vistazo al código fuente del canal y a la variable $channel_url del lector. Comprueba que el nombre es correcto (es lo que se me ocurre así de buenas a primeras). Salu2 y gracias por la visita.