Spanish (Español) translation by Eva Collados Pascual (you can also view the original English article)
En la parte introductoria de esta serie, dimos un repaso a la arquitectura de REST y a como ésta nos podía ayudar en la creación de mejores aplicaciones. Cuando después exploramos la historia de las REST APIs en WordPress y nos introdujimos en la última actualización: WP REST API plugin. Configuramos un espacio de trabajo básico para realizar pruebas con el plugin, lo cual incluía la instalación del mismo y un cliente HTTP para los envíos de solicitudes o para observar las respuestas del servidor.
En esta parte de la serie, crearemos un protocolo básico de autentificación en el servidor que enviará solicitudes identificadas para realizar diferentes tareas a través de la REST API.
Para ser más específicos, en esta parte haremos lo siguiente:
- veremos varios métodos de autentificación disponibles cuando usamos el plugin REST API.
- configuraremos una autentificación básica en el servidor
- enviaremos una solicitud autentificada usando Postman
- enviaremos una solicitud autentificada usando el framework JavaScript
- enviaremos un solicitud autentificada usando la línea de comandos
- enviaremos una solicitud autentificada usando WP HTTP API
Pero echemos un vistazo antes a la propia autentificación.
¿Qué es Autentificación?
En su definición básica, la autentificación es el proceso de determinar la identidad de una persona.
Según la Webopedia:
El proceso de identificar un individuo, normalmente basándonos en una contraseña. En los sistemas de seguridad, la autentificación es distinta de la autorización, ésta última se define como el proceso de dar a los individuos acceso a objetos del sistema basándonos en su identidad. La autentificación simplemente se asegura de que el individuo es quien dice ser, pero no dice nada respecto a los derechos de acceso del mismo.
Cuando hablamos de WP REST API, un usuario con suficientes privilegios puede realizar varias tareas CRUD como pueda ser la creación de una entrada, recoger todos los usuarios del sitio o revocar los derechos de un usuario. Pero por todas estas acciones uno debe comprobar su identidad en el servidor, y aquí es donde la autentificación realiza su parte.
Sin una autentificación adecuada, sería muy fácil para cualquiera con ambiciones maliciosas destrozar el sitio, así que la autentificación proporciona una necesaria capa de seguridad para restringir los derechos de un usuario y las acciones que pueda ejecutar.
Identificación Con la WP REST API
La WP REST API proporciona tres opciones para la identificación, cada una de ellas con un propósito específico. Estas opciones son:
- identificación básica
- Identificación OAuth
- Cookie de identificación
Ahora mismo, el método nativo de identificación con WordPress es la identificación a través de cookies. Así es como WordPress determina la identidad de un usuario y qué acciones puede realizar. Para usar los otros dos métodos de identificación enumerados arriba con la WP REST API, necesitamos instalar sus plugins respectivos proporcionados por el equipo de la WP REST API en GitHub. Afortunadamente, estos dos métodos también serán incluidos en el núcleo con el propio plugin REST API.
La identificación básica es el tipo más básico de identificación vía HTTP, en la que las credenciales de acceso son enviadas junto con los encabezados de la solicitud.
Cómo Funciona la Identificación Básica
En la identificación básica, el cliente solicita una URL que requiere identificación. El servidor solicita al cliente (o agente de usuario) que se identifique mediante el envío de un código 401-Non Authorized. El cliente, como respuesta, envía de vuelta la misma solicitud pero con las credenciales a modo de cadena codificada con base64 con el formato username:password
. Esta cadena es enviada en el campo del header Authorization
de la siguiente forma:
Authorization: Basic {base64_encode(username:password)}
Así que si el nombre de usuario en tutsplus
y la contraseña es 123456
, el siguiente campo en el header será enviado junto con la siguiente solicitud:
Authorization: Basic dHV0c3BsdXM6MTIzNDU2
Dado que la cadena codificada en base64 puede ser descodificada con facilidad, es un método muy inseguro para emplearse en una red abierta. Por tanto éste método sólo debería usarse para depuración y desarrollo cuando la conexión entre el servidor y el cliente es de confianza.
Instalar el Plugin
Como hemos mencionado arriba, el plugin está disponible en el GitHub del equipo WP REST API. Así que todo lo que necesitamos es clonarlo en nuestro plugins
directorio y activarlo
Dirígete a tu directorio /wp-content/plugins/
y clona el plugin para el cual podrías necesitar privilegios sudo
para ejecutar el comando. Para obtenerlos, haz lo siguiente:
$ sudo git clone https://github.com/WP-API/Basic-Auth.git
El terminal te preguntará por una contraseña. Introduce tu contraseña y deja que el repositorio sea duplicado en un directorio.
Tras duplicar el plugin, actívalo dirigiéndote a tu panel de Administración en WP. Puedes usar ahora el método de identificación básica HTTP con el plugin REST API.
Enviar un Solicitud Identificada Usando Postman
La mayoría de clientes HTTP admiten el envío de solicitudes por medio del método nativo de identificación básica, y lo mismo vale para Postman para Chrome. Para enviar una solicitud identificada, dirígete a la pestaña Authorization situada bajo la barra de direcciones.

