Tail Worker と Stack Trace と Source Map
前回こちらの記事で Tail Worker についてまとめました。 簡単に言うと、Tail Worker は親 Worker の実行を追跡し例外エラー等が発生した際にスローされたエラーを受け取りログ出力する機能を担います。
2024年4月4日にさらなる追加機能のリリース予告が発表されStack Trace と Source Map により例外エラーが発生した際のデバッグが容易となるとのことです。 その後無事機能がリリースされたので試してみます。
さっそくやってみる
まず
の内容を終わらせておきます。
その後以下のようにProducer と Tail Worker の内容を修正します。
export default {
async fetch(request, env, ctx) {
return new Response(a);
},
};
name = "tailproducer"
main = "src/worker.js"
compatibility_date = "2024-04-15"
tail_consumers = [{service = "tailworker"}]
upload_source_maps = true
export default {
async tail(events,env,ctx) {
console.log(events);
await fetch("https://kameda.requestcatcher.com/", {
method: "POST",
body: JSON.stringify(events),
})
}
}
(変更なし)
修正後は両方ともwrangler publishを実行しデプロイしておきます。
簡単な解説です。
まず、producer - worker.jsですが宣言されてないaをreturnで戻そうとするため当然例外エラーが発生します。その結果がtail workerに投げられます。producer - wrangler.tomlでupload_source_maps = trueと定義されておるため、source map 情報が自動で作成されておりこれに基づくエラー原因を推察可能となる情報が tail worker へ投げられます。
tail - worker.jsではproducerを追跡した結果として受け取った情報を
await fetch("https://kameda.requestcatcher.com/"
へ投げます。なお、Cloudflareのdocumentではawaitがサンプルについていませんが、awaitが
無いとほとんどの場合POSTが失敗するので付与しておきます。
投げ先ですが、https://requestcatcher.com/にアクセスします。

kamedaと入力してGet startedボタンを押すとPOSTを受け付けるようになります。なんと素晴らしいサイトでしょうか。感謝です。
この状態でproducer workers にブラウザでアクセスしてください。当然以下のように例外エラーとなります。

このエラーを受け取ったtail workerがhttps://kameda.requestcatcher.com/にエラーの内容をPOSTします。

JSONをパースしてみると以下の情報が含まれています。
"exceptions":[
{
"stack":" at Object.fetch (worker.js:4:25)",
"name":"ReferenceError",
"message":"a is not defined",
"timestamp":1713940164291
}
aが宣言されていない可能性が示唆されています。
マネージメントコンソールでの確認
今度はエラーを吐いているproducer worker をマネージメントコンソールで確認してみます。

画面右のEdit Codeをクリックします。

Sendボタンを押してGETリクエストを出してみます。
Previewタブをクリックすると以下のようにエラーの原因を推察可能な情報が出力されています。

先ほどtail workerが受け取ったものと同じ情報です。
また画面下部ConsoleタブではStack Traceの情報が出力されています。

Discussion