Internet se está cargando de toneladas de grandes APIs abiertas y gratuitas, estando a disposición de todos para usarlas de muchas formas y con bastante sencillez. Pero, si intentamos consumirlas directamente desde JavaScript, nos encontraremos con un serio problema, ya que por sus mismas políticas de seguridad no permite el consumo a través de otros dominios (Cross-Domain).
Desde mi penúltimo cuatrimestre de Maestría en Tecnologías Web tuve un proyecto en el cual necesitaba consumir ciertos servicios que solamente se ofrecían con JSON, pero quería consumirlos únicamente con JavaScript, con jQuery era posible obtener los JSON Cross-Domain usando getJSON mediante JSONP para aquellos servicios que tenían implementado un Callback, pero para mi sorpresa, hay algunos servicios como la API de Foursquare que no tienen este soporte, para esto tendremos que usar algo como un Proxy.
La idea de un proxy es usar un lenguaje del lado del servidor (en este caso, PHP) para consumir la API antes de que se mande la información al navegador, solucionando los problemas del cross-domain. En todo internet podremos encontrar miles de códigos para hacer un proxy, que la mayoría de las veces resulta ser un dolor de cabeza implementarlos. Entre horas de navegar, me encontré con el post de David Vogelee que en una simple línea de PHP logra crear este proxy. Lo que tienes que hacer es Copiar-Pegar la siguiente línea de código en un archivo y guárdalo como “proxy.php”.
<?PHP echo file_get_contents(urldecode($_GET['request'])); ?>
El script es bastante sencillo, simplemente regresa el contenido de lo que sea que hayamos solicitado por medio del parámetro enviado. En el caso que mencionamos de Foursquare, es necesario crear la URL que vamos a enviar para acceder a la API, escapando los caracteres para la codificación de la URL, para luego solicitar al proxy la URL que buscamos. Usando jQuery debe verse muy semejante a esto:
var request = 'http://api.foursquare.com/v1/venues.json?geolat=20.6774&geolong=-101.3487';
$.getJSON('proxy.php?request=' + escape(request) , function(data) {
//tu código aquí
});
Esto debería hacerlo, pero cuidado, este proxy no tiene ningún tipo de seguridad aplicada, así que alguien podría usarlo para acceder a todo tipo de cosas en tu servidor si no tienes cuidado. Puedes agregarle seguridad al script, aparte de asegurarte que solamente se pueda accesar únicamente desde tu propio dominio ó forzar a que solamente se hagan peticiones específicas de las APIs que quieres consultar. Toma tus precauciones, este es solamente un punto para un inicio rápido :D.
Enjoy this Life!!
alert(“hello”);
@Carlos hahaha… Hello!