Ahora selecciona la opción Auth Basic del menú desplegable. Te pedirá que introduzcas tu nombre de usuario y contraseña. Después de introducir tus credenciales, pulsa el botón Update request.

Tras actualizar la opción de identificación, verás un cambio en la pestaña Headers, y ahora incluye un campo de header que contiene el nombre de usuario y contraseña en forma de cadena codificada.

En esto consiste simplemente la configuración básica con Postman. Ahora puedes enviar una solicitud de prueba como por ejemplo, eliminar una entrada, lo que requiere identificación:
DELETE http://dev-server/wp-json/wp/v2/posts/52
En donde dev-server
es la ruta a tu servidor de desarrollo.
Si todo va bien, el servidor te devolverá un código de estado 200 OK, indicando que la entrada con el id 52
ha sido eliminada:

No te preocupes de la solicitud que acabamos de hacer—la veremos con más detalle en futuras partes de esta serie.
Enviar una Solicitud con Identificación Desde la Línea de Comandos
Podemos usar la línea de comandos para enviar una solicitud con identificación empleando este método. Considera el siguiente equivalente curl
de la solicitud de arriba:
curl --request DELETE -I --user admin:password http://dev-server/wp-json/wp/v2/posts/52
La siguiente respuesta sería enviada por el servidor, indicando que todo está correcto:
HTTP/1.1 200 OK Date: Fri, 28 Aug 2015 20:02:43 GMT Server: Apache/2.4.6 (CentOS) PHP/5.6.12 X-Powered-By: PHP/5.6.12 Set-Cookie: PHPSESSID=k0rg6mcbsie7ufvoav219lqre0; path=/ Expires: Thu, 19 Nov 1981 08:52:00 GMT Cache-Control: no-store, no-cache, must-revalidate, post-check=0, pre-check=0 Pragma: no-cache X-Content-Type-Options: nosniff Link: <http://localserver/wordpress-api/demo-post-28/>; rel="alternate"; type=text/html Allow: GET, POST, PUT, PATCH, DELETE Transfer-Encoding: chunked Content-Type: application/json; charset=UTF-8
La opción --request
especifica el método de solicitud que se va ha emplear, en nuestro caso es DELETE
. También puedes usar -X
como alternativa a la opción --request
.
La opción -I
solo procesa los headers HTTP enviados por el servidor. La alternativa a -I
es la opción --head.
Enviar Solicitudes Identificadas Usando JavaScript
Si estás usando un framework JavaScript del lado del cliente, como jQuery, para interactuar de forma remota con un sitio WordPress teniendo activada WP API, puedes enviar los headers de identificación con una solicitud AJAX. Considera la siguiente solicitud DELETE
enviada a través de jQuery.ajax()
método:
$.ajax({ url: 'http://dev-server/wp-json/wp/v2/posts/52', method: 'DELETE', crossDomain: true, beforeSend: function ( xhr ) { xhr.setRequestHeader( 'Authorization', 'Basic ' + Base64.encode( 'username:password' ) ); }, success: function( data, txtStatus, xhr ) { console.log( data ); console.log( xhr.status ); } });
En donde Base64
es un objeto usado para codificar y decodificar una cadena base64. Se define de la siguiente forma, antes que el método de llamada jQuery.ajax()
de arriba:
var Base64={_keyStr:"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=",encode:function(e){var t="";var n,r,i,s,o,u,a;var f=0;e=Base64._utf8_encode(e);while(f<e.length){n=e.charCodeAt(f++);r=e.charCodeAt(f++);i=e.charCodeAt(f++);s=n>>2;o=(n&3)<<4|r>>4;u=(r&15)<<2|i>>6;a=i&63;if(isNaN(r)){u=a=64}else if(isNaN(i)){a=64}t=t+this._keyStr.charAt(s)+this._keyStr.charAt(o)+this._keyStr.charAt(u)+this._keyStr.charAt(a)}return t},decode:function(e){var t="";var n,r,i;var s,o,u,a;var f=0;e=e.replace(/[^A-Za-z0-9\+\/\=]/g,"");while(f<e.length){s=this._keyStr.indexOf(e.charAt(f++));o=this._keyStr.indexOf(e.charAt(f++));u=this._keyStr.indexOf(e.charAt(f++));a=this._keyStr.indexOf(e.charAt(f++));n=s<<2|o>>4;r=(o&15)<<4|u>>2;i=(u&3)<<6|a;t=t+String.fromCharCode(n);if(u!=64){t=t+String.fromCharCode(r)}if(a!=64){t=t+String.fromCharCode(i)}}t=Base64._utf8_decode(t);return t},_utf8_encode:function(e){e=e.replace(/\r\n/g,"\n");var t="";for(var n=0;n<e.length;n++){var r=e.charCodeAt(n);if(r<128){t+=String.fromCharCode(r)}else if(r>127&&r<2048){t+=String.fromCharCode(r>>6|192);t+=String.fromCharCode(r&63|128)}else{t+=String.fromCharCode(r>>12|224);t+=String.fromCharCode(r>>6&63|128);t+=String.fromCharCode(r&63|128)}}return t},_utf8_decode:function(e){var t="";var n=0;var r=c1=c2=0;while(n<e.length){r=e.charCodeAt(n);if(r<128){t+=String.fromCharCode(r);n++}else if(r>191&&r<224){c2=e.charCodeAt(n+1);t+=String.fromCharCode((r&31)<<6|c2&63);n+=2}else{c2=e.charCodeAt(n+1);c3=e.charCodeAt(n+2);t+=String.fromCharCode((r&15)<<12|(c2&63)<<6|c3&63);n+=3}}return t}};
Lo encontré en StackOverflow, y es una forma de codificar y descodificar una cadena base64 válida en todos los navegadores.
En la solicitud anterior, hemos establecido el header Authorization
usando el método setRequestHeader()
del objeto xhr
enviado al método beforeSend()
como argumento.
Además en la solicitud anterior, los headers Access-Control-Allow-Headers
deberían permitir el campo Authorization
en el servidor. Esto se puede activar añadiendo la siguiente línea de código en tu archivo .htaccess de WordPress.
Header always set Access-Control-Allow-Headers Authorization Header always set
Cuando la solicitud anterior esté completada, devolverá una respuesta en la consola de tu navegador tal y como se muestra en la imagen de inferior:

