Alternativas a Google Feed API para añadir a tu web artículos de un blog

En el post Google Api hicimos mención a las APIs de Google que permiten acceder a múltiples servicios de forma muy sencilla. Una de las características de Google Feed Api era la posibilidad de integrar artículos publicados en cualquier blog en nuestra web, a modo de tablón de anuncios o sección de últimas noticias.


Desafortunadamente, Google ha decidido dejar de dar soporte a esta funcionalidad (Google Feed API Subject to the Deprecation Policy)

No obstante, existen otras opciones útiles para tal propósito.
En este post voy a hacer especial hincapié en estos tres servicios por su facilidad de uso:

• FeedBurner: es un proveedor de gestión de fuentes web propiedad de Google. Proporciona herramientas de gestión de fuentes web RSS a bloggers, podcasters, y otros publicadores de contenido basado en tecnología web.
• Yahoo Query Language: la plataforma YQL (Yahoo! Query Language) permite consultar, filtrar y combinar datos a través de la web mediante una única interfaz. Utiliza una sintaxis similar a SQL y puede leer información en formato HTML, XML, JSON, RSS, Atom y microformato devolviendo el resultado en formato xml o json.
• Rss to Json online converter: se trata de una api creada por un desarrollador independiente que ofrece documentación en https://rss2json.com/docs con ejemplos funcionando en lenguajes de programación como Javascript, PHP, Ruby o Python.

Feedburner

El servicio FeedBurner permite convertir el Feed (Fuente o Canal web) de cualquier blog en un fragmento de código HTML para integrar en tu página web.
En el post "FeedBurner: como añadir entradas de un blog a tu web, sin plugins y en una línea de código." doy instrucciones precisas para utilizar esta api.
Vas a poder comprobar que el 100% es configuración dando como resultado un línea de código para integrar en tu blog o web.

<script src="https://feeds.feedburner.com/hipertextual/index?format=sigpro" type="text/javascript"></script>

Yahoo Query Language

Este servicio web de uso público presenta pocas limitaciones (Información de uso de esta api) y parece ser una opción válida para la visualización de canales RSS de recursos externos.
Dispone de una consola YQL Console que podemos utilizar para realizar consultas in situ y una guía YQL Guide para obtener más información sobre la creación de consultas.

<script>
  var mycallback = function(data) {
    var entry = data.query.results.rss.channel.item;
    var container = document.getElementById("feed"), date;
 for(var i = 0; i < entry.length; i++){
  dv = document.createElement("div");
  date = new Date(entry[i].pubDate);
  dv.innerHTML = '<a href="' + entry[i].link + '" target="_blank">' + entry[i].title + '</a><br/>' + date.toDateString().substr(4) + '<br/><div class="article">' + entry[i].description.substring(0,600) + '...</div>';
  dv.innerHTML += '<hr/>';
  container.appendChild(dv);
 }
  };
</script>
<div id="feed"></div>
<script src="https://query.yahooapis.com/v1/public/yql?q=select * from xml where url = 'http://feeds.feedburner.com/hipertextual'&format=json&callback=mycallback"></script>

Rss to Json online converter

La web facilita una caja de texto para introducir la url de un feed válido.
A continuación, pulsamos el botón Convert to Json y obtenemos la respuesta del documento en formato json.

<div id="feed"></div>
<script>
(function(){
 var url = "https://hipertextual.com/feed";
 var xhr = createCORSRequest("GET","https://api.rss2json.com/v1/api.json?rss_url="+url);
 if (!xhr) {
   throw new Error('CORS not supported');
 } else {
  xhr.send();
 }
 xhr.onreadystatechange = function() {
  if (xhr.readyState==4 && xhr.status==200) {
   var responseText = xhr.responseText; 
   var result = JSON.parse(responseText);
   var container = document.getElementById("feed"), entry = result.items, date;
   for(var i = 0; i < entry.length; i++){
    dv = document.createElement("div");
    date = new Date(entry[i].pubDate);
    dv.innerHTML = '<a href="' + entry[i].link + '" target="_blank">' + entry[i].title + '</a><br/>' + date.toDateString().substr(4) + '<br/><div class="article">' + entry[i].content.substring(0,600) + '...</div>';
    dv.innerHTML += '<hr/>';
    container.appendChild(dv);
   }
  }
 }
})();
function createCORSRequest(method, url) {
    var xhr = new XMLHttpRequest();
    if ("withCredentials" in xhr) {
        xhr.open(method, url, true);
    } else if (typeof XDomainRequest != "undefined") {
        xhr = new XDomainRequest();
        xhr.open(method, url);
    } else {
        xhr = null;
    }
    return xhr;
}
</script>

Escribimos este fragmento de código dentro del cuerpo de nuestro documento html y sustituimos la url 'https://www.tecnoblog.guru/feeds/posts/default' por la de nuestro feed. También podemos modificar el número de entradas a mostrar representado entry.length por un número entero.

Éste es el resultado final:

Jose Maria Acuña Morgado - Desarrollador Web