20 abril, 2023

Utiliza una API REST externa con WordPress

Los datos están en su máximo esplendor en estos últimos años y algunas empresas han liberado sus datos usando su propia API REST y, de vez en cuando, queremos mostrar esos datos en nuestro WordPress.

Al hablar de datos, se nos viene a la mente infinidad de cosas, por ejemplo, datos de:

Libros.
Redes sociales.
Casas y/o terrenos.
Productos e-commerce.
Pagos por Internet.
Dinero y/o criptomonedas.

Los ejemplos anteriores son unos cuántos de la infinidad de datos que existen en el Internet. Pero, ¿cómo obtenemos esos datos y los mostramos en nuestro WordPress?

La solución es: API REST externas.

¿Qué es una API REST?

Una API REST es una interfaz entre sistemas que utilizan peticiones HTTP para obtener y/o modificar datos, y hasta ejecutar funcionalidades específicas de la API REST.

Las respuestas de estas peticiones HTTP serán en formato JSON o XML, y podrás hacer lo que quieras con ellas con tu lenguaje de programación favorito.

Si no sabes qué son las peticiones HTTP, sigue éste enlace para saber más al respecto (las peticiones más comunes son: GET y POST).

Gráficamente, así es como funciona una petición a una API REST:

Funcionamiento de petición a una API REST externa.

La lógica de la imagen anterior se explica de la siguiente manera:

El cliente quiere conocer los estados del país México.
Hay que hacer una petición a la API REST de /servicios/estados/.
A la petición hay que adjuntarle un parámetro { "pais": "México" }.
El parámetro funciona como filtro para obtener los estados de nuestro país.
Al final, nosotros decidiremos qué hacer con los resultados de la petición.

La API REST de CoinMarketCap

Vamos a desarrollar un pequeño plugin que se conecte a la API de CoinMarketCap; es una web que te muestra los precios de todas las criptomonedas que hay en el mercado.

Lo que queremos hacer es obtener las últimas 5 criptomonedas más populares del mercado y mostrarlas en nuestra barra de administración de WordPress, justo así:

Últimas 5 criptomonedas de CoinMarketCap

Deberás crear una cuenta en CointMarketCap siguiendo los pasos en su guía. Lo importante que necesitaremos será la API Key.

¿Qué límites tiene la API REST de CoinMarketCap?

Ten en cuenta que la cuenta básica de la API de CoinMarketCap tiene un límite de 333 créditos por día y hasta 10,000 llamadas al mes, cada crédito equivale a un request a la API.

La mayoría de APIs siguen este mismo método para evitar el abuso de peticiones por parte de bots automatizados.

Así que debes tener en cuenta cómo administras tus llamadas a la API para poder ahorrar costos a mediano y largo plazo. En este post te explico algunas buenas prácticas a seguir después de implementar una API REST externa en WordPress.

¿Qué es la HTTP API de WordPress?

WordPress contiene un conjunto de funciones que pertenecen a la HTTP API, y sirven para hacer peticiones HTTP a API REST ó cualquier otro servidor que retorne alguna respuesta. Así mismo, también contiene funciones para leer dichas respuestas.

Lo que aprendas a continuación, te servirá para tus plugins y temas WordPress que desarrolles en el futuro.

¿Cómo usar la HTTP API de WordPress?

¿No sabes cómo hacer un plugin WordPress? Lee mi post donde te explico lo que necesitas para poder desarrollarlos.

Entonces, te comentaba sobre unas funciones de WordPress para hacer peticiones a una API REST, una de ellas es wp_remote_request():

wp_remote_request( string $url, array $args );

Ésta acepta dos parámetros:

$url (string) – La URL donde haremos nuestra petición.
$args (array) – Los argumentos de nuestra petición.

Endpoint y argumentos de la API REST

En nuestro caso, la URL de nuestra petición sería la siguiente:

https://pro-api.coinmarketcap.com/v1/cryptocurrency/listings/latest

Y también debemos especificar la API KEY generada por CoinMarketCap dentro de un header llamado X-CMC_PRO_API_KEY. Todos los headers deben de estar dentro de un arreglo con índice headers (al mismo tiempo headers es un arreglo) así como se ve en el siguiente código:

$api_endpoint = 'https://pro-api.coinmarketcap.com/v1/cryptocurrency/listings/latest';
$api_args     = array( 'headers' => array( 'X-CMC_PRO_API_KEY' => 'TU API DE COINMARKETCAP' ) );
$queries      = array(
   'start'   => 1,
   'limit'   => 5,
   'convert' => 'MXN',
);

Usaremos las tres variables anteriores para construir y hacer la llamada a la API:

$api_endpoint – Este es en endpoint donde se hará la petición.
$api_args – Un arreglo que contiene la API KEY dentro de las cabeceras (headers). Si no especificas este valor, la API retornará un error.
$queries – Son los query strings que serán usados en el endpoint para modificar la respuesta de la API.

Puedes cambiar los valores de la variable $queries, por ejemplo, si quieres convertir a EUR en vez de MXN, simplemente especificas EUR en el índice convert del arreglo.

Si quieres obtener 10 o más criptomonedas en vez de 5, solo cambia el valor del índice limit del arreglo.

Visita la documentación de la API de CoinMarketCap para más información de los parámetros que aceptan sus URLs.

Adjunta los argumentos a la petición

También dijimos que acepta un segundo parámetro, los argumentos:

$args = array(
   'method' => 'GET',
);

¡Sorpresa! Tenemos que especificarle qué tipo de método HTTP usará nuestra petición, en este caso la documentación de la API nos dice que usemos GET para la petición.

Con los códigos anteriores, tenemos este código:

$api_endpoint = 'https://pro-api.coinmarketcap.com/v1/cryptocurrency/listings/latest';
$api_args     = array(
   'method'  => 'GET',
   'headers' => array( 'X-CMC_PRO_API_KEY' => 'TU API DE COINMARKETCAP' )
);
$queries      = array(
   'start'   => 1,
   'limit'   => 5,
   'convert' => 'MXN',
);
 
