💡 記事の下にエディタを用意しています。壊してもOK!
更新日: 2025年3月1日
JavaScriptのfetchでエラーハンドリングする方法
📌
結論
res.ok でエラーをチェックしよう
📝 実際のコードはこちら
const res = await fetch(url);
if (!res.ok) throw new Error('通信エラー');
const data = await res.json();まとめ
・res.ok が false ならHTTPエラー
・エラー時は throw で例外を投げる
演習で試してみよう
fetchのエラーチェックを実装してみましょう。🧪 ここで試せます ─ 壊しても大丈夫!
下のエディタで実際にコードを書いて、すぐにプレビューで確認できます。何度でもやり直せるので、思い切って色々試してみてください。
■ 演習
fetchで取得し、res.okがfalseならエラーとconsole.log、trueならデータのtitleを出力してください。
詰まったらヒント
if (!res.ok) { ... } else { ... }