フロントエンド・アプリでのエラートラッキング
Sentryによるエラートラッキング
VaxilaはOpenTelemetryを主に利用していますが、SentryのSDKを使ってエラーを収集することもできます。
SentryのSDKを利用することによって、フロントエンドやアプリなどOpenTelemetryでは収集できない場所のデータを集めることができます。
このページではSentryを使ったエラートラッキングの方法を紹介します。
このページではReactへの導入方法を例に紹介しますが、他の言語・フレームワークの場合も同様の手順で設定できます。各言語についてはSentry SDKのページを参照してください
例: Reactへの導入
以下のステップで導入できます
Sentry SDKのインストール
送信先設定
1. Sentry SDKのインストール
Sentry のSDKの中から、React用のSDKを探し、インストールします。
2. 送信先設定
Sentryの初期化時、以下のように設定するとSentryからVaxilaにエラーを送信することができます。
この例では次の項目を設定しています。
dsn
データの送信先です。サービス名とVaxilaのクライアントトークンを設定して
telemetry.vaxila-labs.com
へデータを送信するようにしています。
environment
環境の名前です。 productionやstagingなど、適切な名前を設定します。
release
バージョンの名前です。git のハッシュ値やタグの名前など、適切な名前を設定します。
autoSessionTracking
Sentryがセッション情報を送信するかどうかの設定です。Vaxilaはエラー以外の情報を無視するので通信量削減のため送信自体を停止するのを推奨しています。
全体像
以上でSentryへの対応は終わりです。
あとは完成したコードを既存のコードに追加するだけです。
例えば、TypeScriptを使用した場合、 src/main.tsx
は以下のようになります。
最終更新