$api_endpoint = add_query_arg( $queries, $api_endpoint );
$response     = wp_remote_request( $api_endpoint, $api_args );

Nota la función add_query_arg(), esta se dedica a adjuntar todos los valores existentes de la variable $queries como query strings al endpoint que nosotros especifiquemos. El resultado de esa función será:

https://pro-api.coinmarketcap.com/v1/cryptocurrency/listings/latest?start=1&limit=5&convert=MXN

Y listo, ya estamos haciendo una petición a la API REST de CoinMarketCap.

¿Cómo obtener el resultado de la petición API REST?

Podemos asignar el resultado de la petición a una variable, en este caso, se la asignamos a la variable $response; y aquí viene otra de las funciones de la HTTP API de WordPress, wp_remote_retrieve_body():

wp_remote_retrieve_body( array $response );

Y como ven, acepta un parámetro de tipo array, y ahí es justo donde vamos a poner nuestra variable $response, la cual contiene la respuesta de nuestra petición.

Entonces, nuestro código sería:

$api_endpoint = add_query_arg( $queries, $api_endpoint );
$response     = wp_remote_request( $api_endpoint, $api_args );
$cryptos      = json_decode( wp_remote_retrieve_body( $response ), true );

¿En verdad funciona? Momento de probar

¡Sí funciona! Si mandamos a imprimir la variable $cryptos con la función var_dump(), veríamos lo siguiente:

Muestra resultados de la API usando var_dump()

Convierte el resultado JSON a un arreglo (array)

Hasta aquí todo bien, pero ahora tenemos un problema, el resultado en sí está en formato JSON, y tenemos que convertirlo a un array para que PHP lo pueda leer correctamente; esto lo hacemos con la función json_decode():

json_decode( string $string, bool $assoc_array );

La cual acepta dos parámetros:

$string (string) – El JSON string a decodificar.
$assoc_array (bool) – Si queremos que la decodificación sea un array o no.

Y lo implementamos en nuestro código; nota que el segundo parámetro de la función json_decode() es true:

$response = wp_remote_request( $api_endpoint, $api_args );
$cryptos  = json_decode( wp_remote_retrieve_body( $response ), true );

¡Bien! Nuestra variable $cryptos ya es un array.

Prepara tu barra de administración

Pero si recuerdan, les dije que debíamos agregar las criptomonedas en nuestra barra de administración de WordPress. ¡No temas! Es totalmente sencillo.

Tenemos que usar el hook llamado admin_bar_menu, el cual nos permite agregar un nuevo menú en la barra de administración:

add_action( 'admin_bar_menu', 'wp_cmkcap_add_admin_bar_menu', 999 );

El código anterior nos indica que ejecutará la función wp_cmkcap_add_admin_bar_menu() en el momento que el hook admin_bar_menu sea ejecutado.

Crea el menú principal

Ten mucho en cuenta que la función acepta un parámetro ($wp_admin_bar) de tipo WP_Admin_Bar, éste será muy importante, porque nos permitirá agregar nuestro menú:

function wp_cmkcap_add_admin_bar_menu( $wp_admin_bar ) {
    //
}

A continuación, agregamos nuestro título principal del menú:

$parent_node = array(
   'id'    => 'wp_cmkcap_admin_bar',
   'title' => 'Cryptocurrencies',
);
 
$wp_admin_bar->add_node( $parent_node );

Ten en cuenta el método add_node(), éste será el encargado de agregar nuestro menú a la barra de administración de WordPress. Y recuerda muy bien qué valor le estás poniendo al índice id de la variable $parent_node.

Agrega los títulos dentro del menú

¿Recuerdan que convertimos nuestra respuesta JSON a un array? Bien, pues ahora lo leemos con la función foreach de PHP:

foreach ( $cryptos['data'] as $crypto_data ) {
   $price      = number_format( $crypto_data['quote'][ $queries['convert'] ]['price'] );
   $child_node = array(
      'id'     => 'cryptocurrency-' . $crypto_data['id'],
      'title'  => $crypto_data['name'] . ' / $' . $price . ' ' . $queries['convert'],
      'parent' => 'wp_cmkcap_admin_bar',
   );
 
   $wp_admin_bar->add_node( $child_node );
}

La variable $cryptos con índice data contendrá toda la información de la criptomoneda, entonces si queremos solo el nombre de la criptomoneda, tendríamos que llamar a la variable de la siguiente forma:

$crypto_data['name'];

Puedes revisar qué información contiene $crypto_data en la imagen cuando hicimos el var_dump().

Y ahora, quiero que pongas atención en el valor del índice title dentro de la variable $child_node:

$child_node = array(
   'id'     => 'cryptocurrency-' . $crypto_data['id'],
   'title'  => $crypto_data['name'] . ' / $' . $price . ' ' . $queries['convert'],
   'parent' => 'wp_cmkcap_admin_bar',
);

En el índice title es donde pondremos el nombre de la criptomoneda concatenado con su precio en pesos mexicanos, para este ejemplo.

Y el valor del índice parent tendrá que ser igual al valor del índice id que le pusiste en tu variable $parent_node. Esto para que cada título de la criptomoneda se vaya agregando abajo del menú Cryptocurrencies.

Con el código anterior unido, la función wp_cmkcap_add_admin_bar_menu() se vería de esta manera:

function wp_cmkcap_add_admin_bar_menu( $wp_admin_bar ) {
   $parent_node = array(
      'id'    => 'wp_cmkcap_admin_bar',
      'title' => 'Cryptocurrencies',
   );
 
   $wp_admin_bar->add_node( $parent_node );
 
   $api_endpoint = 'https://pro-api.coinmarketcap.com/v1/cryptocurrency/listings/latest';
   $api_args     = array(
      'method'  => 'GET',
      'headers' => array( 'X-CMC_PRO_API_KEY' => 'TU API DE COINMARKETCAP' )
   );
   $queries      = array(
      'start'   => 1,
      'limit'   => 5,
      'convert' => 'MXN',
   );
 
   $api_endpoint = add_query_arg( $queries, $api_endpoint );
   $response     = wp_remote_request( $api_endpoint, $api_args );
   $cryptos      = json_decode( wp_remote_retrieve_body( $response ), true );
 
   foreach ( $cryptos['data'] as $crypto_data ) {
      $price      = number_format( $crypto_data['quote'][ $queries['convert'] ]['price'] );
      $child_node = array(
         'id'     => 'cryptocurrency-' . $crypto_data['id'],
         'title'  => $crypto_data['name'] . ' / $' . $price . ' ' . $queries['convert'],
         'parent' => 'wp_cmkcap_admin_bar',
      );
 
      $wp_admin_bar->add_node( $child_node );
   }
}

