Pour vous aider à créer une application New Relic, nous vous fournissons le SDK New Relic. Ici, vous pouvez apprendre à utiliser les composants de requête SDK, qui vous permettent d'effectuer des requêtes et des mutations via NerdGraph, notre point de terminaison GraphQL.
Conseil
Les composants React liés aux requêtes peuvent être identifiés par le suffixe Query
. Les composants liés à la mutation peuvent être identifiés par le préfixe Mutation
.
Présentation des composants
Nous basons nos composants de données sur React Apollo. Le composant le plus basique est NerdGraphQuery
, qui accepte tout GraphQL ou GraphQL AST généré par la bibliothèquegraphql-tag
comme paramètre de requête, et un ensemble de variables de requête transmises comme variables
. Au cours de cette requête, nous avons créé un ensemble de requêtes supplémentaires, qui peuvent être divisées en quatre groupes :
- requête utilisateur: Ceux-ci vous permettent de requêter l'utilisateur actuel et ses comptes associés. Composants de cette catégorie :
UserStorageQuery
etAccountsQuery
. - entité requête: Parce que New Relic est centré sur l'entité, nous utilisons la requête pour faciliter l'accès à votre entité. Vous pouvez les compter, les rechercher, les lister, les interroger et les ajouter à vos favoris. Composants de cette catégorie :
EntityCountQuery
,EntitySearchQuery
,EntitiesByDomainTypeQuery
,EntitiesByGuidsQuery
,EntityByGuidQuery
,EntityByNameQuery
. - Requête de stockage: New Relic fournit un mécanisme de stockage simple que nous appelons NerdStorage. Les créateurs de Nerdpack peuvent l'utiliser pour stocker des données de configuration d'application, des données spécifiques à l'utilisateur et d'autres petits éléments de données. Cette catégorie comprend les composants suivants :
UserStorageQuery
,AccountStorageQuery
,EntityStorageQuery
,UserStorageMutation
,AccountStorageMutation
etEntityStorageMutation
. - Requête NRQL : Pour pouvoir interroger vos données New Relic via NRQL, nous fournissons un composant
NrqlQuery
. Ce composant peut renvoyer des données dans différents formats, afin que vous puissiez l'utiliser pour la création de graphiques et pas seulement pour les requêtes.
Composants de la requête
Tous les composants de requête acceptent une fonction comme accessoire enfant où les différents statuts peuvent être transmis. Ce rappel reçoit un objet avec ces propriétés :
loading
: Booléen défini sur vrai lorsque la récupération des données est en cours. Nos composants utilisent la stratégiecache-and-network
, ce qui signifie qu'une fois les données chargées, les rechargements de données ultérieurs peuvent être déclenchés en premier avec des données obsolètes, puis actualisés lorsque les données les plus récentes sont arrivées.data
: Propriété racine où les données demandées sont récupérées. La structure correspond à une structure racine basée sur le schéma NerdGraph. Cela est vrai même pour les structures de données hautement imbriquées, ce qui signifie que vous devrez parcourir le chemin vers le bas pour trouver les données souhaitées.error
:Contient une instanceError
lorsque la requête échoue. Définissez surundefined
lorsque les données sont en cours de chargement ou que la récupération a réussi.fetchMore
:Fonction de rappel que vous pouvez utiliser lorsque la requête est chargée par morceaux. La fonction ne sera présente que lorsqu'il sera possible de le faire, que davantage de données seront disponibles et qu'aucunfetchMore
n'aura déjà été déclenché. Les données sont chargées par lots de 200 par défaut. D'autres composants fournis par la plateforme, comme leDropdown
ou leList
sont capables d'accepterfetchMore
, ce qui signifie que vous pouvez les combiner facilement.
Composants de la mutation
Les composants de mutation acceptent également un enfant comme fonction, comme ceux de requête. La mutation peut être préconfigurée au niveau du composant et une fonction est renvoyée que vous pouvez utiliser dans votre composant.
Il s’agit de l’approche standard de React Apollo pour effectuer des mutations, mais vous trouverez peut-être plus simple d’utiliser notre méthode statique mutation
ajoutée au composant. Plus d'informations sur ce sujet ci-dessous.
Méthodes statiques
Tous les composants décrits exposent également une méthode statique afin qu'ils puissent être utilisés de manière impérative plutôt que déclarative. Tous les composants Query
ont une méthode Query
statique et tous les composants Mutation
ont une méthode mutation
. Ces méthodes statiques acceptent les mêmes accessoires que leur composant de requête, mais transmis sous forme d'objet. Par exemple:
// Declarative way (using components).function renderAccountList() { return ( <ul> <AccountsQuery> ({data, error}) => { if (error) { return <li>Failed to retrieve list: {error.message}</li>; }
return data.map((account) => { <li key={account.id}>{account.name}</li> }); }} </AccountsQuery> </ul> );}
// Imperative way (using promises).async function getAccountList() { let data = {};
try { data = await AccountsQuery.query(); } catch (error) { console.log('Failed to retrieve list: ' + error.message); return; }
return data.actor.accounts.map((account) => { return account.name; });}
De même, une mutation peut se produire dans les deux sens : de manière déclarative ou impérative.
NrqlQuery
NrqlQuery
mérite une explication supplémentaire, car il existe plusieurs formats dans lesquels vous pouvez renvoyer des données. Pour offrir une fonctionnalité maximale, les trois sont exposés via une propriété formatType
. Vous pouvez retrouver ses différentes valeurs sous NrqlQuery.formatType
:
NERD_GRAPH
: Renvoie le format dans lequel il arrive de NerdGraph.RAW
:Le format exposé par défaut dans Insights et les dashboards lorsqu'il est tracé au format JSON. Ce format est utile si vous disposez d'un script préexistant dans ce format vers lequel vous êtes prêt à migrer ou à l'intégrer.CHART
:Le format utilisé par le moteur de cartographie que nous exposons également. Vous trouverez une explication plus détaillée sur la façon de manipuler ce format dans le guide des composants des graphiques, ainsi que quelques exemples.
Si vous êtes prêt à transmettre des données, nous n'exposons actuellement pas NrqlMutation
. Pour ce faire, consultez l'API événement pour savoir comment ajouter un événement personnalisé.