Les API ont pris de plus en plus de place ces derniers temps dans nos projets. Il est donc difficile aujourd’hui d’imaginer un service, un projet,… qui ne propose pas d’API avec laquelle interagir. Nous allons dans cet article voir un type d’architecture API en particulier (et oui il y en a d’autres) qui est le REST et par la suite l’API de WordPress ainsi que l’exposition des custom fields/types d’ACF (Advanced Custom Fields).

Qu’est ce qu’une API ?

Une API (Application Programming Interface) est comme son nom l’indique une interface qui permet la communication entre deux programmes.  Elle permet ainsi la réception et la transmission des données sous différents formats, spécifiées par le développeur en charge de la conception de l’API (JSON, XML,…).

L’API Rest

REST (Representational State Transfer) est une architecture orientée ressources où chaque ressource est accessible via un identifiant unique qu’on appelle URI.

Le modèle de maturité de Richardson

Selon le modèle de maturité de Richardson il existe quatre 4 niveaux de développement dans les APIs REST (de 0 à 3) dont le niveau 3 représente une API totalement RESTful.
La différenciation entre les 4 niveaux peut se baser sur 4 critères:

verbes-http-api

Les verbes HTTP

REST se sert des verbes HTTP pour définir des spécifications d’échange facilement intégrables à tout système.

http-verbs-summary-api-rest

L’API de WordPress

Depuis la version 4.7 de WordPress une API de type REST est intégrée de base sans avoir recours à un plugin et est totalement conçu avec les standards d’aujourd’hui.

rest-api-wordpress-endpoints

Création de custom post types

La création de custom post types permet d’avoir un type de contenu différent de celui que propose WordPress par défaut à savoir les articles, les pages,…

Imaginons qu’on doit développer pour un client un site qui propose des formations,  on doit créer un  custom post type formations pour lequel on aurait besoin d’ajouter des champs personnalisés; nom de la formation, type de la formation… voici le bout de code à mettre dans le fichier functions.php de notre thème. Le plus important à vérifier c’est que show_in_rest soit à true puisque ce dernier nous permet de récupérer ce custom post à partir de l’API.

Concernant les taxonomies, WordPress met par défaut les catégories et les tags pour les articles. Encore une fois on aura besoin d’avoir des custom taxonomies pour le type de post formations afin de les récupérer plus tard par catégorie.

Pour récupérer toutes les formations une simple requête GET suffit. Mais exécutant la requête nous recevons un code 404, qui signifie que la ressource est indisponible alors que tout est bon. Dans ce cas là il suffit tout simplement de réenregistrer les permaliens en allant dans Réglages > Permaliens.

Voilà notre custom post type formations est maintenant créé.

function custom_post_types()
{
    register_post_type(
        'formations',
        array(
          'labels' => array('name' => __('Formations'), 'singular_name' => __('Formation') ),
          'public' => true,
          'has_archive' => true,
          'public'       => true,
          'show_in_rest' => true,
          'supports' => array('title','editor','thumbnail','custom-fields'),
          'show_ui'             => true,
          'show_in_menu'        => true,
          'show_in_nav_menus'   => true,
          'show_in_admin_bar'   => true,
          'menu_icon'           => 'dashicons-welcome-learn-more',
        )
      );
    register_taxonomy(
        'category_formations',
        'formations',
        array(
          'label' => 'Categories',
          'labels' => array(
          'name' => 'Categories',
          'singular_name' => 'Category',
          'all_items' => 'All categories',
          'edit_item' => 'Edit category',
          'view_item' => 'View category',
          'public'       => true,
          'show_in_rest' => true,
          'show_ui' => false,
          'show_tagcloud' => false,
          'show_in_nav_menus' => false,
        ),
        'hierarchical' => true
        )
      );
}
add_action('init', 'custom_post_types');

Ajout de custom fields

ACF (Advanced Custom Fields) est une extension WordPress permettant d’ajouter aux posts (customs ou par défaut) des champs personnalisés, ce qu’on appelle les customs fields.

Précédemment nous avons fait que créer le custom post type formations auquel il faut rajouter des champs. Ces champs seront les suivants: description, thumbnail, syllabus,…

On part du principe que ACF (ou ACF Pro) est déjà installé sur notre site. On commence par créer un groupe de champs Formation Fields auquel on rajoutera tous champs nécessaires avec leur types.

acf-pro-wordpress

Pour que ce groupe de champs soit applicable aux posts de type formations il faut l’y assigner, comme le montre la capture suivante :

acf-pro-type-wordpress

Nous pouvons maintenant créer une formation pour l’exemple avec tous les champs nécessaires.

formations-wordpress-acf

Après la création nous pouvons maintenant faire une requête GET pour récupérer la formation en question. Pour s’y faire je vais utiliser Postman ou Insomnia qui sont des clients REST.

Voici la réponse de la requête :

response-api-acf-wordpress-formations

Nous avons récupéré le contenu de tout le post sauf les champs ACF. De base les champs ACF ne sont exposés dans l’API REST, il faudra le préciser aussi dans le fichier functions.php de notre thème.

add_action('rest_api_init', 'wp_rest_api_alter');
function wp_rest_api_alter()
{
    register_rest_field(
          'formations',
          'custom_fields',
          array(
            'get_callback'    => function ($data, $field, $request, $type) {
                if (function_exists('get_fields')) {
                    return get_fields($data['id']);
                }
                return [];
            },
            'update_callback' => null,
            'schema'          => null,
          )
      );
}

Avantages de l’API Rest de WordPress

  • Conception de thèmes basés uniquement sur du JavaScript ou un framework frontend en particulier (React.js, Vue.js, Angular,…)
  • Utilisation de l’API pour des applications single page
  • Utilisation de l’API en tant que backend pour des applications mobile
  • Utilisation de WordPress en tant que Headless CMS (pour une intégration JAMstack, plus d’informations sur https://jamstatic.fr/)
  • Conception d’un dashboad entièrement basé par exemple sur du Node.js ou autre totalement indépendant de celui que propose WordPress par défaut.
  • etc…

Nous allons voir dans les prochains articles comment utiliser l’API de WordPress pour créer un blog basé sur GatsbyJS.

Avant de partir…
Merci pour votre lecture ! 😊