GraphQL
Module SOA
A.U 2023-2024
1
Objectifs
Comprendre le besoin ainsi que le principe du GraphQL.
Lire et récupérer des données en utilisant des requêtes GraphQL.
Ecrire et publier des valeurs avec le principe de mutation.
Créer des fonctions chargées de renseigner les données avec le principe du Resolver.
GraphQL
2
Plan
• Introduction
• Présentation de GraphQL
• GraphQL vs REST
• Principes de GraphQL
• Requetes, mutations et Resolver en GraphQL
GraphQL
3
Introduction
▪ Utilisation accrue des mobiles:
▪ Besoin de chargement de données efficace en minimisant la quantité de
données à transférer sur le réseau.
▪ Données exposées par le serveur doivent souvent être modifiée
pour tenir compte des exigences côté client:
▪ La structure de la réponse du serveur doit être fixée par le client.
GraphQL
4
Introduction
▪ Variété de différents frameworks et plateformes front-end :
▪ Nécessite la création d'une nouvelle API qui répondrait aux exigences de
tous.
GraphQL
5
Solution
Plus
puissante
Plus Plus
efficace flexible
GraphQL
6
Présentation de GraphQL
▪ GraphQL est l’acronyme de Graph Query Language
▪ Un langage de requêtes flexible et environnement d'exécution pour
développer des APIs
▪ Démarré chez Facebook en 2012, est devenu OpenSource en
2015,
GraphQL
7
Présentation de GraphQL
▪ Représente la nouvelle façon de concevoir des API modernes:
▪fonctionnant sur un seul point de terminaison via HTTP,
▪optimisant les performances et la flexibilité.
▪ Les types de données renvoyées par l'API sont spécifiés via un
schéma définissant un graphe de types de données.
GraphQL
8
Motivation pour GraphQL
▪ GraphQL est une alternative à REST
Source: [Link]
GraphQL
9
Pourquoi GraphQL ?
▪ Palier aux problèmes qu’on peut rencontrer avec REST:
▪ La sur-extraction (téléchargement de données inutiles):
- Le développeur peut demander exactement ce qu'il attend, ni plus ni moins;
▪ La sous-extraction (l’envoi de plusieurs requêtes):
- On peut obtenir toutes les informations nécessaires en une seule requête
contrairement à REST qui nécessite plusieurs appels (plusieurs URIs).
▪ Permet au client d'être sélectif sur ce qui est renvoyé, et de
décider quelles données sont réellement nécessaires.
GraphQL
10
REST vs GraphQL
▪ API endpoints (points de terminaison)
GraphQL
11
REST vs GraphQL
▪ API endpoints (points de terminaison)
GraphQL Query
REST Query
POST
{
movies(id:1){
title
GET /movies directors{
name
movies movies(last:3){
date
}
GET /movies/1 }
}
Infos movie }
Données demandées
GET /directors/ (JSON)
directors
GraphQL
12
REST vs GraphQL
▪ Méthodes
REST GraphQL
✔POST: Create ✔Query: Read
✔PUT: Update ✔Mutation: Create Update and Delete
✔GET: Read ✔Subscription: pour des fonctionnali-tés
✔Delete: Delete en temps réel
Toutes les opérations passent dans le
corps de la requête HTTP via la méthode
POST
GraphQL
13
REST vs GraphQL
▪ La sur-extraction (téléchargement de données inutiles)
REST Query GraphQL Query
POST
{
movies(last:2){
GET /movies title
}
}
movies
{
"movies": [
(-) Tous les films avec tous les champs, {
"title": "Titanic"
même les données inutiles dans notre },
traitement, seront retournés. {
"title": "X-Man"
GraphQL
}
] 14
REST vs GraphQL
▪ La sous-extraction (l’envoi de plusieurs requêtes)
REST Query GraphQL Query
POST
{
GET /movies/1 movies(id:1){
title
Infos movie directors{
name
movies(last:3){
GET /directors/idM=1 date
}
Infos movie }
}
}
GET /movies/count=3
Données demandées
(JSON)
Les 3 derniers movies
GraphQL
15
REST vs GraphQL
▪ Autres Critères:
REST GraphQL
Structure de Fixé par le serveur Fixé par le client
réponse
Format de données JSON, XML, TXT, HTML JSON
P. Transport HTTP HTTP
P. Communication HTTP HTTP
Méthodes GET, POST, PUT, POST
DELETE
Temps de réponse Lent Rapide
GraphQL
16
Schema en GraphQL
▪ Elément central dans la conception d’une API GraphQL.
▪ On y définit:
Les objets GraphQL: leurs champs et types
Toutes les requêtes disponibles: Query
Toutes les actions disponibles: Mutations
Les mises à jour de données en temps-réel: Subscriptions
Règles métiers (exp: ! si champs obligatoire)
GraphQL
17
Définition de données en GraphQL
❑ SDL (Schema Definition Language)
▪ GraphQL a son propre langage de définition:
▪ des données, leurs types ainsi que les opérations à exécuter
(Requêtes, mutations ou Subscription).
▪ La syntaxe pour écrire des schémas est appelée Schema
Definition Language (SDL).
GraphQL
18
Définition de données en GraphQL
• Exemple:
type Book { type Author{
id: Int! firstName: String
title: String lastName: String
Objets pageCount: Int }
author: Author
}
type Query {
book(id: Int!): Book
Requête
books : [Book]
}
type Mutation {
Mutation createBook(title: String, pageCount: Int,
authors: [Author]): [Book]
}
GraphQL
19
Définition de données en GraphQL
❑ Type
▪ L'élément le plus basique de chaque schéma
▪ Permet de:
Etablir des relations entre différents éléments de schéma,
Définir les opérations GraphQL autorisées à effectuer sur le serveur.
GraphQL
20
Définition de données en GraphQL
❑ Objet
type Book {
type Author{
id: Int!
Relation entre Objets firstName: String
title: String
lastName: String
pageCount: Int
}
authors: [Author]
}
! : exprime un champs optionnel
GraphQL
21
Définition de données en GraphQL
❑ Methodes
▪ requête: correspond à l'action read, c'est-à-dire « GET » en
REST.
▪ mutations. Toutes les autres actions (create,
update et delete), c'est-à-dire « POST », « PUT » et
« DELETE » en REST.
GraphQL
22
Query (Read)
❑ Definition
type Query{
book(id: Int!): Book
books : [Book]
allAuthors(count: Int): [Author]
}
GraphQL
23
Requête/Query
❑ Test
{
"data": {
{ "books": [
books{ { "title": "l'oeil et le mot" },
title { "title": "En route pour les étoiles" }
]
} }
} }
{ "data": {
"books": [
{ { "title": "l'oeil et le mot",
books{ "author": [
{ "firstName": "Jean-François" }
title ]
author{ },
{ "title": "En route pour les étoiles" ,
firstName "author": [
} { "firstName": "Marlène" }
} GraphQL
] 24
Mutation
❑ Definition
type Mutation{
createBook (id: Int, title: String, pageCount: int): Book
deleteBook (id: Int!): [Book]
addAuthor (firstName: String!, lastName!): [Author]
}
GraphQL
25
Mutation
❑ Test
mutation{
createBook( id: "123", {
title: "l'oeil et le mot ", "data": {
pageCount: 240) { "createBook": {
id "id": "123" ,
title "title": " l'oeil et le mot "
}
} }
} }
GraphQL
26
Mutation
❑ Test
mutation{
deletBook( id: "123") {
{ "data": {
id "deleteBook": []
title }
} }
}
GraphQL
27
Resolvers
❑ Liaison avec le métier
▪ Un résolveur est assigné à chaque champs.
- Fonction qui renvoie des données pour les champs du schéma.
▪ A le rôle de chercher et récupérer ta data de n'importe quelle
source de données: Base de données, fichiers, etc.
GraphQL
28
Subscription
❑ Données en temps réel
▪ Mécanisme pour les mises à jour de données en temps réel,
▪ Apporter des fonctionnalités en temps réel dans votre
application GraphQL.
GraphQL
29
En résumé
GraphQL
30
