> ## 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.

# Breadcrumbs

Beim Debuggen eines Problems in einer Benutzeroberfläche kann es hilfreich sein zu wissen, welche Ereignisse im Vorfeld des aufgetretenen Fehlers stattgefunden haben. Breadcrumbs sind eine zeitlich geordnete Liste von Ereignissen in Ihrer Anwendung, die gefüllt wird, während ein Benutzer Ihre Anwendung durchläuft, und die zusammen mit einem `Span` gesendet wird, sobald ein Fehler von der Bibliothek erfasst wird. So können Sie Informationen sammeln, die nützlich sind, um schwer zu debuggende Fehler zu reproduzieren, indem Sie den Pfad eines Benutzers durch Ihre Anwendung nachvollziehen.

<img src="https://mintcdn.com/appsignal-715f5a51/nF8c1Rwq1cS7b5hg/assets/images/screenshots/frontend/breadcrumbs.svg?fit=max&auto=format&n=nF8c1Rwq1cS7b5hg&q=85&s=1f7cb85f6a8662c46a42a3aa90340eb4" alt="Breadcrumbs" width="648" height="366" data-path="assets/images/screenshots/frontend/breadcrumbs.svg" />

## Verwendung

Standardmäßig werden keine Breadcrumbs erfasst, aber es ist sehr einfach, eigene zu erfassen. Alternativ können Sie eines unserer [Breadcrumb-Plugins](#plugins) verwenden, um bestimmte Arten von Breadcrumbs automatisch zu sammeln.

Überall dort, wo in Ihrer App ein interessantes Ereignis, ein Vorgang oder eine Zustandsänderung auftritt, können Sie einen Breadcrumb wie folgt hinterlassen:

<CodeGroup>
  ```js JavaScript theme={null}
  import Appsignal from "@appsignal/javascript";

  const appsignal = new Appsignal({
    key: "YOUR FRONTEND API KEY",
  });

  appsignal.addBreadcrumb({
    category: "", // e.g. "UI", "Network", "Navigation", "Console"
    action: "", // e.g "The user clicked a button", "HTTP 500 from http://blablabla.com"
    metadata: {}, // key/value metadata in <String, String> format
  });
  ```
</CodeGroup>

Wenn ein Fehler ausgelöst und von der AppSignal-Bibliothek erfasst wird oder ein `Span` an `appsignal.send()` übergeben wird, wird die aktuelle Liste der Breadcrumbs zum aktuellen `Span` hinzugefügt und an den Server gesendet. Die Liste der Breadcrumbs wird anschließend geleert.

## Breadcrumb-Optionen

| Option   | Typ                      | Beschreibung                                                                       |
| -------- | ------------------------ | ---------------------------------------------------------------------------------- |
| category | String                   | Kategorie, unter der das Ereignis eingeordnet wird                                 |
| action   | String                   | Kontextbezogene Informationen zum Ereignis                                         |
| message  | String                   | (optional) Eine Logmeldung oder ein anderer String, der an AppSignal gesendet wird |
| metadata | `Object<String, String>` | (optional) Ein Objekt mit Metadaten zum Ereignis                                   |

## Plugins

Es stehen einige Plugins zur Verfügung, um die automatische Erfassung von Breadcrumbs zu ermöglichen, und im Laufe der Zeit werden weitere hinzukommen:

* [`@appsignal/plugin-breadcrumbs-console`](https://github.com/appsignal/appsignal-javascript/tree/develop/packages/plugin-breadcrumbs-console)
* [`@appsignal/plugin-breadcrumbs-network`](https://github.com/appsignal/appsignal-javascript/tree/develop/packages/plugin-breadcrumbs-network)

Haben Sie eine gute Idee für ein Breadcrumbs-Plugin? Nehmen Sie Kontakt mit uns auf oder [hinterlassen Sie ein Issue auf GitHub](https://github.com/appsignal/appsignal-javascript/issues)!