@appsignal/urql - AppSignal Documentation

urql ist ein GraphQL-Client für JavaScript-Anwendungen. Das Paket @appsignal/urql stellt einen Custom Exchange bereit, der, sobald er zu Ihrem urql-Client hinzugefügt wurde, automatisch alle GraphQL-Fehler abfängt und an AppSignal meldet.

Installation

`npm` oder `yarn`

Fügen Sie die Pakete @appsignal/urql und @appsignal/javascript zu Ihrer package.json hinzu. Führen Sie dann npm install/yarn install aus. Sie können diese Pakete auch auf der Kommandozeile zu Ihrer package.json hinzufügen:

yarn add @appsignal/javascript @appsignal/urql
npm install @appsignal/javascript @appsignal/urql

JSPM.io Import Maps

Mit dem JSPM.io Import Map Generator können Sie eine Import Map für die Abhängigkeiten Ihrer Anwendung generieren. Fügen Sie @appsignal/javascript und @appsignal/urql zur Liste der Abhängigkeiten im Generator hinzu, und integrieren Sie dann die generierte Import Map sowie ES-Module-Shims in den Code Ihrer Anwendung.

`rails-importmap`

Verwenden Sie den folgenden Befehl, um diese Pakete zu den Import Maps Ihrer Rails-Anwendung hinzuzufügen:

./bin/importmap pin @appsignal/javascript @appsignal/urql

Verwendung

Exchange zum Client hinzufügen

Das Paket @appsignal/urql stellt einen Custom-urql-Exchange bereit, der GraphQL-Fehler automatisch an AppSignal meldet. Dieser Exchange fängt alle Query- und Mutation-Ergebnisse ab und meldet alle Fehler, ohne dass Änderungen an einzelnen useQuery-Aufrufen erforderlich sind.

import { createClient, fetchExchange } from "urql";
import Appsignal from "@appsignal/javascript";
import { createAppsignalExchange } from "@appsignal/urql";

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

const client = createClient({
  url: "https://api.example.com/graphql",
  exchanges: [createAppsignalExchange(appsignal), fetchExchange],
});

Der Exchange wird automatisch:

Alle GraphQL-Fehler an AppSignal melden
Den GraphQL-Query-Body als Parameter einschließen (sichtbar in den AppSignal-Fehlerdetails)
Die Endpunkt-URL als Tag einschließen
Operation-Name und -Typ als Tags einschließen (sofern verfügbar)

Fehlerdetails

Wenn ein GraphQL-Fehler auftritt, erhält AppSignal:

Fehlermeldung: Eine Verkettung aller GraphQL-Fehlermeldungen
Tags:
- endpoint: Die URL des GraphQL-Endpunkts
- operationName: Der Name der GraphQL-Operation (sofern angegeben)
- operationType: Der Typ der Operation (Query, Mutation, Subscription)
Parameter:
- query: Der vollständige GraphQL-Query-Body