AJAX Cross-Domain: JSONP + PHP

En ocasiciones nos encontramos con la necesidad de hacer uso de un servicio web o API externo a nuestro sitio a través de AJAX. Por defecto los navegadores tienen una politica que impide realizar peticiones a otro dominio por razones de seguridad.

Para solventar este problema Bob Ippolito en 2005 propuso el uso de una versión modificada de JSON denominada JSONP. A partir de entonces, muchos sitios y servicios han utilizado esta técnica para que se puedan consumir sus APIs desde una aplicación del lado del cliente.

Hasta hace un par de días, personalmente sólo había utilizado esta técnica desde el lado del consumidor, me parecía algo muy útil, pero nunca me había preocupado del lado del servidor, pero hace poco tuve que implementar un servicio web que debería poder ser accedido a través de una aplicación cliente alojado en otro servidor, por lo que tuve que ponerme a enterarme, y os traigo un tutorial con lo que he aprendido, pongo información tanto del lado del servidor (utilizando PHP), como del lado del cliente (utilizando jQuery).

Lado del servidor

Según la documentación de JSONP, se debe permitir que el cliente añada algo de contenido al JSON devuelto, siendo este englobado en paréntesis, básicamente para que lo que se devuelva sea la “ejecución de un función”, que será creada (de la forma que sea) en el cliente, para su ejecución al finalizar la llamada AJAX.

Por lo tanto, la idea básica es, teniendo un servicio web que devuelva un JSON válido, permitir dos nuevos parámetros: uno para representar el formato que diferenciará las llamadas remotas de las realizadas desde nuestra aplicación (si la hubiera) y otro, el nombre de la función a ejecutar en el cliente. Los nombres típicos de estos parámetros son format (con valor jsonp) y callback (o jsoncallback), aunque no es obligatorio.

El código (en PHP), podría ser algo como:


$format = $_REQUEST['format'];
if($format == "json") {
    if(isset($_REQUEST['callback'])) {
        $callback = $_REQUEST['callback'];
        echo "$callback(" . json_encode($json) . ")";
    } else {
        echo "callbackFunction(" . json_encode($json) . ")";
    }
}

De esta manera, si no se indica una función, indicamos una por defecto, otra opción es no permitirlo y devolver error.
el objecto $json sería la representación de lo que se devolvía desde un principio en el servicio web. Como veis, unicamente hay que concatenar el nombre de la función pasada y los paréntesis. Sencillo, no?

Lado del cliente

Posiblemente sea más conocido, además de que hay muchas formas diferentes de hacerlo, pero voy a poner dos ejemplos usando jQuery.

El primero es la versión más simplista utilizando la función getJSON y la segunda, utilizando la función AJAX completa, con una función aparte incluida.


jQuery.getJSON("http://url.com/directorio/fichero.php?param1=valor1&format=json&callback=?, function(data)
    console.log(data);
}");

 

Con lo que tendríamos una llamada a un JSON que ejecuta la función anónima indicada, en este caso tan simple como imprimir por consola, pero hay iría la lógica, tan complidada como lo que se quiera hacer.

La versión extendida, podría ser:


function logicaCliente(data){
    console.log(data);
}
jQuery.ajax({
    "url": "http://url.com/directorio/fichero.php?param1=valor1&format=json",
    "dataType": "jsonp",
    jsonpCallback: 'logicaCliente'
});

 

Existen multiples variantes de la forma de hacer esto, pero espero que aquellos que en algún momento se encontraran, como yo, perdidos, puedan encontrar ayuda en este pequeño tutorial.

Fuentes:

Blog de Bob Ippolito

Use Jquery

jQuery JSONP

Instalar y Configurar XDebug en entornos con Eclipse y Ubuntu

Para poder disponer de un entorno correctamente configurado con XDebug en un entorno de desarrollo basado Ubuntu[*] y Eclipse, se deben realizar una serie de pasos que se describen a continuación

[*]en principio las instrucciones han sido probadas con Ubuntu, pero deberían valer para cualquier distribución basada en Debian

Instalación de Xdebug

Requiere la instalación del paquete pear, para lo cual hay que instalar (en caso de no tenerlo instalado previamente) el paquete especifico:

sudo apt-get install php5-dev php-pear

 

