> ## Documentation Index
> Fetch the complete documentation index at: https://docs.appsignal.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Interception d'erreurs front-end

Pour signaler une erreur à AppSignal, interceptez l'erreur et transmettez-la à la fonction utilitaire `sendError`.

Si vous utilisez TypeScript, pour utiliser la fonction utilitaire `sendError`, l'argument doit être une instance de `Error` ou `ErrorEvent`. C'est parce qu'en TypeScript, les variables interceptées sont de type `unknown` par défaut en mode strict depuis la version 4.4.

<CodeGroup>
  ```javascript JavaScript theme={null}
  try {
    // do something that might throw an error
  } catch (error) {
    if (error instanceof Error || error instanceof ErrorEvent) {
      appsignal.sendError(error)
      // handle the error
    }
  }

  // You can catch errors asynchronously by listening to Promises...
  asyncActionThatReturnsAPromise().catch(error => appsignal.sendError(error))

  // ...or by using async/await
  async function() {
    try {
      const result = await asyncActionThatReturnsAPromise()
    } catch (error) {
      if (error instanceof Error || error instanceof ErrorEvent) {
        appsignal.sendError(error)
        // handle the error
      }

    }
  }

  // ...or in an event handler or callback function
  events.on("event", (err) => { appsignal.sendError(err) })
  ```
</CodeGroup>

## Ajouter des métadonnées aux erreurs

Pour ajouter des métadonnées supplémentaires aux erreurs envoyées avec `sendError`, utilisez l'argument de fonction de rappel. Ce rappel reçoit le Span actuel pour l'erreur en argument et permet de le modifier avant qu'il soit envoyé aux serveurs AppSignal.

Consultez la [page de l'API Span][span api] pour plus d'informations sur toutes les données qui peuvent être définies sur un Span.

<CodeGroup>
  ```javascript JavaScript theme={null}
  try {
    // do something that might throw an error
  } catch (error) {
    appsignal.sendError(error, (span) => {
      span.setAction("MyCustomAction");
      span.setNamespace("custom_namespace");
      span.setTags({ tag1: "value 1", tag2: "value 2" });
    });
    // handle the error
  }
  ```
</CodeGroup>

## Exceptions non interceptées

Les exceptions non interceptées **ne** sont **pas** capturées par défaut. Nous avons pris la décision de ne pas inclure cette fonctionnalité dans la bibliothèque principale en raison de la grande quantité de bruit provenant des extensions de navigateur, bloqueurs de publicités, etc., ce qui rend généralement les bibliothèques de ce type moins efficaces.

Nous recommandons d'utiliser une [intégration](/front-end/integrations/) appropriée comme meilleur moyen de gérer les exceptions, ou, si vous *préférez* capturer les exceptions non interceptées, vous pouvez le faire en utilisant le package [`@appsignal/plugin-window-events`](/front-end/plugins/plugin-window-events) en complément.

## Encapsuler un bloc de code

La bibliothèque fournit une méthode pratique pour encapsuler un bloc de code et envoyer toute erreur levée dans celui-ci directement à AppSignal. Il s'agit de la méthode `appsignal.wrap()`, une fonction asynchrone qui renvoie une `Promise`. Une fonction doit être passée en argument contenant le code que vous souhaitez encapsuler.

<CodeGroup>
  ```javascript JavaScript theme={null}
  try {
    await appsignal.wrap(() => {
      // catch any error from sync or async code here
    });
  } catch (e) {
    // do something else with the error here, the
    // error has already been sent to AppSignal
  }

  // Alternative usage
  appsignal
    .wrap(() => {
      // catch any error from sync or async code here
    })
    .catch((e) => {
      // do something else with the error here, the
      // error has already been sent to AppSignal
    });
  ```
</CodeGroup>

Si une erreur est levée n'importe où dans cette fonction, nous retournons une promesse rejetée avec l'`Error` passée en argument au gestionnaire `catch`.

### Ajouter des métadonnées aux erreurs encapsulées

Pour ajouter des métadonnées supplémentaires aux erreurs capturées et envoyées avec `wrap`, utilisez l'argument de fonction de rappel. Ce rappel reçoit le Span actuel pour l'erreur en argument et permet de le modifier avant qu'il soit envoyé aux serveurs AppSignal.

Consultez la [page de l'API Span][span api] pour plus d'informations sur toutes les données qui peuvent être définies sur un Span.

<CodeGroup>
  ```javascript JavaScript theme={null}
  appsignal.wrap(
    () => {
      throw new Error("Test error");
    },
    (span) => {
      span.setAction("MyCustomAction");
      span.setNamespace("custom_namespace");
      span.setTags({ tag1: "value 1", tag2: "value 2" });
    },
  );
  ```
</CodeGroup>

## Erreurs GraphQL

Si vous utilisez le client GraphQL `urql`, veuillez consulter la [documentation de `@appsignal/urql`](/front-end/integrations/urql) pour les instructions sur la façon de configurer le rapport d'erreurs depuis GraphQL.

[span api]: /front-end/span.html