Posibles errores de la petición API REST

Es muy común que las API REST que estemos utilizando devuelvan varios tipos de errores. Un error tal vez ocurra porque:

Te faltó especificar la API KEY para autenticar tu sesión.
Un parámetro que mandaste a la API está mal escrito y no existe.
El endpoint no existe.
El servicio de la API REST está fuera de servicio (timeout).

Si uno de los errores anteriores u otros sucede, en este momento en que el código no tiene validaciones contra errores, te devolvería un error PHP. Y no queremos eso.

Validación del timeout

En el caso de un timeout por parte de la API REST, la función wp_remote_request() retornará una instancia de tipo WP_Error como respuesta y la validamos con la función is_wp_error():

$api_endpoint = add_query_arg( $queries, $api_endpoint );
$response     = wp_remote_get( $api_endpoint, $api_args );
 
if ( is_wp_error( $response ) ) {
   $child_node = array(
      'id'     => 'internal-error',
      'title'  => 'Internal Error - Notify the administrator.',
      'parent' => 'wp_cmkcap_admin_bar',
   );
 
   $wp_admin_bar->add_node( $child_node );
 
   return;
}

El código anterior menciona que si la variable $response es una instancia de WP_Error entonces agrega un mensaje de error adentro de nuestro menú:

Muestra error en menú si respuesta es una instancia de WP_Error.

Validaciones al código HTTP de la petición API REST

Ahora podemos agregar las validaciones a otros tipos de errores. Por ejemplo, si hubiésemos especificado el endpoint a una ruta que no existe, la API devolverá el siguiente resultado:

{
   "statusCode": 404,
   "error": "Not Found",
   "message": "Not Found"
 }

Y este error cuando no especificamos la API KEY en la petición:

{
   "status": {
     "timestamp": "2021-04-18T18:41:41.318Z",
     "error_code": 1002,
     "error_message": "API key missing.",
     "elapsed": 0,
     "credit_count": 0
   }
 }

Aquí tenemos respuestas diferentes en ambos casos, el primer resultado es un código HTTP 404 y el segundo es un 401. Significa que tenemos que agregar validaciones de acuerdo al código HTTP devuelto.

Para obtener el código HTTP actual de la petición tenemos que usar la función wp_remote_retrieve_response_code( $response ) para después usar la respuesta de esa función dentro de una condición:

$http_code = wp_remote_retrieve_response_code( $response );
$cryptos   = json_decode( wp_remote_retrieve_body( $response ), true );
 
if ( 200 !== $http_code ) {
   $message    = 404 === $http_code ? $cryptos['message'] : $cryptos['status']['error_message'];
   $child_node = array(
      'id'     => 'api-error',
      'title'  => 'API Error: ' . $message,
      'parent' => 'wp_cmkcap_admin_bar',
   );
 
   $wp_admin_bar->add_node( $child_node );
 
   return;
}

El código anterior menciona que si el código HTTP es diferente al número 200 (equivalente a un resultado exitoso) entonces obtendrá los mensajes de error y los insertará dentro de nuestro menú.

¡Ojo! Aquí tenemos que agregar una validación ternaria (variable $message) para obtener el mensaje de error ya que el resultado del error 404 es muy diferente al del error 401. Ten en cuenta este tipo de situaciones para evitar futuros errores.

Con las validaciones integradas, el menú se verá así cuando algún error suceda:

Muestra error cuando código HTTP es 404.

Muestra error cuando código HTTP es 401.

Resultado final

¡Listo! Hemos terminado, descarga el código completo y ejecútalo en tu WordPress y verás cómo funciona a la perfección, así es como se debería ver el código:

