Réseau

Le SDK enregistre l’activité réseau de la page. Les requêtes apparaissent dans le panneau réseau du replay, erreurs mises en évidence, et comptent dans le nombre d’erreurs de la liste des sessions (réponses 4xx et 5xx, échecs réseau, délais dépassés ; une requête annulée n’est pas une erreur).

Ce qui est enregistré

• Les requêtes fetch et XMLHttpRequest de la page : méthode, URL, statut, durée, taille annoncée (Content-Length) et, en cas d’échec, sa nature : network, timeout ou aborted.
• Les ressources chargées pendant l’enregistrement (scripts, feuilles de style, images, polices…), avec leur statut et leur taille quand le navigateur les expose.

Aucun en-tête n’est enregistré, et aucun corps, sauf pour les requêtes en erreur si tu l’actives (plus bas). Les requêtes vers apiHost (envoi des enregistrements, script du SDK) ne sont jamais enregistrées.

Rien n’est enregistré avant startSession() ni après stopSession(), qui rétablit fetch et XMLHttpRequest.

Désactiver : captureNetwork

belvdr.init('pk_…', { apiHost: 'https://api.belvdr.com', captureNetwork: false })

Avec captureNetwork: false, rien n’est enregistré, et fetch et XMLHttpRequest ne sont pas modifiés.

Masquer les URL

Les URL sont nettoyées dans le navigateur, avant l’envoi :

• les identifiants (https://user:password@…) sont retirés ;
• les valeurs des paramètres sensibles sont remplacées par [masked], dans la requête comme dans le fragment (#…) : token, key, secret, password, auth, signature, email, code, session, card, iban…, y compris en snake_case ou camelCase (api_key, accessToken, X-Amz-Signature).

Pour aller plus loin, maskNetworkUrl reçoit l’URL absolue de chaque requête et renvoie l’URL à enregistrer, ou null pour ignorer la requête :

belvdr.init('pk_…', {
  apiHost: 'https://api.belvdr.com',
  maskNetworkUrl: (url) => {
    if (url.includes('/interne/')) return null // requête ignorée
    return url.replace(/\/clients\/\d+/, '/clients/:id')
  },
})

Le nettoyage automatique s’applique toujours au résultat. Un maskNetworkUrl qui lève une exception ignore la requête.

Corps des requêtes en erreur

Pour déboguer une erreur serveur, captureErrorBodies: true enregistre le corps envoyé et le corps reçu des requêtes fetch et XMLHttpRequest qui reçoivent une réponse 4xx ou 5xx. Désactivé par défaut.

belvdr.init('pk_…', { apiHost: 'https://api.belvdr.com', captureErrorBodies: true })

Les corps sont lus sur une copie : la page reçoit sa réponse intacte. Dans le replay, ils se déplient sous la requête en erreur. Garde-fous toujours actifs, dans le navigateur :

• Corps textuels uniquement : chaîne, URLSearchParams, Request, et réponses text/*, JSON, XML ou formulaire. Ni FormData, ni Blob, ni binaire, ni réponse sans Content-Type.
• Clés sensibles masquées : leurs valeurs sont remplacées par [masked] à toute profondeur (objets imbriqués, tableaux ; un objet sous une clé sensible est masqué en entier), dans le JSON et les formulaires. Mêmes noms que pour les URL (password, mot_de_passe, token, secret, authorization, card, cvc, iban, email…), sauf code, errorCode et statusCode, gardés pour les codes d’erreur.
• 10 Ko au plus par corps : au-delà, le corps est tronqué et marqué comme tel.

Réécrire un corps : maskNetworkBody

maskNetworkBody reçoit le texte brut d’un corps et son contexte, et renvoie le texte à enregistrer, ou null pour ne pas l’enregistrer :

belvdr.init('pk_…', {
  apiHost: 'https://api.belvdr.com',
  captureErrorBodies: true,
  maskNetworkBody: (body, { kind, url, method, status }) => {
    if (url.includes('/paiement')) return null // corps exclu, la requête reste enregistrée
    return body.replace(/\b\d{16}\b/g, '[carte]')
  },
})

• kind vaut request (corps envoyé) ou response (corps reçu) ; url est absolue.
• Le masquage automatique et la limite de 10 Ko s’appliquent toujours au résultat.
• Un maskNetworkBody qui lève une exception exclut le corps ; la requête reste enregistrée.