Open5
Next.js(SSR)にSentryを導入する
公式docを参考にwizardで構築
本番環境にデプロイすると、ビルド時に401エラーになったので、以下のドキュメントを参考にSENTRY_AUTH_TOKEN
を追加
ここからカスタマイズをしていくに当たって、以下の記事を参考に設定を変更
【traceSampleRateについて】
MVPでの利用と、無料枠で使いたいということもあり、低めに設定(アドバイスあればコメントください🙏)
tracesSampler: (samplingContext) => {
if (process.env.NEXT_PUBLIC_BUILD_ENV === 'production') {
return 0.5;
} else if (process.env.NEXT_PUBLIC_BUILD_ENV === 'staging') {
return 0.25;
}
return 0;
}
【本番環境でもソースマップがアップロードされてしまうについて】
デプロイしたソースを確認してみると、ソースマップがアップロードされていたので、記事に記載の通りにビルド用のnpmコマンドを変更
ただし、amplifyではnext build && next export
ではなくnext build
のみなので、同じ方法では解決しなかった。
(続く🐧)
以下の記事を参考にソースマップを隠蔽
今回自分はamplifyを使っているので、以下のコマンドを追加
"postbuild": "find .next -name \\*.css.map -or -name \\*.js.map -delete",
とりあえずstaging環境とproduction環境でエラー検知ができるようになったので、あとはエラーがあったらSlackに通知するようにする
SentryにはSlackのIntegrationがある
ただ、有料プランでしか使えないので今回は利用しない。
ということで、webhook Integrationでgasを実行し、その中でslackに通知するようにした。
メッセージは以下のページでインターフェースを作成。
gasのソースはgistに置いておく。
こんな感じでできた