Sentryにエラーレポートが送信される手前でなにかやりたい、あるいは200KB制限によるレポートロストの回避

タイトルどおり。 アプリケーションでエラーが出た場合にSentryにエラーレポートを飛ばしていたのだけど、送信する手前でなんかごにょごにょやりたくなったので調べた。

beforeSend

Sentryのドキュメント、ものすごく目的のものを見つけづらい。

docs.sentry.io

やりたいことはこのDocsに書いてあるとおりで、Sentry.initする際の引数のオブジェクトにbeforeSendがある。

import * as Sentry from '@sentry/browser';

Sentry.init({
  beforeSend(event, hint) {
    console.log(event);
    console.log(hint);
    return event;
  }
});

eventはSentryに送られるレポートのデータが入っている。idとかデバイス名とかなんやかんや色々。ようはレポート上で見れるデータがこれ。

hintは発生したオリジナルのエラーexception。

beforeSend関数で返したeventオブジェクトが最終的なSentryレポートになって、nullを返すとこのエラーレポートは破棄される。

なにをやりたかったか

Sentryに追加で送信する任意のデータの枠にextraという概念がある。Sentry.setExtraあるいはSentry.setExtrasでセットできる。

docs.sentry.io

で、ここにバンバン必要なレポートデータを詰めていくと便利なのだけど、Sentryは1レポート200KBの制限があってこれを超過するとエラーレポート自体が送信されないという問題がある(つまりエラーが起こったことがわからない)。厳密にはSentry側が課している成約というよりはFetchとブラウザの仕様らしい。

エラーデータは動的なのでケースバイケースで200KB超過してしまってエラーレポートがもみ消されたりしていては困るので、Sentryに送信する前にデータサイズを見て、データをなんとかして200KB以下に抑えたかった。

Reduxのトラッキングを送信するケース

具体的にextraになにを入れたかったかというと、Reduxのstateの一部だったりdispatchされたactionをレポートに添えたかったというニーズがあった。

github.com

これはRedux middlewareのライブラリで、ReduxサイクルのトラッキングをしてSentryのextraにReduxの操作を突っ込んでくれる便利なライブラリ。

外部依存モジュールなしの素朴なjsファイル1枚だけのmiddlewareなのだけど、自前で用意するよりうまくできているので、これを突っ込んでおくだけでいい感じにReduxのトラッキングをしてくれて便利。

ただSentryのドキュメントで「stateは大きいかもしれんからextraに突っ込むなら気をつけて」的な言い回しがあり、実際このライブラリを使うとケースによっては200KBを超えていく可能性がある。

そういうわけで前述beforeSendで200KB超えた場合の処理をしたかったという経緯がある。

ちなみにサイズを測るには

beforeSendでサイズを見るには第1引数のeventのサイズを見ればよくて、npmライブラリだとこの辺が使えると思う。

www.npmjs.com

www.npmjs.com

200KB=200000byteなので、200000byteを超えてたら諦めてよさそうなデータを削るとかそういう作戦をとれる。


ようはbeforeSendでSentryに送信されるレポートデータを加工したりできて、いい感じにやれるというはなし。