Ajout de données personnalisées ou de nouvelles données simulées

Reportez-vous aux deux exemples suivants pour ajouter de nouvelles données simulées pour l'appel d'API REST GET et POST.

  • Pour l'appel d'API REST GET : 
    GET /search/resources/api/v2/categories?storeId=11&depthAndLimit=11%2C11&contractId=-11005&langId=-1
  • Pour l'appel d'API REST POST : 
    POST /wcs/resources/store/12/loginidentity?langId=-1

Création de données simulées pour l'appel d'API REST GET

Cette section décrit les étapes à suivre pour créer des données simulées pour l'appel REST GET suivant : 

https://<hostname>:<port>/search/resources/api/v2/categories?storeId=11&depthAndLimit=11%2C11&contractId=-11005&langId=-1
  • Après avoir ignoré https://<hostname>:<port>, le reste de l'URL est directement mappé aux dossiers sous le dossier mocks. Les conventions de dénomination des fichiers simulés sont basées sur la réponse qu'ils vont servir : 
    $REQUEST-PATH/$HTTP-METHOD.mock
  • Pour cet exemple, vous pouvez créer le fichier simulé dans le dossier mocks/ search/resources/api/v2/categories. Le contenu des fichiers simulés doit être un réponse HTTP valide.
  • Pour la version de HCL Commerce antérieure à la 9.1.8.0, créez un fichier simulé correspondant à l'URL REST de la requête comme suit :
    GET--storeId=11&depthAndLimit=11%2C11&contractId=-11005&langId=-1.mock
  • HCL Commerce Version 9.1.8.0 or laterLes paramètres de requête de l'appel d'API REST sont triés par ordre croissant pour éviter la duplication des fichiers simulés nouvellement créés pour la même API REST et l'URL de requête simulée suivante s'affiche dans la console/le terminal VScode, où l'appel d'API REST est effectué.
    Mock request url:  /search/resources/api/v2/categories?contractId=-11005&depthAndLimit=11%2C11&storeId=11&langId=-1
  • HCL Commerce Version 9.1.8.0 or laterCréez un fichier simulé correspondant à l'URL REST de cette requête comme illustré dans le fragment de code suivant :
    GET--contractId=-11005&depthAndLimit=11%2C11&storeId=11&langId=-1.mock
  • Vous pouvez directement ajouter la réponse HTTP dans le fichier créé ci-dessus. Pour une maintenance plus propre et facile, dans l'application de magasin React, en ajoutant la réponse HTTP dans un autre fichier JSON à partir du dossier data et en l'important dans le fichier simulé.
  • Le contenu du fichier simulé ressemblera à ce qui suit :

  • L'étape suivante consiste à créer le fichier topCategories_11.mock.json dans le dossier data.
  • Après la création du fichier à l'étape précédente, fournissez la réponse JSON dans le fichier. Voici un exemple de réponse pour le fichier topCategories_11.mock.json qui est mentionné dans la capture d'écran ci-dessous :
    Remarque : Cette réponse JSON peut différer en fonction de la réponse d'appel de l'API REST réelle. Si les nœuds finaux de l'API REST ne sont pas disponibles, entrez la réponse simulée JSON dans le fichier.

  • Le fichier de données simulé est créé pour l'appel REST mentionné au début.

Création de données simulées pour l'appel d'API REST POST

Cette section vous permet de créer des données simulées pour l'appel d'API REST POST suivant : 

https://<hostname>:<port>/wcs/resources/store/12/loginidentity?langId=-1
Conformément à l'exemple précédent, créez un fichier simulé dans mocks/wcs/resources/store/12/loginidentity.
Remarque : Si le dossier n'existe pas, créez-le.
  • Crée un fichier POST--langId=-1.mock. Le contenu du fichier ressemblera à ce qui suit :

  • L'étape suivante consiste à créer le fichier registered.12.mock.json dans le dossier data.
  • Après la création du fichier à l'étape précédente, entrez la réponse JSON dans le fichier. Voici un exemple de réponse pour le fichier registered.12.mock.json. Reportez-vous à la capture d'écran suivante :
    Remarque : Cette réponse JSON peut différer en fonction de la réponse d'appel de l'API REST réelle. Si les nœuds finaux de l'API REST ne sont pas disponibles, entrez la réponse simulée JSON dans le fichier.

A présent, réexécutez la commande npm run mock, afin que le serveur simulé prenne les dernières modifications du dossier mocks.

HCL Commerce Version 9.1.8.0 or later

Vérification du flux de réservation simulé

Remarque :
  • Le flux de réservation fictif est disponible uniquement pour Chaise d'appoint évasée dans le magasin Emerald et pour Boulon à poignée en T dans le magasin Sapphire.
  • Si vous cliquez sur une option différente de ces deux options, le système affiche un message sous la barre de menus de catégorie indiquant Désolé, nous n'avons pas pu trouver ce que vous recherchez.. En outre, le serveur simulé affiche Non simulé en tant que réponse d'API dans l'onglet Réseau des outils Browser Developer.
Pour vérifier le flux de paiement simulé pour les magasins Emerald et Sapphire basés sur React :
  1. Utilisez l'URL simulée créée pour le flux de paiement et la connexion nouvellement modifiée à l'aide d'un nom d'utilisateur et d'un mot de passe factices.
  2. Atteindre :
    • Salon > Meuble > Chaise d'appoint évasée, pour le magasin Emerald basé sur React.
    • Fixations > Boulons > Boulon à poignée en T, pour le magasin Sapphire basé sur React.
  3. Cliquez sur le bouton Ajouter au panier et suivez le processus de réservation normal.
  4. Cliquez sur le bouton Passer une commande pour que le système affiche la page Confirmation de commande indiquant un flux de paiement correct à l'aide de l'URL simulée.