/*
Plugin Name: WP CoinMarketCap
Plugin URI:  https://roelmagdaleno.com/
Description: Get the latest cryptocurrency data.
Version:     2.0
Author:      Roel Magdaleno
Author URI:  https://roelmagdaleno.com/
License:     GPL2
License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/
 
function wp_cmkcap_add_admin_bar_menu( $wp_admin_bar ) {
   $parent_node = array(
      'id'    => 'wp_cmkcap_admin_bar',
      'title' => 'Cryptocurrencies',
   );
 
   $wp_admin_bar->add_node( $parent_node );
 
   $api_endpoint = 'https://pro-api.coinmarketcap.com/v1/cryptocurrency/listings/latest';
   $api_args     = array( 'headers' => array( 'X-CMC_PRO_API_KEY' => 'TU API DE COINMARKETCAP' ) );
   $queries      = array(
      'start'   => 1,
      'limit'   => 5,
      'convert' => 'MXN',
   );
 
   $api_endpoint = add_query_arg( $queries, $api_endpoint );
   $response     = wp_remote_get( $api_endpoint, $api_args );
 
   if ( is_wp_error( $response ) ) {
      $child_node = array(
         'id'     => 'internal-error',
         'title'  => 'Internal Error - Notify the administrator.',
         'parent' => 'wp_cmkcap_admin_bar',
      );
 
      $wp_admin_bar->add_node( $child_node );
 
      return;
   }
 
   $http_code = wp_remote_retrieve_response_code( $response );
   $cryptos   = json_decode( wp_remote_retrieve_body( $response ), true );
 
   if ( 200 !== $http_code ) {
      $message    = 404 === $http_code ? $cryptos['message'] : $cryptos['status']['error_message'];
      $child_node = array(
         'id'     => 'api-error',
         'title'  => 'API Error: ' . $message,
         'parent' => 'wp_cmkcap_admin_bar',
      );
 
      $wp_admin_bar->add_node( $child_node );
 
      return;
   }
 
   foreach ( $cryptos['data'] as $crypto_data ) {
      $price      = number_format( $crypto_data['quote'][ $queries['convert'] ]['price'] );
      $child_node = array(
         'id'     => 'cryptocurrency-' . $crypto_data['id'],
         'title'  => $crypto_data['name'] . ' / $' . $price . ' ' . $queries['convert'],
         'parent' => 'wp_cmkcap_admin_bar',
      );
 
      $wp_admin_bar->add_node( $child_node );
   }
}
 
add_action( 'admin_bar_menu', 'wp_cmkcap_add_admin_bar_menu', 999 );

Funciones de ayuda

Pero podríamos usar otra función para hacer nuestras peticiones en vez de wp_remote_request(), y sería la función wp_remote_get(), la cual acepta los mismos parámetros que la función que hemos usado anteriormente.

Solo que le pasamos únicamente el primer parámetro, que es la URL de la API REST; el código quedaría de ésta forma:

 1$api_endpoint = 'https://pro-api.coinmarketcap.com/v1/cryptocurrency/listings/latest';
 2$api_args     = array( 'headers' => array( 'X-CMC_PRO_API_KEY' => 'TU API DE COINMARKETCAP' ) );
 3$queries      = array(
 4   'start'   => 1,
 5   'limit'   => 5,
 6   'convert' => 'MXN',
 7);
 8 
 9$api_endpoint = add_query_arg( $queries, $api_endpoint );
10$response     = wp_remote_get( $api_endpoint, $api_args );
11$cryptos      = json_decode( wp_remote_retrieve_body( $response ), true );

Nótese que hemos eliminado la variable $args, (donde le decíamos que íbamos a hacer una petición GET) ya que ésta función es solamente para hacer peticiones HTTP GET.

Si tu API te pide una petición HTTP POST, entonces usarías la función wp_remote_post().

Puntos a tomar en cuenta

Cada API REST es diferente, nos piden distintos parámetros y alguno de ellos nos podría pedir ciertos argumentos, como cabeceras HTTP, el tiempo de espera del servidor, si desea verificar el SSL, entre otros. Si llegases a usar un argumento, lo tendrías que especificar dentro de la variable $args, por ejemplo:

 1$args = array(
 2   'timeout'     => 30,
 3   'httpversion' => '1.1',
 4   'sslverify'   => false,
 5   'body'        => array(
 6      'username' => 'avengers',
 7      'password' => 'infinitywars',
 8   ), 
 9);
10 
11wp_remote_post( $api_url, $args );

Otro punto a tomar en cuenta es que algunas API REST necesitarán una API KEY para poder realizar nuestras peticiones exitosamente; tienes que revisar en la documentación de la API REST que estés usando, si necesitas una API KEY para empezar a utilizar su recurso.

De vez en cuando, las API REST podrían alentar un poco tu sitio, todo depende de qué tan rápida sea la respuesta de la API REST que estés utilizando. La solución a esto es que sólo hagas una única petición al momento de activar tu plugin y guardes el resultado de la petición en un valor en tu base de datos, y de ahi vas leyendo su valor, así te ahorras las llamadas que podrían arruinar tu sitio.

Recursos para API REST y WordPress

¿Te interesa seguir trabajando con API REST y WordPress? Aquí te dejo algunos recursos:

Lista de APIs públicas.
La HTTP API de WordPress.
Insomnia. Un programa para hacer peticiones HTTP a API REST.

Si has llegado hasta aquí, ¡te felicito!

Ahora, te invito a que en los comentarios me expongas tus dudas que surgieron a lo largo del post ó las ideas que tienes sobre cómo implementar esto en algún plugin.

Si con éste tutorial has hecho un plugin parecido al que acabamos de desarrollar, comenta con un screenshot los resultados y explícanos de que se trata. 🙂

Changelog

18/04/2021

El endpoint, de CoinMarketCap, de ejemplo inicial se cambió porque dejó de existir. Ahora se usa un nuevo endpoint que requiere API KEY. El lector debe registrarse y obtener una API KEY para continuar con la guía.
Ahora se usa la función add_query_arg() para adjuntar los query strings al endpoint final.
Se agregó la sección de manejo de errores donde se valida ciertos errores de la API.
El código final se almacena en Gist en vez de descargarlo en formato ZIP.

Comentarios

47 respuestas a “Utiliza una API REST externa con WordPress”

pepoo
9 enero, 2018
Hola, me encantaría saber como puedo mostrar el resultado de la API REST en una tabla que sea responsive. No en el admin menú 😀
Muchísimas gracias por el post.
Un saludo.
Responder
1. Roel Magdaleno
  9 enero, 2018
  Hola, lo que se me ocurre es que, utilices la Shortcode API (https://codex.wordpress.org/Shortcode_API) de WordPress para que puedas pedir los datos deseados e imprimirlos en la tabla responsive, algo así:
  [mishortcode criptomonedas=”bitcoin,xrp,eth”]
  Donde el valor de “criptomonedas” sería el valor que vas a mandar a pedir a la API. Ese shortcode lo pondrías en un post o página.
  Checa el código de este plugin para que sepas como están contruyendo la tabla responsive: https://es.wordpress.org/plugins/automatic-responsive-tables/
  Ya tu te encargas de poner los valores dentro de la tabla.
  Saludos y me da mucho gusto que te haya servido el post. 🙂
2. pepoo
  9 enero, 2018
  Muchas gracias por contestar tan rápido.
  Justamente lo que no se es como pasar el array que hay dentro de $cryptocurrencies (en tu ejemplo) a una tabla con bootstrap (HTML5) de manera automática para poder hacer peticiones a la API y que te salgan en formato tabla. Tipo esto: http://issues.wenzhixin.net.cn/bootstrap-table/
  Se que es un poco complicado… pero no encuentro la manera.
3. Roel Magdaleno
  9 enero, 2018
  La verdad es que no es nada complicado, lo que tienes que hacer es renderizar la tabla desde PHP, tendrías que definir el inicio de la tabla, y dentro de la tabla, ejecutas un loop foreach que recorra los elementos de $cryptocurrencies.
  Aquí hay un ejemplo del código: https://wp-types.com/forums/topic/create-table-rows-with-a-foreach-loop/
  Y bueno, yo lo programaría de la forma como sale en la imagen (espero estar entendiendo lo que quieres):
  https://uploads.disquscdn.com/images/003bf9c6ee001bc4c1bdad8d101420c54ead1f946c8f9584515b0d9c1f00f917.png
  ¡Inténtalo! Espero te pueda servir. Saludos. 🙂
4. pepoo
  10 enero, 2018
  Estoy aprendiendo mucho, te agradezco tu esfuerzo.
  El código que uso es el siguiente:
  https://paste.ofcode.org/yYC2a6VLyWh4kPXZZBWU2V
  y este es el resultado:
  https://uploads.disquscdn.com/images/89079fb26d6846b07c2d30db656d06ef4afa7117297e7dc02b1376d34732454f.jpg
  Se muestran las 5 array pero no los componentes que hay dentro…
  Muchas gracias 😀
5. Roel Magdaleno
  10 enero, 2018
  Ahh! Pero no estás usando WordPress, verdad? De todas formas te muestra “Array” porque estás imprimiendo un Array, no el componente, si quieres acceder a los componentes deberías mandarlos a llamar así:
  $crypto_table .= '' . $cryptocurrency_data['name'] . ' '; $crypto_table .= '' . $cryptocurrency_data['price_usd'] . ' ';
  Y tu foreach debería ser así:
  foreach ( $cryptocurrencies as $key => $cryptocurrency_data ) { $crypto_table .= '' . $cryptocurrency_data['name'] . ' '; $crypto_table .= '' . $cryptocurrency_data['price_usd'] . ' '; }
  Fíjate bien en el resultado final del plugin que hicimos en este post, es justo como lo estoy haciendo. Saludos. 🙂
José
8 diciembre, 2018
Saludos, tu post fue tremendo. Me gustaría saber como hacer para comunicarme con una API que solciita como parametro un XML que pienso crear con WP All Export
Responder
1. Roel Magdaleno
  8 diciembre, 2018
  Gracias por comentar. Sobre tu pregunta, tendrías que buscar la documentación de la API a la que harás petición para ver cómo recibe el XML. En teoría, deberías enviar el contenido del XML y el header “Content-type” tiene que ser “application/xml”. Te aconsejo usar el programa “Insomnia”, es para probar APIs, yo lo uso mucho. Saludos!
Ricardo
18 diciembre, 2018
Hola Roel, primero que nada tu blog es muy bueno, felicidades. Lo que quería preguntarte es como podría hacer la actualización de un catalogo de productos en WooCommerce con una API externa, ojala me puedas dar un consejo o ¿Tu como lo harías?.
Saludos!!
Responder
1. Roel Magdaleno
  18 diciembre, 2018
  Hola Ricardo, gracias por leer el post. Para tu caso, yo haría un plugin que cada cierto tiempo ejecute una petición a la API externa y responda con los productos que tienes almacenado ahí, después puedes comparar qué productos ya existen en tu WooCommerce y los que aún no existen, los agregas a tu WC. ¿Qué te parece? Saludos.
Nacho Martínez
9 enero, 2019
Hola Roel. Felicidades por tu blog y gracias por compartir tus conocimientos.
Estoy intentando leer desde una página de WP unos datos que se encuentran en una BDD mysql externa a WP. He utilizado la clase de WP wpdb para extraer los datos por medio de un plugin para insertar código php, pero después de ejecutar el código no se cómo volver a la BDD de wordpress y seguir con la plantilla, por lo tanto no obtiene los datos de la página y me da error desde ese punto.
Conoces algún método mejor para hacer lo que quiero?
Sabes cómo solucionar el error?
Te adjunto la dirección web para que veas el error.
Gracias por adelantado y un saludo.
Responder
1. Roel Magdaleno
  11 enero, 2019
  Hola Nacho, gracias por leer mi blog. Para tu pregunta, tienes dos opciones, la primera es usar la clase “wpdb” para conectarte a tu base de datos externa, siguiendo esta información: https://wordpress.stackexchange.com/a/1618/99204, y el otro método sería crear una API de esa base de datos, es decir, le creas un recurso (una URI) donde al acceder a ella te responda con información de la base de datos (ya sea usando Laravel, Sails.js, etc). En estos momentos, lo más probable es que estés ejecutando mal el código que usas con “wpdb”.
  Hazme saber si te sirve, y perdón por la demora. Saludos.
Sergio
27 enero, 2019
Hola joel como estas se nota que eres un crack en esto y yo pues estoy empezando y me gustaria saber algo lo que pasa es que estoy actualizando una pagina web en wordpress y dentro de eso estan una integracion con una empresa que tiene su propia api para consultar e insertar inmuebles solo eh podido manejar la pagina desde el panel de administracion que tiene normalmente wordpress entonces no eh encontrado la manera de fusionaar esta REST API que esta en php podrias ilustrarme como hacerlo desde la consola de administracion o me tocaria pedir permisos elevados al server e ir a los directorios raiz de la pagina ??
por fa cualquier ayuda que me puedas dar lo agradeceria enormente
Responder
1. Roel Magdaleno
  27 enero, 2019
  Hola Sergio, primero tienes que checar si necesitas autenticación para la REST API de esa empresa; después tienes que hacer unas llamadas de pruebas a esa API, podrías usar Postman o Insomnia, si todo sale bien, ahora tendrías que desarrollar un plugin para WordPress que haga llamadas a esa misma REST API, jalas los resultados y haces con ellos lo que se te antoje. Espero haberte entendido bien, y espero haberte ayudado. Cualquier cosa aquí andamos. 😉
Jose Antonio
1 marzo, 2019
Hola Roel, excelente trabajo ! ¿sabes si hay algun plugin wordpress que pueda conectarse con bases de datos de ofertas de empleo para después trabajar con ellas?. He visto alguno de indeed pero no me han dado acceso a la api, mi dea sería poder acceder a la api de otros portales de empleo para poder trabajar con sus ofertas de empleo y después mostrarlas según mis criterios, al estilo de trovit.es . Muchas gracias!
Saludos
Responder
1. Roel Magdaleno
  1 marzo, 2019
  Plugins que hagan eso no conozco y creo que no hay, si quieres algo muy personalizado tendrías que hacer tu respectivo plugin. Es la mejor opción para tomar. Sobre la API de Indeed, encontré esto: http://opensource.indeedeng.io/api-documentation/, al parecer es de libre uso. Saludos!
marcelo
17 enero, 2020
hola me sirivio de mucho tu post.. como hago para imprimirlo en en una pagina?
Responder
1. Roel Magdaleno
  17 enero, 2020
  ¿Te refieres a imprimirlo dentro de una página WordPress? Lo que puedes hacer es obtener los datos que te devolvió la API REST y mandarlos al frontend con `wp_send_json_success()` y mostrarlos con JavaScript, este método sería mediante AJAX. Es decir, aprietas un botón que busque y conecte a la API REST (lo que se vio en el post) y después esos datos de respuesta los mandas con la función que mencioné.
  Gracias por tu comentario, cualquier otra cosa me avisas. 🙂
Stiven Yepez
12 febrero, 2020
Un cordial saludo,
Tu post a sido de gran ayuda, pero estoy atascado, estoy tratando de consumir una api para usar los datos he imprimirlos el la vista. Estoy haciendo un plugin y para imprimirlo estoy usando un shortcode. y la consulta a la api la estoy haciendo de esta forma :
```
$headers = array(
    'Authorization' => 'Basic ' . base64_encode( 'ENRRZvfEqvydsGvxjeUvkjNTAFajwzM9JefDgHWz-770' )
);
$url = 'http://www.simi-api.com/ApiSimiweb/response/v21/inmueblesDestacados/total/6';
$args = array(
    'method' => 'GET',
    'header' => $headers
);
$consultaApi = wp_remote_get( $url, $args );
$api= wp_remote_retrieve_body($consultaApi);
```
no se que estamal, no arroga error y cuando hago un var_dump($api) me arroja null
Responder
1. Roel Magdaleno
  12 febrero, 2020
  Hola Stiven, dentro de tu variable `$args` tienes `header` y tiene que ser `headers`, te falta una “s” al final. Podría ser eso, y si no tal vez sea la autorización. Si no te funciona sigue comentando para que pueda ayudarte.
  Saludos y que bien que te haya servido mi post. 🙂

Stiven Yepez

12 febrero, 2020

un cordial saludo, realice el cambio pero funciono.

la consulta normal que funciona fuera de wordpress es:

$ch = curl_init();
$headers =  'Authorization:' . TOKEN;
curl_setopt($ch, CURLOPT_URL,'http://www.simi-api.com/ApiSimiweb/response/v21/inmueblesDestacados/total/0');
curl_setopt($ch, CURLOPT_CUSTOMREQUEST, "GET");
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
curl_setopt($ch, CURLOPT_HTTPAUTH, CURLAUTH_BASIC);
curl_setopt($ch, CURLOPT_FOLLOWLOCATION, TRUE);
curl_setopt($ch, CURLOPT_USERPWD, $headers);
$result = curl_exec($ch);
curl_close($ch);
$api = json_decode($result, true);

pero no se como debo pasarla para que wordpress me la acepte ya que no me esta trayendo los datos

Responder

Roel Magdaleno

12 febrero, 2020

A mi me sale esto:

{"status":401,"description":"La solicitud requiere autenticaci\u00f3n de usuario o sus credenciales no son correctas"}

Con el siguiente código:

function rmr_runapi() {
    $args = array(
        'headers' => array(
            'Authorization' => 'Basic ' . base64_encode( 'ENRRZvfEqvydsGvxjeUvkjNTAFajwzM9JefDgHWz-770' ),
        ),
    );

    $uri = 'http://www.simi-api.com/ApiSimiweb/response/v21/inmueblesDestacados/total/6';

    $response = wp_remote_get( $uri, $args );

    var_dump( wp_remote_retrieve_body( $response ) );
}

add_action('wp_loaded', 'rmr_runapi');

A ti de plano no te retorna nada? Mándame mensaje a mi Messenger, si gustas: Roel Magdaleno ó mi correo: roelmagdaleno@gmail.com

Saludos.

Jonathan
27 febrero, 2020
Buenas noches! Debería consumir una api (suma prop) de un crm de inmobiliarias desde wordpress… Y la verdad no se por donde empezar, necesito q las personas lo puedan filtrar por zona, precio, ambientes, etc… Y q lo muestre en una tabla con la información y las fotos
Responder
1. Roel Magdaleno
  27 febrero, 2020
  Buenas noches Jonathan, gracias por pasar por mi blog.
  Para empezar necesitas saber JavaScript, PHP y saber cómo funciona WordPress y sus hooks. La funcionalidad que mencionas sobre los filtros es totalmente posible de hacer, el algoritmo podría ser algo así:
  1. Crear un plugin ó integrarlo dentro del tema (dentro de functions.php).
  2. Hacer un botón que haga una petición AJAX y que esa petición, en el backend, haga la llamada a la API.
  3. Dentro de esa petición AJAX tendrías que mandar los filtros seleccionados por el usuario.
  4. Al final obtienes los resultados de la llamada a la API (lo más seguro que te lo devuelva en formato JSON).
  5. Esos datos JSON los agarras en el frontend con JS y los colocas dentro de tu tabla como resultado.
  No es nada difícil, tu puedes hacerlo! Y antes de consumir la API necesitas las API Keys que te brinda tu proveedor.
  Saludos, cualquier duda aquí estamos. 😀
Jose Bernal
16 mayo, 2020
Hola buenas noches, en mi caso yo he creado un servicio api rest que esta en C#, el cual lo deseo consumir, para eso deseo crear una pagina en wordpress, ya que estos servicios trae información administrativa (como ejemplo listar usuarios/producto, insertar usuarios/producto, actualizar usuarios/producto, desactivar usuarios/producto), esto porque hacer una pagina desde cero no conozco mucho de esto y con wordpress veo que te crear las paginas rápidamente, solo faltaría colocar la información en dicha pagina, hay una forma de usar wordpress???, gracias por el aporte
Responder
1. Roel Magdaleno
  17 mayo, 2020
  Gracias por tu comentario. Si tu API REST en C# te levanta un servicio HTTP/HTTPS entonces si es posible hacer la conexión entre WordPress y tu servicio; si este es el caso, deberás seguir los pasos de este post. Y si no, pues tendrías que ver la forma de que tu API REST sea visible públicamente.
  Saludos.
Daniel de Ballester
14 junio, 2020
Puff amigo muchas gracias!!!! todavía no lo probé, pero ya entre hoy o mañana voy hacer las pruebas 🙂 no te das una idea de lo que busque y busque y siempre respondían para hacer peticiones locales…. y eso no era lo que quería. Quiero hacer pruebas de peticiones a una API de películas, para crear mi Theme.
Responder
1. Roel Magdaleno
  14 junio, 2020
  Gracias por tu comentario, por eso mismo hice este post para ayudar a la gente a crear sus desarrollos; porque desde hace tiempo también estuve en el mismo apuro. Recién hice este nuevo post donde te cuento unos consejos a la hora de implementar este post:
  https://roelmagdaleno.com/consejos-para-api-rest-externas-en-wordpress/
  Saludos y gracias!
Carlos Arango
4 agosto, 2020
Hola, muy bueno tu tutorial, tengo una pregunta, quisiera saber si tengo un formulario en wordpress en el cual el cliente llena sus datos y una vez que hace clic en el botón del formulario se conecta a una api para revisar si los datos son correctos y mandar un mensaje diciendo si son correctos o no sus datos. Como podría hacerlo.
Responder
1. Roel Magdaleno
  5 agosto, 2020
  Hola Carlos, gracias por tu comentario.
  La respuesta a tu pregunta es fácil, lo que tendrías que hacer primero es buscar/identificar el “filter” o “action” hook del plugin del formulario (NinjaForms, Contact Form, etc) que te permita capturar los datos ingresados por el usuario antes de guardarlo en la base de datos.
  Con los datos incluídos en el hook construyes tu API request y ejecutas un wp_remote_request() o wp_remote_post(), el que requiera tu API. Después sigue los mismos pasos de este tutorial y valida la respuesta de tu API, dentro del callback del hook que estás usando deberás romper el ciclo de guardado de datos si la API te marca error en los datos y si todo está bien pues ya permites guardarlos.
  Espero me de a entender, pero prácticamente es lo que debes hacer. Cualquier cosa sigue comentando, saludos.
Oscar
28 diciembre, 2020
Hola después de muchos días buscando, me encuentro con este post y es FANTASTICO!
te agradezco MUCHISIMO por compartir tu sabiduría.
soy de Argentina, y en una web de noticias, quiero mostrar, la cotización del dólar, y métricas del covid19,… quizás me gustaría incluir, las tendencias de las redes sociales,… creo que esto podría servir,… aunque no entiendo mucho, pero podrías indicarme un paso a seguir para buscar información e ir probando?
Mi web esta en WORDPRESS.
Te adjunto una imagen de lo que deseo:
Imagen: https://ibb.co/hmFXgf9
Responder
1. Roel Magdaleno
  28 diciembre, 2020
  Hola Oscar, gracias por pasar por mi blog.
  Lo que requieres es parecido a lo que expliqué en este post pero apuntando a las APIs adecuadas, por ejemplo, una API sobre el COVID19 sería este servicio: https://documenter.getpostman.com/view/11144369/Szf6Z9B3?version=latest#intro.
  Y si te vas a este enlace: https://corona.lmao.ninja/v2/countries/Argentina, esa ya es una llamada a la API donde te mostrará los datos que necesitas sobre el COVID19 en tu país. Yo encontré esa API buscando en Google: “covid 19 api”.
  Para lo del dólar, no se si este es lo que buscas: https://exchangeratesapi.io/, lo busqué en Google como: “usd api”.
  De acuerdo a los datos que te arrogen las APIs, decidirás cómo se representa en tu sitio web. Pero para ir empezando, debes seguir lo de este tutorial y cambiar la API que yo usé por la del COVID19 por ejemplo.
  Te dejo un truco: Puedes ir probando las APIs primero usando Insomnia o Postman.
  Hazme saber qué tal te fue. Saludos.
2. Oscar
  28 diciembre, 2020
  ya mismo me pongo a investigar a ver si puedo lograrlo.
  Muchisimas gracias!
Isaac
17 febrero, 2021
Hola que tal, excelente post :).
Me puedes ayudar en darme un norte, tengo una situacion en donde requiero que cuando un producto de mi tienda woo se venda, se descuente en una aplicacion externa, supongo que es por medio de una api que ellos me deben proporcionar, pero en woo donde implemento esa parte?, gracias.
Responder
1. Roel Magdaleno
  17 febrero, 2021
  Hola Isaac, gracias por leer el post.
  Ahora de acuerdo a tu pregunta, la aplicación externa debe proporcionarte la API adecuada para reducir el inventario en su sistema. Ahora, ¿cómo implementarlo en WooCommerce? El truco es utilizar los “action hooks” que te provee WOO y aquí es donde tienes que decidir “cuándo” descontar o incrementar el invertario en el sistema externo, puedes tener varios casos de uso:
  1. El usuario agrega los productos al carrito (Podrías descontar el stock desde este punto).
  2. El usuario hace su compra pero el pago puede tener diferentes estados (Podrías descontar o incrementar el inventario).
  El estado de un pago puede ser:
  – Completado
  – Pendiente
  – Cancelado
  – Fallido
  – Devuelto
  – En Espera
  Tienes que buscar el hook perfecto para ti, de acuerdo a tus requerimientos, aquí te dejo algunos:
  woocommerce_payment_complete
  woocommerce_order_status_pending_to_cancelled
  woocommerce_order_status_pending_to_failed
  woocommerce_order_status_processing_to_refunded
  woocommerce_order_status_on-hold_to_refunded
  Y un ejemplo con código PHP sería:
  add_action( 'woocommerce_payment_complete', function( $order ) { $status = $order->get_status(); if ( 'complete' === $status ) { // La funcionalidad para descontar el inventario en el sistema externo. // wp_remote_post(); return; } // La funcionalidad para incrementar el inventario en el sistema externo. // Solo si el estado es cancelado, fallido, devuelto, etc. // wp_remote_post(); } );
  Espero lo que he puesto aquí tenga sentido y puedas concretar tu trabajo.
  Saludos.
Jose
1 marzo, 2021
Hola!
Gracias por tu post, requiero ayuda para integrar un Web Service a WooCommerce y no encuentro la forma, tal vez me puedas ayudar
Responder
1. Roel Magdaleno
  2 marzo, 2021
  Hola José, para integrar un Web Service a WooCommerce deberás seguir lo mencionado en este post. No deberías tener problemas, pero en caso de que si lo tengas te apoyo en tu error.
  Saludos.
Daniel
18 abril, 2021
Hola he copiado el código dentro de mi archivo functions.php de wordpress, no se si estoy en lo correcto. Me ha agregado la opción en el menú de mi escritorio pero al darle click no hace nada.
No se si he hecho algo mal, quizás tenia que colocar el archivo que he descargado dentro de algún directorio de mi sitio y llamarlo desde funtions.php, soy nuevo en esto si pudieras ayudarme, muchas gracias un saludo
Responder
1. Roel Magdaleno
  18 abril, 2021
  Hola Daniel, el código que has puesto en tu functions.php es correcto, sin embargo, la API de coinmarketcap.com ha cambiado y el endpoint que se utiliza en este post no funciona más. Actualizaré el post entre hoy y mañana usando la nueva API de coinmarketcap.com y un ejemplo más usando la API de Rick and Morty.
  Saludos.
Daniel
18 abril, 2021
Vale por esta razón he visto que es necesario tener una cuenta de desarrollador en https://pro.coinmarketcap.com/ y luego hacer uso de la API Key de alguna manera que desconozco, si puedes actualizar este post con la solución sería genial, muchas gracias un saludo….
Responder
1. Roel Magdaleno
  18 abril, 2021
  Hola Daniel, he actualizado la guía utilizando la última versión de la API de CoinMarketCap. También puedes ver la sección CHANGELOG para ver qué cosas cambiaron dentro de la guía.
  Saludos y gracias por avisarme de esta situación.
Diego
25 mayo, 2022
En caso de que lo que necesite yo es mandar los datos de un formulario de wordpress/elementor mediante una api a una base de datos externa ¿Cómo lo haría? Gracias de antemano
Responder
1. Roel Magdaleno
  25 mayo, 2022
  Buen día Diego, gracias por pasar por mi blog.
  Algunos plugins de formularios, por ejemplo WPForms, proveen varios filters y actions hooks con los que puedes capturar los datos del formulario (enviado por el usuario). Por ejemplo, WPForms nos da este action hook wpforms_process_complete (documentación).
  Después tienes que hacer uso de unas de las funciones de WordPress para hacer peticiones remotas wp_remote_request() o wp_remote_post(). También necesitarás la ruta a la cual hacer la petición y los respectivos datos a enviar, comúnmente, la documentación de la API te da esa información.
  Así que, una petición remota hacia otra API con los datos del formulario, se vería así en código:
  add_action( 'wpforms_process_complete', 'rmr_send_data_to_api' ); function rmr_send_data_to_api( $fields ) { $params = array( 'body' => $fields, // More data... ); $response = wp_remote_post( 'MY_API_ENDPOINT', $params ); if ( is_wp_error( $response ) ) { return; // Request failed... } $body = wp_remote_retrieve_body( $response ); // Return data as an array. return json_decode( $body, true ); }
  ¡Ojo! No olvides agregar las respectivas validaciones como: si la petición falló, si los datos que requiero existen en el formulario, etc.
  Espero te haya servido, un saludo.
José Alfredo
13 septiembre, 2022
Me ha encantado tu guía, muy bien documentada. Es primera vez que me inicio en la programación con API desde WordPress, por lo tanto me viene bien para enviar xml a mi proveedor de facturas. Seguiré leyendo tus post..
Gracias por compartir tu conocimiento.
Saludos desde Chile
Responder
1. Roel Magdaleno
  13 septiembre, 2022
  Gracias por tu comentario. Verás que sabiendo qué funciones y parámetros utilizar, se hará muy sencillo el desarrollo.
Aragua Online
31 enero, 2023
Está genial Roel !
Tengo una duda ( no manejo mucho las API’s, hay forma de colocarle un temporizador para que realice la consulta cada x minutos a la bd externa ?
Estoy viendo la posibilidad de cargar una landing con el menú de un restaurante, este menú lo cargan en su sistema local ( una bd en hosting local ) y quiero que al ellos actualizar, cosa que será 1 o 2 veces al día, el API lo suba a la bd de wordpress y luego se actualice en la landing.
Saludos
Responder
1. Roel Magdaleno
  1 febrero, 2023
  Buen día. ¡Buenísima pregunta!
  Puedes lograr eso con dos métodos:
  Los datos de la API los guardas en un transient con expiración. Pero siempre tendrías que hacer una validación diaria si ya se caducó el transient dentro de un hook como el init. Los datos en esta opción se borrarán de la base de datos y la función que hace la consulta tendrá que ejecutarse nuevamente para que los datos estén disponibles.
  Creas un cron job para WordPress que ejecute la consulta cada dos días. Un poco más tedioso que la primera opción, pero con este los datos siempre estarán en la base de datos, solo se actualizarán.
  Cualquiera de los dos métodos es bueno, diría que pruebes ambas y escojas con la que más sentido tenga para tu proyecto.
  Saludos.
  Referencias:
  – https://developer.wordpress.org/apis/transients/
  – https://kinsta.com/es/base-de-conocimiento/wordpress-cron-jobs/