Y a continuación se instala el paquete xdebug desde pear:

sudo pecl install xdebug

Con lo cual tendríamos instalado correctamente Xdebug en nuestra máquina

Configuración de Xdebug en Ubuntu

Una vez instalado, necesitamos configurar  Xdebug para poder trabajar correctamente con el.
Lo primero que hay que haces es buscar donde tenemos la instalación:

find / -name 'xdebug.so' 2> /dev/null

con lo que devuelva, modificamos el php.ini (/etc/php5/apache2), añadiendolo como extension

zend_extension=/ruta/directorio/xdebug.so

Reiniamos el apache

sudo /etc/init.d/apache2 restart

Configuración de Eclipse para trabajar con XDebug

Hay que realizar una serie de pasos para configurar el entorno para depurar correctamente con XDebug

  • Crear ejecutable:
  • Window > Preferences > PHP > PHP Executables > Add y definimos nombre, ruta al ejecutable de inicio (var/www/nombreProyecto/public/index.php) y nombre debugger (xdebug)

  • Definir Debugger:
  • Window > Preferences > PHP > Debug y definimos Xdebug, en como PHP Debugger, en Server dejamos el Default y como PHP Executable el anteriormente definido.

  • Elegir Navegador para ejecución:
  • Window > Preferences > General > Web Browser y buscamos y seleccionamos Firefox o cualquier navegador que tengamos por defecto.

  • Definir el server por defecto:
  • Window > Preferences > PHP > PHP Servers > New y añadimos la configuración del server para que apunte a nuestra aplicación tal y como la tengamos definida (cambiando la url por aquella a la que apunte nuestro server)

  • Crear configuración de lanzamiento:
  • Debug > Debug Configuration > PHP Web Page y le damos nombre, seleccionamos Xdebug como Debugger y seleccionamos la página a lanzar de inicio desde el apartado url de la configuración.

     

Una vez realizado todo el proceso, lanzando el depurador y poniendo puntos de ruptura en nuestro código deberiamos poder depurar sin problemas.

Usando Zend framework en Eclipse

Desde que cambié de trabajo he estado trabajando en un proyecto realizado en PHP usando Zend Framework y aunque yo siempre he estado acostumbrado a Eclipse (tanto en Java como en PHP), en la empresa se trabajaba con NetBeans y he estado intentando adaptarme a este IDE, a su forma de uso.

Después de bastante tiempo usándolo, sigo sin cogerle el gusto a NetBeans, así que me propuse conseguir integrar Zend Framework en eclipse y aunque no he conseguido tener una utilidad como la de crear proyectos y componentes que tiene NetBeans, por lo menos he conseguido tener el autocompletado y para todo lo demás uso la linea de comandos.

Los pasos para conseguirlos son sencillos y se basan en importar la librería de Zend Framework en el eclipse y en el proyecto concreto, de la siguiente manera (suponiendo que ya tenemos Zend framerwork descargado):

  • Incluir el directorio de Zend como librería en el eclipse: para ello, pulsamos sobre Window > Preferences > PHP > PHP Libraries y ahí pulsamos en New… nombramos la librería como queramos y Ok, a continuación nos colocamos sobre el nuevo elemento creado y pulsamos sobre Add External folder… y ahí seleccionamos el directorio en el que tengamos Zend Framework descargado y descomprimido.
  • Incluir la librería de Zend en el proyecto: para ello, nos colocamos sobre el proyecto concreto en la vista de Navigator o Package Explorer y ahí botón derecho > properties > PHP Include Path y ahí pulsamos sobre Add Library > User Library y elegimos la anteriormente incluida en el eclipse y Ok.

Y ya está, se tirará un rato hasta que funciona rápido y bien, pero al cabo de un rato tendremos Zend Framework como librería y podremos usar el autocompletado de clases y métodos, lo que nos será muy útil para realizar nuestros proyectos.

Me he tirado algo de tiempo para encontrar la solución, pero principalmente está sacado (como no) de una entrada en stackoverflow.

How To: Crear un repositorio SVN remoto

Llevaba tiempo queriendo escribir esta entrada sobre como crear un repositorio para el control de versiones usando subversion, principalmente porque es una tarea que hago unas cuantas veces al año y, como toda tarea que no hago constantemente, suelo olvidar como se realizar, teniendo que echar mano de antiguas búsquedas en Google.

