例外処理について考える

2024.12.19
フロントエンドチョットデキル ミニ #01で登壇

Transcript

1. 例外処理について考える Shumpei / 2024.12.19
2. Shumpei / chot inc. フロントエンドエンジニア X: @seventhseven https://x.com/seventhseven （mixi2はじめました） 自己紹介
3. 今日のゴール • 例外とエラーとは何かについて知る • 例外処理について考えるきっかけに
4. おことわり • 例外処理についてあまり深く勉強してこなかったけど、 ずっと気になっていたテーマです • そのため、今回は自分なりにまとめたことを共有する。 という形で発表します • Webアプリケーションを想定しています
5. 結論（めいたもの） • 例外処理に正解はない。 そのシステムに関わる人や状況・性質によってハンドリングするもの。 • 例外処理は安全にアプリケーションが壊れるためにある ”あそび”のようなもの
6. アジェンダ • 例外とエラーの違い • UIから見る例外処理 • エラーログにあると嬉しいもの • エラークラスを拡張してみる • まとめ
7. アジェンダ • 例外とエラーの違い 👈 • UIから見る例外処理 • エラーログにあると嬉しいもの • エラークラスを拡張してみる • まとめ
8. 例外 プログラムで対処できる問題 • 配列の存在しないインデックスにア クセスしてしまう • 読み込もうとしたファイルが 存在していない etc… 例外とエラーの違い エラー それ以外のシステムレベルを超えた問 題 • メモリ不足や故障 • 掃除のおばちゃんがサーバの 電源を落とした etc…
9. 例外 プログラムで対処できる問題 • 配列の存在しないインデックスにア クセスしてしまう • 読み込もうとしたファイルが 存在していない etc… 例外とエラーの違い エラー それ以外のシステムレベルを超えた問 題 • メモリ不足や故障 • 掃除のおばちゃんがサーバの 電源を落とした etc…
10. 例外 プログラムで対処できる問題 • 配列の存在しないインデックスにア クセスしてしまう • 読み込もうとしたファイルが 存在していない etc… 例外とエラーの違い エラー それ以外のシステムレベルを超えた問 題 • メモリ不足や故障 • 掃除のおばちゃんがサーバの 電源を落とした etc… ただし、現実的には厳密に区別・定義されておらず、コンテキストによってマチマチなのが現状。。。
11. 言語による例外の扱いの違い 言語によっても違いがあります。 JavaScript / Python try/catch で捕捉する機構 や、 throw/raise キーワードに よる例外を発生させる Go言語 error 型で値を返却する err := errors.New("エラーが 発生しました") Java try/catch で捕捉する機構 や、 検査例外・非検査例外でコ ンパイル時に関数をチェッ クする （現代ではあまり検査例外は使 用されていない模様）
12. 言語による例外の扱いの違い 言語によっても違いがあります。 JavaScript / Python try/catch で捕捉する機構 や、 throw/raise キーワードに よる例外を発生させる Go言語 error 型で値を返却する err := errors.New("エラーが 発生しました") Java try/catch で捕捉する機構 や、 検査例外・非検査例外でコ ンパイル時に関数をチェッ クする （現代ではあまり検査例外は使 用されていない模様）
13. 言語による例外の扱いの違い 言語によっても違いがあります。 JavaScript / Python try/catch で捕捉する機構 や、 throw/raise キーワードに よる例外を発生させる Go言語 error 型で値を返却する err := errors.New("エラーが 発生しました") Java try/catch で捕捉する機構 や、 検査例外・非検査例外でコ ンパイル時に関数をチェッ クする （現代ではあまり検査例外は使 用されていない模様）
14. アジェンダ • 例外とエラーの違い • UIから見る例外処理 👈 • エラーログにあると嬉しいもの • エラークラスを拡張してみる • まとめ
15. UIから見る例外処理 システムを使用するユーザが遭遇する例外・エラーの例 • ネットワークエラー • メモリ不足によるハング • 強制終了・異常終了 • バリデーションエラー • 404 etc…
19. UIから見る例外処理 処理の結果がユーザが期待するものではないものの、 ユーザが次に取れる行動を示せている点は、 使用者・管理者ともにストレスを緩和する効果がありそうです。
20. アジェンダ • 例外とエラーの違い • UIから見る例外処理 • エラーログにあると嬉しいもの 👈 • エラークラスを拡張してみる • まとめ
21. エラーログにあると嬉しいもの 例外が発生した場合、その処理・プロセスは基本的には直ちに終了するほうが 後続処理に影響がでないため良いです。 ただ、それでも例外処理が必要な場合、 エラーログを適切に設定しておくと原因調査のときに役立ちます。
22. エラーログにあると嬉しいもの 例外が発生した場合、その処理・プロセスは基本的には直ちに終了するほうが 後続処理に影響がでないため良いです。 ただ、それでも例外処理が必要な場合、 エラーログを適切に設定しておくと原因調査のときに役立ちます。 →トレーサビリティを高くする
23. トレーサビリティを高くする 下記のようにある程度明確であればシステムのどこで 不具合が起きているのかが追いかけやすい • タイムスタンプ • ログレベル • エラータイプ • エラーメッセージ • スタックトレース • ブラウザやIPの情報 • システムのバージョン番号 • ユーザロール • エラーがおきたURLや最後に実行したアクション（ボタン クリックなど） • エンドポイント など…
24. アジェンダ • 例外とエラーの違い • UIから見る例外処理 • エラーログにあると嬉しいもの • エラークラスを拡張してみる 👈 • まとめ
25. エラークラスを拡張してみる ここでは JavaScript を例に、記事などを引用しつつ紹介します。 https://www.builder.io/blog/safe-data-fetching
26. エラークラスを拡張してみる 1. ただ try/catch で囲ってみます
27. エラークラスを拡張してみる 1. ただ try/catch で囲ってみます 2. resが無防備なため、値が正常値か チェックする箇所を追加します。 👉
28. エラークラスを拡張してみる 3. 単純にErrorインスタンスを作ると、 例外が発生した res が何なのか情報が 渡ってきません。 そこで拡張したクラスを作り、コンストラ クタに res を受け渡すことで catch 節で 扱えるようになります。
29. エラークラスを拡張してみる 4. 例えばステータスコードごとに処理を 分けるなどが実装できます。
30. エラークラスを拡張してみる また、デフォルトで Error クラスでは cause プロパティがあり、 開発者が自由にエラーメッセージを拡張することが出来ます。 https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Error/cause
31. エラークラスを拡張してみる cause には err をそのまま詰め込む以 外にも、自身で設定した構造体を 渡すことも出来ます。 try/catch は入れ子にできるので、 自身で例外発生してもその場で処理せ ず、呼び出し元の関数でハンドリングを 任せる際にも手がかりを渡せるので有 効な手段です。
32. アジェンダ • 例外とエラーの違い • UIから見る例外処理 • エラーログにあると嬉しいもの • エラークラスを拡張してみる • まとめ 👈
33. まとめ 👉 エラー管理の基本方針 • エラーについては管理コストに見合わないため、基本的に例外処理はしない 👉 例外処理の基本方針 • 発生したらただちに終了させる • 後続処理に与える影響を抑えるため、 異常値を見つけたらプロセスやアプリケーションを終了させる • ログを残す場合はトレーサビリティを意識する • 例外処理をしっかりハンドリングしたい場合は拡張することを検討する
34. まとめ 👉 その他 • バッチ処理などを実装する場合、どうしてもリトライしたいような長い処理時間のものについ ては、重複して処理を行わないことや、エラーが起きたことがわかる ようにしておく
35. ありがとうございました