Mutations

Il s’agit de la troisième partie de la série pour GraphQL et Adobe Commerce. Les mutations permettent d’enregistrer, de mettre à jour et de renvoyer des valeurs à l’aide de GraphQL.

Vidéos et tutoriels connexes sur GraphQL dans cette série

Exemple de mutation

Toute spécification d’API complète doit offrir la possibilité non seulement d’interroger des données, mais également de les créer et de les mettre à jour.

REST fait la distinction entre les requêtes qui modifient les données et celles qui ne sont pas du type de requête ou "verb" (GET ou POST ou PUT).
Lors de l’utilisation de GraphQL, les requêtes de modification de données sont distinguées par la variable mutation mot-clé qui correspond à un type racine différent dans le schéma défini sur le serveur.

Regardez cet exemple de mutation pour l’ajout d’un produit au panier d’un utilisateur. (Cela nécessite un identifiant de panier généré pour la session du client connecté ou à l’aide de la variable createEmptyCart mutation.)

mutation doAddToCart(
    $cartId: String!,
    $cartItems: [CartItemInput!]!
) {
    addProductsToCart(
        cartId: $cartId
        cartItems: $cartItems
    ) {
        cart {
            total_quantity
            prices {
                grand_total {
                    value
                }
            }
        }
    }
}

Vous pouvez imaginer la mutation ci-dessus envoyée dans une requête avec le dictionnaire de variables suivant :

{
  "cartId": "{cart-id}",
  "cartItems": [
    {
      "quantity": 1,
      "sku": "VT01-RN-XS"
    }
  ]
}

Et enfin, vous pourriez recevoir une réponse comme celle-ci :

{
  "data": {
    "addProductsToCart": {
      "cart": {
        "total_quantity": 1,
        "prices": {
          "grand_total": {
            "value": 35.2
          }
        }
      }
    }
  }
}

La principale chose à noter à propos de l'exemple ci-dessus est que, à part l'utilisation de la variable mutation mot-clé au lieu de query, la syntaxe est identique à celle d’une requête. Comme les requêtes, la mutation inclut :

  • Un nom d’opération arbitraire (doAddToCart)
  • Une liste de variables (par exemple, $cartId)
  • Un champ initial (addProductsToCart) avec des arguments (par exemple, cartId, défini sur la valeur de $cartId) entre parenthèses.
  • Sous-sélection de champs entre accolades

La sous-sélection de champs vous permet de définir de manière flexible les champs que vous souhaitez renvoyer (à partir du type affecté comme valeur renvoyée de addProductsToCart - AddProductsToCartOutput) une fois la mutation terminée.

Comme expliqué précédemment, les champs définis dans un schéma GraphQL démarrent sur un type racine pour les requêtes (généralement appelé Query). De même, il existe un autre type de racine pour les mutations (généralement appelées Mutation). addProductsToCart est un champ de ce type racine.

Voici quelques autres remarques concernant l’exemple ci-dessus :

  • La variable ! suffixe de caractères String et CartItemInput indique que la variable est requise.
  • Les crochets ([]) autour du CartItemInput type spécifié pour $cartItems indiquez une liste de ce type plutôt qu’une seule valeur.

Ressources GraphQL utiles

recommendation-more-help
3a5f7e19-f383-4af8-8983-d01154c1402f