API de surveillance React Native
Découvrez comment utiliser l' React Native API pour surveiller et instrumenter vos applications React Native à l'aide d' Instana. Cela permet une observabilité en temps réel et offre des informations sur les performances des applications mobiles hybrides.
React Native versions de l'agent
Pour découvrir les mises à jour, les améliorations et les modifications apportées à l'agent « React Native », consultez le fichier du journal des modifications sur GitHub:
API d'agent React Native iInstana
Vous pouvez utiliser l'agent Instana React Native via les méthodes Instana de classe décrites ici.
React Native L'agent prend en charge les projets « TypeScript » à partir de la version 2.0.6.
Configuration
Initialisez ` Instana ` dans votre App classe componentDidMount():
export default class App extends Component {
componentDidMount() {
Instana.setup(YOUR_INSTANA_APP_KEY, YOUR_INSTANA_REPORTING_URL, null);
// Alternatively with configuration options
Instana.setup(YOUR_INSTANA_APP_KEY, YOUR_INSTANA_REPORTING_URL, {'collectionEnabled': false});
}
}
Le code suivant est une définition de TypeScript :
setup(your_instana_app_key: string, your_instana_app_reportingUrl: string, options?: Object): void;
setup(your_instana_app_key: string, your_instana_app_reportingUrl: string, {collectionEnabled: boolean}): void;
Paramètres de configuration
Le tableau suivant répertorie les paramètres de configuration :
| Paramètre | Description |
|---|---|
key (String) |
Clé de configuration de surveillance Instana |
reportingURL (String) |
L' URL, qui pointe vers l'instance Instana à laquelle les données de surveillance doivent être envoyées |
Identificateur de session
Chaque instance de l'agent « Instana » dispose d'un identifiant de session unique que vous pouvez utiliser à d'autres fins dans votre application.
static getSessionID()
Le code suivant est une définition de TypeScript :
getSessionID(): Promise<string>;
Paramètres d'identifiant de session
Retours : Promise(String)
Exemple d'identifiant de session
var sessionID = await Instana.getSessionID();
Surveillance HTTP automatique
Instana L'agent assure la surveillance automatique des requêtes HTTP.
Vues
Instana peut segmenter les informations d'application mobile par vues logiques. Vous pouvez définir le nom de la vue à l'aide de la Instana.setView(String) méthode. La vue est alors associée à toutes les balises surveillées jusqu'à ce que la vue change lorsque setView est appelée à nouveau.
N'utilisez pas de noms techniques ou génériques tels que « Class » WebViewActivity (par exemple) pour définir des vues. Utilisez plutôt des noms lisibles pour les vues (par exemple, product detail page ou payment selection). En se concentrant sur les expériences des utilisateurs, les membres de l'équipe qui n'ont pas une connaissance intime de la base de code peuvent comprendre les informations fournies.
Instana.setView(String) est appelée lorsqu'un écran est affiché à l'utilisateur, et non lors de sa création (comme dans le cas d'un fragment qui peut être créé une seule fois mais affiché plusieurs fois). Lorsque vous définissez le nom de la vue, Instana peut suivre les transitions entre les pages en plus des chargements de page.static setView(String name)
Le code suivant est une définition de TypeScript :
setView(name: string): void;
Paramètres de vue
Le tableau suivant répertorie les paramètres des vues :
| Paramètre | Description |
|---|---|
name (String) |
Nom de la vue. |
Exemple de vues
Instana.setView('Webview: FitBit authorization');
Identification des utilisateurs
Des informations spécifiques à l'utilisateur peuvent, le cas échéant, être envoyées avec les données transmises à Instana. Ces informations peuvent ensuite être utilisées pour débloquer davantage de fonctionnalités, telles que :
- Calculer le nombre d'utilisateurs affectés par les erreurs
- Filtrer les données pour des utilisateurs spécifiques
- Voir quel utilisateur a déclenché une modification de la vue ou une demande d' HTTP
Par défaut, Instana n'associe aucune information permettant d'identifier l'utilisateur aux balises. Vous devez connaître les lois applicables en matière de protection des données. Identifiez les utilisateurs à l'aide d'un ID utilisateur. Dans le cas d' Instana s, il s'agit d'un élément String transparent utilisé uniquement pour calculer certains indicateurs. userName et userEmail peuvent également être utilisés pour avoir accès à plus de filtres et à une meilleure présentation des informations sur l'utilisateur.
Dans les cas où vous traitez des utilisateurs anonymes et n'avez donc pas accès aux identifiants d'utilisateur, vous pouvez également utiliser les identifiants de session. Les identifiants de session ne sont pas aussi utiles que les identifiants d'utilisateur pour filtrer les données, mais ils constituent un bon indicateur pour calculer les indicateurs relatifs aux utilisateurs concernés ou aux utilisateurs uniques. Définissez un nom d'utilisateur tel que Anonymous pour établir une distinction claire entre les utilisateurs authentifiés et les utilisateurs non authentifiés. Les ID session peuvent être des données sensibles (en fonction de l'infrastructure ou de la plateforme utilisée). Envisagez de hacher les identifiants de session afin d'éviter de transmettre à Instana des données susceptibles de permettre l'accès.
Les données déjà transmises au serveur d' Instana ne peuvent pas être modifiées a posteriori. C'est pourquoi il est important d'appeler cette méthode ` API ` dès que possible lors du lancement de l'application.
static setUserID(String ID)
static setUserName(String email)
static setUserEmail(String name)
Le code suivant est une définition de TypeScript :
setUserID(id: string): void;
setUserName(name: string): void;
setUserEmail(email: string): void;
paramètres utilisateur
Le tableau suivant répertorie les paramètres utilisateur :
| Paramètre | Description |
|---|---|
ID (String) |
Identificateur de l'utilisateur. |
email (String) |
Adresse électronique de l'utilisateur. |
name (String) |
Nom de l'utilisateur. |
Exemple utilisateur
export default class App extends Component {
componentDidMount() {
Instana.setup(YOUR_INSTANA_APP_KEY, YOUR_INSTANA_REPORTING_URL);
Instana.setUserID('1234567890');
Instana.setUserEmail('instana@example.com');
Instana.setUserName('instana react-native agent demo');
}
}
Métadonnées
Des métadonnées arbitraires peuvent être associées à toutes les données transmises à Instana. Vous pouvez l'utiliser pour suivre les valeurs de configuration de l'interface utilisateur, les paramètres, les indicateurs de fonctionnalité et tout autre contexte qui pourrait être utile à l'analyse.
static setMeta(String key, String value)
Le code suivant est une définition de TypeScript :
setMeta(key: string, value: string): void;
Paramètres des métadonnées
Le tableau suivant répertorie les paramètres de métadonnées :
| Paramètre | Description |
|---|---|
value (String) |
value de la paire clé-valeur que vous souhaitez ajouter en tant que métadonnées. |
key (String) |
key de la paire clé-valeur que vous souhaitez ajouter en tant que métadonnées. |
Exemple de métadonnées
export default class App extends Component {
componentDidMount() {
Instana.setMeta('randomKey1', 'randomValue1');
Instana.setMeta('randomKey2', 'randomValue2');
}
}
Signalement de évènements personnalisés
Les événements personnalisés permettent de signaler à Instana les activités atypiques, les interactions importantes et les durées personnalisées. Cela peut s'avérer particulièrement utile lorsque vous analysez des erreurs non interceptées (éléments de navigation) et que vous effectuez le suivi d'un plus grand nombre d'attributs de performance.
static reportEvent(String eventName, {
startTime: Number startTime,
duration: Number duration,
viewName: String viewName,
backendTraceId: String backendTraceId,
meta: Map meta
})
Le code suivant est une définition de TypeScript :
reportEvent(eventName: string, options?: {
startTime?: number;
duration?: number;
viewName?: string;
meta?: Map<string, string>;
backendTracingId?: string;
customMetric?: number;
}): void;
Paramètres des événements personnalisés
Le tableau suivant répertorie les paramètres des événements personnalisés :
| Paramètre | Description |
|---|---|
eventName (String) |
Définit quel type d'événement, qui s'est produit dans votre application, doit entraîner la transmission d'une balise personnalisée |
startTime (Number, facultatif) |
Horodatage, en millisecondes, depuis Epoch indiquant l'heure de démarrage de l'évènement. Retourne à now() - duration s'il n'est pas défini. |
duration (Number, facultatif) |
Durée de l'évènement, exprimée en millisecondes. La valeur par défaut est zéro. |
viewName (String, facultatif) |
Une chaîne que vous pouvez passer pour grouper la demande à une vue. Si vous envoyez un envoi explicitement nul, viewName est ignoré. Vous pouvez également omettre le paramètre viewName pour utiliser le nom de la vue actuelle que vous avez défini dans setView(String name)). |
backendTracingId (String, facultatif) |
Identifiant permettant de créer une trace backend pour cet événement |
meta (object, facultatif) |
Un objet de type « JavaScript » contenant des valeurs sous forme de chaînes de caractères, qui peut être utilisé pour envoyer des métadonnées à Instana uniquement pour cet événement particulier. Contrairement à l'utilisation de l'API de métadonnées, ces métadonnées ne sont pas incluses dans les balises suivantes. |
customMetric (double, facultatif) |
Données de métrique personnalisées avec une précision jusqu'à 4 décimales. N'incluez pas d'informations sensibles dans cette mesure. |
Exemple d'événements personnalisés
Instana.reportEvent('myCustomEvent', {
startTime: Date.now() - 500,
duration: 300,
viewName: 'overridenViewName',
backendTracingId: '31ab91fc1092',
meta: {
state: 'running'
},
customMetric: 123.4567
});
Exclusion d'URL de la surveillance
Les URL peuvent être ignorées en fournissant des expressions régulières ou en les ajoutant à la liste ignoreURLs. Cette fonction est utile lorsque vous souhaitez ignorer toutes les requêtes HTTP contenant des données sensibles, telles qu'un mot de passe.
L'agent doit convertir chaque chaîne que vous fournissez à la setIgnoreURLsByRegex méthode en une expression régulière native pour chaque plateforme prise en charge. Vous pouvez suivre les rejets de promesses, qui vous informent de tout problème rencontré par l'agent pendant que vous interprétez vos données.
static setIgnoreURLsByRegex([]String regexArray)
Le code suivant est une définition de TypeScript :
setIgnoreURLsByRegex(regexArray: Array<string>): Promise<any>;
Exclure les paramètres d' URL
Le tableau suivant répertorie les paramètres d'exclusion d' URL :
| Paramètre | Description |
|---|---|
regexArray |
Un tableau d'objets String contenant l'expression régulière correspondant aux URL à ignorer. |
Renvoie: Promise(Boolean). En cas de rejet, l'exception contient une liste de tous les paramètres qui n'ont pas été convertis en expressions rationnelles natives.
Exclure l'exemple « URL »
export default class App extends Component {
componentDidMount() {
setIgnoreURLsByRegex();
async function setIgnoreURLsByRegex() {
try {
await Instana.setIgnoreURLsByRegex(["http:\/\/localhost:8081.*", "/.*([&?])password=.*/i"]);
} catch (e) {
console.warn(e);
}
}
}
}
Dans cet exemple, toutes les requêtes vers le groupeur Metro et toutes les URL qui contiennent un mot de passe dans la requête sont ignorées.
Masquer les paramètres de requête d' URL
Les paramètres de requête figurant dans les URL collectés peuvent contenir des données sensibles. Par conséquent, l'agent « Instana » prend en charge la définition de modèles d'expressions régulières pour les clés de paramètres de requête dont les valeurs doivent être masquées. Toute valeur devant être expurgée est remplacée par la chaîne de caractères <redacted>. La censure est effectuée au sein de l'agent Instana avant que celui-ci n'envoie ses rapports au serveur Instana. Par conséquent, les données confidentielles ne sont pas transmises aux serveurs d' Instana. pour y être traitées et ne peuvent donc pas être analysées dans l'interface utilisateur de Instana ni récupérées via Instana API.
Par défaut, l'agent « Instana » est configuré avec une liste de trois expressions régulières permettant de masquer automatiquement les valeurs des paramètres de requête pour les clés « password », « key » et « secret ».
static setRedactHTTPQueryByRegex([]String regexArray)
Le code suivant est une définition de TypeScript :
setRedactHTTPQueryByRegex(regexArray: Array<string>): Promise<any>;
Masquer les paramètres de requête d' URL
Le tableau suivant répertorie les paramètres de requête de Redact URL :
| Paramètre | Description |
|---|---|
regex ([NSRegularExpression]) |
Un tableau de String correspondant aux clés des valeurs à expurger. |
Exemple de requête « Redact » dans URL
export default class App extends Component {
componentDidMount() {
setRedactHTTPQueryByRegex();
async function setRedactHTTPQueryByRegex() {
try {
await Instana.setRedactHTTPQueryByRegex(["pass(word|wort)"]);
} catch (e) {
console.warn(e);
}
}
}
}
Cet exemple masque les valeurs des clés de paramètre « password » ou « passwort » de l' HTTP.
L' URL ion https://example.com/accounts/?password=123&passwort=459 capturée est collectée et affichée sous la forme https://example.com/accounts/?password=<redacted>&passwort=<redacted>.
/account/<account id>/status) ou des paramètres matriciels (/account;accountId=<account id>/status) en tant que secrets.Capturer les en-têtes d' HTTP
Si vous le souhaitez, l'agent « Instana » peut enregistrer les en-têtes « HTTP » de chaque requête et réponse suivies.
Une liste de motifs regex peut être définie pour déterminer quels en-têtes doivent être capturés.
Si le même nom d'en-tête est présent à la fois dans une demande et dans sa réponse, seule la valeur de l'en-tête de la réponse est prise en compte.
static setCaptureHeadersByRegex([]String regexArray)
Le code suivant est une définition de TypeScript :
setCaptureHeadersByRegex(regexArray: Array<string>): Promise<any>;
Exemple de capture des en-têtes d' HTTP
export default class App extends Component {
componentDidMount() {
setCaptureHeadersByRegex();
async function setCaptureHeadersByRegex() {
try {
await Instana.setCaptureHeadersByRegex(["cache-control", "etag"]);
} catch (e) {
console.warn(e);
}
}
}
}
Mode d'envoi lent (obsolète depuis la version 2.0.11 )
Par défaut, si l'envoi d'une balise échoue, l'agent Instana tente de la renvoyer jusqu'à ce qu'elle soit envoyée avec succès. Cependant, ce comportement ne fonctionne pas bien avec certains réseaux cellulaires. En activant la fonction « mode d'émission lente », vous pouvez régler l'intervalle d'émission de la balise sur la valeur attribuée au slowSendInterval paramètre. Chaque envoi se compose d'une seule balise au lieu d'un lot (un maximum de 100 balises dans un lot). L'agent « Instana » reste en mode d'envoi lent jusqu'à ce qu'une balise ait été envoyée avec succès.
La plage de valeurs valides pour le slowSendInterval paramètre est comprise entre 2 et 3 600 secondes.
Le code suivant est une définition de TypeScript :
setup(key: string, reportingUrl: string, {slowSendInterval: number}): void;
Exemple de mode d'envoi lent
export default class App extends Component {
componentDidMount() {
var options = {}
options.slowSendInterval = 120.0;
Instana.setup('<your key>', '<your reporting url>', options);
}
}
Identifiant de session utilisateur
Par défaut, la session de l'utilisateur est suivie et un identifiant universel unique (UUID) est généré de manière aléatoire. Cet ID reste inchangé lors de l'installation de l'application. Vous pouvez configurer la durée de validité de l'identifiant de session utilisateur à l'aide du usiRefreshTimeIntervalInHrs paramètre.
Les valeurs de paramètre suivantes indiquent le statut de l'ID de session utilisateur:
Nombre négatif: cette valeur indique que l'ID de session utilisateur n'expire jamais. La valeur par défaut est -1.
Nombre positif : Cette valeur signifie que l'ID de la session de l'utilisateur est actualisé après le délai fixé. Un nouvel UUID est généré et utilisé.
Zéro: Cette valeur indiquée par 0.0 signifie que l'ID de session utilisateur est désactivé.
Le code suivant est une définition de TypeScript :
setup(key: string, reportingUrl: string, {usiRefreshTimeIntervalInHrs: number}): void;
Exemple d'identifiant de session utilisateur
export default class App extends Component {
componentDidMount() {
var options = {}
options.usiRefreshTimeIntervalInHrs = 24.0;
Instana.setup('<your key>', '<your reporting url>', options);
}
}
Balises de limitation de débit
Ce paramètre vous permet de définir le nombre maximal de balises pouvant être envoyées au cours d'un intervalle de temps donné. Le tableau suivant répertorie les options disponibles et les limites de balise correspondantes. Par défaut, 0 (DEFAULT_LIMITS) est sélectionné.
| Limites disponibles | Comptes |
|---|---|
0 (DEFAULT_LIMITS) |
- 500 balises toutes les 5 minutes - 20 balises toutes les 10 secondes |
1 (MID_LIMITS) |
- 1 000 balises toutes les 5 minutes - 40 balises toutes les 10 secondes |
2 (MAX_LIMITS) |
- 2 500 balises toutes les 5 minutes - 100 balises toutes les 10 secondes |
Exemple
class App extends Component {
componentDidMount() {
let options = {};
options.suspendReporting = Instana.androidSuspendReport.LOW_BATTERY_OR_CELLULAR_CONNECTION;
options.rateLimits = 2;
Instana.setup('<your key>', '<your reporting url>', options);
}
}
Corrélation côté serveur avec W3CHeaders
Lorsque l'option enableW3CHeaders ( Boolean , facultative) est activée, l'agent React Native inclut les traceparent en-têtes tracestate et dans tous les appels API surveillés. Ces en-têtes permettent la corrélation au niveau du backend, même si celui-ci n'est pas équipé de l'agent d' Instana. Dans ce cas, vous devez utiliser un outil de surveillance compatible (tel que OpenTelemetry ) pour exporter les détails des traces du backend vers le backend Instana. Si cette option est désactivée, la corrélation avec le backend n'est possible que si celui-ci est également surveillé par l'agent d' Instana. La valeur par défaut est false.
Exemple
class App extends Component {
componentDidMount() {
let options = {};
options.enableW3CHeaders = true;
Instana.setup('<your key>', '<your reporting url>', options);
}
}