En este caso voy a describir los pasos para crear un repositorio en un servidor remoto, que es lo que más habitualmente he tenido que realizar. El entorno de desarrollo es una distribución basada en Debian (Ubuntu en mi caso), aunque posiblemente no diste mucho de las instrucciones para otras distros.

Antes de poder seguir los pasos es necesario tener instalado subversion tanto en la maquina servidora como en local, para lo cual se debe ejecutar lo siguiente:

 sudo apt-get install subversion 

Una vez instalado correctamente subversion, los pasos que hay que seguir para poder ponerlo en marcha son:

  • Crear un directorio en remoto donde se encontrará el repositorio: mkdir repo (pe: en /home/cesar)
  • Crear el repositorio: svnadmin create repo (desde el mismo directorio)
  • Crear el esqueleto del proyecto:
    • Crear el directorio del proyecto: mkdir project
    • Crear los directorios internos habituales: cd projectmkdir trunk branches tags
  • Importar el proyecto por primera vez: svn import project ssh+svn://user@dominio.com/ruta/repos/ -m "Initial import"

Una vez realizados estos pasos, ya se tiene el repositorio inicial y con la estructura creada, ahora nos queda importar el proyecto a un directorio local, para ello se pueden optar por dos soluciones, linea de comandos o a través de un IDE:

A través de la linea de comandos:

 svn checkout svn+ssh://user@dominio.com/ruta/repos /ruta/local 

En el eclipse:
import > SVN > chekout projects from SVN > ssh+svn://cesar@hazmereir.net/ruta/repos/project > trunk > finish

Y con esto ya tendríamos preparado un entorno de desarrollo basado en un servidor de versiones a través del cual podríamos tener un control total sobre el código de la aplicación que estemos creando. Este tipo de entorno suele ser más útil cuando nos encontramos trabajando en equipo, pero me he encontrado muchas ocasiones en las que he utilizado un servidor de versiones para tener más organizado el código o para poder trabajar mejor desde mis diferentes máquinas.

CodeIgniter 2.0.2 Spanish Pack

Estoy empezando a usar CodeIgniter para un proyecto personal y como en principio tenía pensado realizarlo en Español he estado mirando como se podían cargar recursos según el idioma, lo que se puede leer en la documentación oficial.

Una vez estudiado el método de hacerlo, he tenido que ponerme manos a la obra, y una vez realizada una búsqueda en Google y un poco de investigación de las posibilidades, me he dado cuenta que no había una versión actual del paquete de idioma de recursos de CodeIgniter (la versión actual de CodeIgniter es la 2.0.2), así que me he puesto manos a la obra y entre lo que ya había en el paquete anterior (1.7.2), mis (escasos) conocimientos del Inglés y un poco de Google Translate he creado un paquete de idiomas en Español que incluye todos los recursos de este nueva versión.

Os dejo los enlaces a los archivos comprimidos en tar.gz y zip por si alguien quiere usarlos.

CodeIgniter Spanish Pack v2.0.2 [tar.gz]
CodeIgniter Spanish Pack v2.0.2 [zip]

Aporta seguridad a tus aplicaciones PHP con PHPIDS

Si eres desarrollador PHP o has realizado algún proyecto web utilizando éste lenguaje de programación y deseas darle la máxima seguridad a tu aplicación, sería bueno que echaras un vistazo a la herramienta PHPIDS.

Esta herramienta permite detectar y controlar los ataques más clásicos sobre aplicaciones escritas en PHP, se trata básicamente de una capa extra que se añade al código escrito y que permite detectar y solucionar dichos problemas se seguridad.

Los ataques que indica que detecta son: XSS, SQL Injection, header injection, directory traversal, RFE/LFI, DoS y LDAP attacks.

Requiere al menos la versión 5.1.6 de PHP para que se puedan utilizar todas las características de la herramienta.
Es bastante fácil de instalar y se puede configurar al gusto para controlar y realizar acciones específicas, guardar los datos en formatos concretos y demás.

Se puede incluso ver una demo de como trabaja la herramienta, y ya sabes si te gusta descárgala y empieza usarla para dar más seguridad a tus aplicaciones PHP.