Compatibilité GraphQL de Parse Server avec Relay

compatibilité relay introduction l'api graphql de parse server suit les dernières normes actuellement disponibles pour des api hautement évolutives et des projets front end ambitieux l'équipe open source de parse a choisi de suivre la spécification du serveur relay https //relay dev/docs/en/graphql server specification relay est un framework javascript pour construire des applications react pilotées par des données, alimentées par graphql, conçu dès le départ pour être facile à utiliser, extensible et, surtout, performant relay y parvient grâce à des requêtes statiques et à la génération de code à l'avance à partir de parse 3 10, une compatibilité totale avec relay https //relay dev/docs/en/graphql server specification est mise en œuvre ce document vous guidera à travers ces mises en œuvre prérequis pour commencer ce tutoriel, vous aurez besoin de une application créée sur back4app voir le tutoriel créer une nouvelle application https //www back4app com/docs/get started/new parse app pour apprendre à créer une application sur back4app 1 créer une nouvelle application back4app tout d'abord, il est nécessaire de s'assurer que vous avez une application existante créée sur back4app cependant, si vous êtes un nouvel utilisateur, vous pouvez consulter ce tutoriel https //www back4app com/docs/get started/new parse app pour apprendre à en créer une 2 créer quelques classes dans votre nouvelle application, allez dans le \<font color="#2166ae">navigateur de base de données\</font> et cliquez sur le \<font color="#2166ae">créer une classe\</font> bouton choisissez de créer une \<font color="#2166ae">classe personnalisée\</font> et donnez lui un nom en suivant le schéma d'exemple relay https //relay dev/docs/en/graphql server specification#schema , j'ai créé les classes faction, ship, et d'autres comme décrit avec des propriétés correspondantes, mais vous pouvez créer vos propres classes pour suivre cette documentation il suffit de modifier vos requêtes et mutations en conséquence n'oubliez pas que par convention, les classes commencent par une lettre majuscule, sont en camelcase, et ne contiennent pas de caractères spéciaux tels que des espaces et des symboles cliquez sur \<font color="#2166ae">créer une classe\</font> lorsque vous avez terminé 3 console graphql avec vos classes et propriétés créées, vous pouvez aller à la \<font color="#2166ae">console api\</font> puis \<font color="#2166ae">console graphql\</font> pour exécuter vos requêtes et mutations 4 requêtes notre toute première requête récupérera un objet basé sur son \<font color="#2166ae">objectid\</font> (à ne pas confondre avec \<font color="#2166ae">id\</font> ) parse a évolué et maintenant les requêtes supportent à la fois \<font color="#2166ae">objectid\</font> , anciennement connu sous le nom de \<font color="#2166ae">id\</font> dans les versions précédentes, mais supporte maintenant aussi \<font color="#2166ae">global id\</font> , connu sous le nom de \<font color="#2166ae">id\</font> , qui fait référence à l'id global de relay et a un format plus long car il contient le nom de la classe crypté exemple de \<font color="#2166ae">objectid\</font> eat0ddk09v exemple de \<font color="#2166ae"> id\</font> (a k a id global) rmfjdglvbjpfyvqwzerrmdl2 faisons notre toute première requête récupérant un objet par son \<font color="#2166ae">objectid\</font> 1 query rebelsquery { 2 faction(id "eat0ddk09v") { 3 objectid #objectid for parse 4 id #globalid for relay 5 name #n 6 } 7 } cela va produire 1 { 2 "data" { 3 "faction" { 4 "objectid" "eat0ddk09v", 5 "id" "rmfjdglvbjpfyvqwzerrmdl2", 6 "name" "galactic empire" 7 } 8 } 9 } maintenant, changeons cela pour le globalid pour relay 1 query rebelsquery { 2 faction(id "rmfjdglvbjpfyvqwzerrmdl2") { 3 objectid #objectid for parse 4 id #globalid for relay 5 name #n 6 } 7 } et remarquez que le résultat sera le même 1 { 2 "data" { 3 "faction" { 4 "objectid" "eat0ddk09v", 5 "id" "rmfjdglvbjpfyvqwzerrmdl2", 6 "name" "galactic empire" 7 } 8 } 9 } cela se produit parce que le \<font color="#2166ae">global id\</font> fonctionne, comme son nom l'indique, globalement, et a le nom de classe crypté en lui, donc parse sait où chercher cet id 5 re fetching aussi avec le \<font color="#2166ae">global id\</font> vous pouvez précharger comme la spécification de relay https //relay dev/docs/en/graphql server specification#object identification comme suit 1 query refetchquery{ 2 node(id "rmfjdglvbjpfyvqwzerrmdl2"){ 3 id on faction{ 4 name 5 } 6 } 7 } ce qui donnera 1 { 2 "data" { 3 "node" { 4 "id" "rmfjdglvbjpfyvqwzerrmdl2", 5 "name" "galactic empire" 6 } 7 } 8 } 6 connexions les connexions de relay https //relay dev/docs/en/graphql server specification#connections fonctionnent de la même manière dans parse avec graphql, donc, si vous devez récupérer les vaisseaux des rebelles 1 query rebelsshipsquery { 2 faction(id "rmfjdglvbjphctaznklsz2rq"){ 3 objectid 4 name 5 ships{ 6 edges{ 7 node{ 8 name 9 } 10 } 11 } 12 } 13 } ce qui donnera 1 { 2 "data" { 3 "faction" { 4 "objectid" "aq036irgdp", 5 "name" "alliance to restore the republic", 6 "ships" { 7 "edges" \[ 8 { 9 "node" { 10 "name" "y wing" 11 } 12 }, 13 { 14 "node" { 15 "name" "x wing" 16 } 17 } 18 ] 19 } 20 } 21 } 22 } vous pouvez également récupérer les vaisseaux n 1 query rebelsshipsquery { 2 faction(id "rmfjdglvbjphctaznklsz2rq"){ 3 objectid 4 name 5 ships(first 1){ 6 edges{ 7 node{ 8 name 9 } 10 } 11 } 12 } 13 } ce qui donne 1 { 2 "data" { 3 "faction" { 4 "objectid" "aq036irgdp", 5 "name" "alliance to restore the republic", 6 "ships" { 7 "edges" \[ 8 { 9 cursor 10 "node" { 11 "name" "y wing" 12 } 13 } 14 ] 15 } 16 } 17 } 18 } ou récupérez le n ième vaisseau après un vaisseau spécifique, en utilisant sa valeur de curseur 1 query rebelsshipsquery { 2 faction(id "rmfjdglvbjphctaznklsz2rq"){ 3 objectid 4 name 5 ships(first 1 after "yxjyyxljb25uzwn0aw9uoja"){ #cursor for the y wing ship 6 edges{ 7 cursor 8 node{ 9 name 10 } 11 } 12 } 13 } 14 } qui récupérera 1 { 2 "data" { 3 "faction" { 4 "objectid" "aq036irgdp", 5 "name" "alliance to restore the republic", 6 "ships" { 7 "edges" \[ 8 { 9 "cursor" "yxjyyxljb25uzwn0aw9uoje=", 10 "node" { 11 "name" "x wing" 12 } 13 } 14 ] 15 } 16 } 17 } 18 } 7 mutations nous pouvons également utiliser des mutations compatibles avec les mutations de relay https //relay dev/docs/en/graphql server specification#mutations créons un nouveau \<font color="#2166ae">vaisseau\</font> 1 mutation createbwing($input createshipinput!){ 2 createship(input $input){ 3 ship{ 4 id 5 name 6 } 7 } 8 } cela nécessite la variable de requête suivante 1 { 2 "input" { 3 "fields" { 4 "name" "b wing" 5 } 6 } 7 } et renverra le \<font color="#2166ae">identifiant global\</font> et \<font color="#2166ae">nom\</font> comme spécifié dans la mutation 1 { 2 "data" { 3 "createship" { 4 "ship" { 5 "id" "u2hpcdpxb21qznvzexvf", 6 "name" "b wing" 7 } 8 } 9 } 10 }