El código de estatus de respuesta 200 devuelto por el servidor nos muestra que la entrada con el id 52
ha sido eliminada con éxito.
Enviar un Solicitud Identificada Usando WP HTTP API
Si estás interactuándo de forma remota con otro sitio WordPress desde tu propia instalación WordPress, la forma más apropiada de enviar una solicitud HTTP es mediante WP HTTP API.
Considera el siguiente código que envía una solicitud DELETE
a otra instalación WordPress con WP REST API y la identificación básica habilitada:
$wp_request_headers = array( 'Authorization' => 'Basic ' . base64_encode( 'username:password' ) ); $wp_request_url = 'http://localserver/wordpress-api/wp-json/wp/v2/posts/52'; $wp_delete_post_response = wp_remote_request( $wp_request_url, array( 'method' => 'DELETE', 'headers' => $wp_request_headers ) ); echo wp_remote_retrieve_response_code( $wp_delete_post_response ) . ' ' . wp_remote_retrieve_response_message( $wp_delete_post_response );
Aquí hemos usado la función wp_remote_request()
la cual acepta dos argumentos:
-
$url
: la URL de la solicitud -
$args
: una cadena de argumentos adicionales a enviar
El método $method
defininido en la cadena $args
es DELETE
, y debería escribirse siempre con mayúsculas. La cadena $headers
toma pares de valores clave para todos los campos del header que serán pasados con la solicitud. Hemos pasado la clave Authorization
con una cadena para el nombre de usuario y la contraseña codificados en base64 como valor.
La respuesta se guardará en la variable $wp_delete_post_response
, que podemos utilizar con las funciones wp_remote_retrieve_response_code()
y wp_remote_retrieve_response_message()
. Estas dos funciones son funciones de ayuda en la WP HTTP API, y extraen respectivamente los códigos de estado y los mensajes de estado de la respuesta.
Si el post es eliminado con éxito por la solicitud anterior, el siguiente texto será devuelto:
200 OK
Esto es todo con respecto al método de identificación básica admitido por WP REST API. Usaremos el mismo método de identificación en partes futuras para recuperar, crear, o modificar los datos debido a su simplicidad, a menos que se indique lo contrario.
Conclusión
En la parte actual de esta serie, hemos visto de cerca el método básico de identificación HTTP admitido por WP REST API. En cualquier caso, no se debería usar en entornos de producción en vivo ya que la cadena codificada con base64 podrían ser descodificada con facilidad y tus credenciales podrían caer en malas manos.
Tras haber configurado y probado con éxito el método de identificación básico HTTP, todos estamos preparados para dar ir más lejos y configurar una forma de identificación más sofisticada—el método OAuth 1.0a. Haremos esto en la siguiente parte de la serie, así que ¡manténte a la escucha!
Subscribe below and we’ll send you a weekly email summary of all new Code tutorials. Never miss out on learning about the next big thing.
Update me weeklyEnvato Tuts+ tutorials are translated into other languages by our community members—you can be involved too!
Translate this post