このシナリオはどんな人向けですか？
フロントエンド担当 向けです。複数の手掛かりをつなぎながら復旧まで持っていく練習向けです。所要時間の目安は 12 分で、 最初に見えている症状は 「ブラウザのコンソールに `No 'Access-Control-Allow-Origin' header` エラー」 です。 本番にデプロイしたら、フロントエンドがAPIを叩けなくなった。開発環境ではちゃんと動いていたのに…
本番にデプロイしたら、フロントエンドがAPIを叩けなくなった。開発環境ではちゃんと動いていたのに…
このシナリオで練習すること
複数の手掛かりをつなぎながら復旧まで持っていく練習向けです。
想定ロール
フロントエンド担当
到達目標
本番ドメインからAPIを叩いても CORS エラーが出ないようにする
同じ難易度か、次に進みやすいシナリオを選んでいます。
フロントエンド担当 向けです。複数の手掛かりをつなぎながら復旧まで持っていく練習向けです。所要時間の目安は 12 分で、 最初に見えている症状は 「ブラウザのコンソールに `No 'Access-Control-Allow-Origin' header` エラー」 です。 本番にデプロイしたら、フロントエンドがAPIを叩けなくなった。開発環境ではちゃんと動いていたのに…
本番ドメインからAPIを叩いても CORS エラーが出ないようにするのがゴールです。原因の特定そのものより、まず利用者への影響を止めるところまで辿り着けるかを見ています。復旧後に「なぜ起きたか」を説明できる状態になっていれば十分です。
まずは症状を読み、 ログ・設定・再起動の どこから見るかを 決めると進めやすくなります。 help、 ls、 cat、 grep などの基本コマンドから入るのがおすすめです。 このシナリオでは CORS はサーバー側のヘッダー応答で制御される、 ブラウザのネットワークタブ・コンソールエラーの読み方 を扱うので、 そのあたりを意識して進めると 身につきやすいです。