Utilisation de mutations GraphQL pour ajouter des données à une table DynamoDB dans la console AWS AppSync

Pour ajouter des données à votre source de données

1. Si ce n'est pas déjà fait, connectez-vous à la AppSync console AWS Management Console et ouvrez-la.

2. Choisissez votre API dans le tableau.

3. Dans l'onglet de gauche, sélectionnez Requêtes.

4. Dans l'onglet Explorateur situé à gauche du tableau, vous pouvez voir plusieurs mutations et requêtes déjà définies dans l'éditeur de requêtes :

   

   Note

   Cette mutation est en fait inscrite dans votre schéma en tant que Mutation type. Il contient le code :

   type Mutation {
   	createTodo(input: CreateTodoInput!): Todo
   	updateTodo(input: UpdateTodoInput!): Todo
   	deleteTodo(input: DeleteTodoInput!): Todo
   }

   Comme vous pouvez le constater, les opérations ici sont similaires à celles de l'éditeur de requêtes.

   AWS AppSync les a automatiquement générés à partir du modèle que nous avons défini précédemment. Cet exemple utilisera la createTodo mutation pour ajouter des entrées à notre TodoAPITable table.

5. Choisissez l'createTodoopération en l'étendant sous la createTodo mutation :

   

   Cochez les cases pour tous les champs, comme sur l'image ci-dessus.

   Note

   Les attributs que vous voyez ici sont les différents éléments modifiables de la mutation. Vous input pouvez être considéré comme le paramètre decreateTodo. Les différentes options avec des cases à cocher sont les champs qui seront renvoyés dans la réponse une fois l'opération effectuée.

6. Dans l'éditeur de code au centre de l'écran, vous remarquerez que l'opération apparaît sous la createTodo mutation :

   mutation createTodo($createtodoinput: CreateTodoInput!) {
     createTodo(input: $createtodoinput) {
       where
       when
       name
       id
       description
     }
   }

   Note

   Pour expliquer correctement cet extrait, nous devons également examiner le code du schéma. La déclaration mutation createTodo($createtodoinput: CreateTodoInput!){} est la mutation avec l'une de ses opérations,createTodo. La mutation complète se trouve dans le schéma :

   type Mutation {
   	createTodo(input: CreateTodoInput!): Todo
   	updateTodo(input: UpdateTodoInput!): Todo
   	deleteTodo(input: DeleteTodoInput!): Todo
   }

   Pour en revenir à la déclaration de mutation de l'éditeur, le paramètre est un objet appelé $createtodoinput avec un type d'entrée obligatoire deCreateTodoInput. Notez que CreateTodoInput (et toutes les entrées de la mutation) sont également définies dans le schéma. Par exemple, voici le code standard pour : CreateTodoInput

   input CreateTodoInput {
   	name: String
   	when: String
   	where: String
   	description: String
   }

   Il contient les champs que nous avons définis dans notre modèlename, à savoirwhen,where, etdescription.

   Pour en revenir au code de l'éditeur, danscreateTodo(input: $createtodoinput) {}, nous déclarons l'entrée comme$createtodoinput, qui a également été utilisée dans la déclaration de mutation. Nous procédons ainsi car cela permet à GraphQL de valider nos entrées par rapport aux types fournis et de s'assurer qu'elles sont utilisées avec les bonnes entrées.

   La dernière partie du code de l'éditeur indique les champs qui seront renvoyés dans la réponse après l'exécution d'une opération :

   {
       where
       when
       name
       id
       description
     }

   Dans l'onglet Variables de requête situé sous cet éditeur, vous trouverez un createtodoinput objet générique susceptible de contenir les données suivantes :

   {
     "createtodoinput": {
       "name": "Hello, world!",
       "when": "Hello, world!",
       "where": "Hello, world!",
       "description": "Hello, world!"
     }
   }

   Note

   C'est ici que nous allouons les valeurs pour l'entrée mentionnée précédemment :

   input CreateTodoInput {
   	name: String
   	when: String
   	where: String
   	description: String
   }

   Modifiez le createtodoinput en ajoutant les informations que vous souhaitez mettre dans notre table DynamoDB. Dans ce cas, nous voulions créer certains Todo éléments comme rappels :

   {
     "createtodoinput": {
       "name": "Shopping List",
       "when": "Friday",
       "where": "Home",
       "description": "I need to buy eggs"
     }
   }

7. Choisissez Exécuter en haut de l'éditeur. Choisissez CreateTodo dans la liste déroulante. Sur le côté droit de l'éditeur, vous devriez voir la réponse. Cela peut ressembler à ce qui suit :

   {
     "data": {
       "createTodo": {
         "where": "Home",
         "when": "Friday",
         "name": "Shopping List",
         "id": "abcdefgh-1234-1234-1234-abcdefghijkl",
         "description": "I need to buy eggs"
       }
     }
   }

   Si vous accédez au service DynamoDB, vous verrez désormais une entrée dans votre source de données contenant les informations suivantes :