開発者向け作業フロー
HTTP レスポンスヘッダーを確認する
CORS、キャッシュ、リダイレクト、Cookie、ブラウザ保護用のヘッダーを変更する前に、curl、ブラウザ DevTools、API クライアント、CDN ログからレスポンスヘッダーを取得して比較する手順です。
課題
HTTP ヘッダーは多くの本番障害の原因を説明しますが、コピーしたヘッダーブロックには Set-Cookie の重複、CDN の Cache-Control、プロキシの CORS、ホスティングのリダイレクト、フレームワークが追加した保護用ヘッダーが混ざります。本文やステータスコードだけを見ると、ブラウザ動作を決める設定を見落としやすくなります。
使う場面
- CORS、credentials、preflight レスポンスヘッダーが原因でブラウザ要求が止まるときに使います。
- デプロイ後も CDN やブラウザが古い内容を返し続けるときに適しています。
- リダイレクト、API 要求、ログインコールバックが環境ごとに違って動くときに役立ちます。
- curl、DevTools、API クライアント、本番ログのレスポンスヘッダーを同じ基準で比較したいときに使います。
- ホスティングや CDN 設定で security、cache、cookie の変更をデプロイし、次の設定変更前に証拠が必要なときに使います。
手順
- 手順 1
生のヘッダーを取得
ブラウザ DevTools、`curl -I`、API クライアント、CDN ログ、サーバーログからレスポンスヘッダー全体をコピーします。可能ならステータス行も残します。
- 手順 2
共有前に機密値を除く
ヘッダーブロックをチケットやチャットに貼る前に、セッション Cookie、Bearer トークン、API key、ユーザー ID、内部ホスト名を削除します。
- 手順 3
設定変更前に解析
`HTTP Header Parser` に貼り付け、名前を正規化し、cache、CORS、content、security、request、response のグループに分けます。
- 手順 4
重複ヘッダーを確認
`set-cookie`、`vary`、`cache-control`、重複した `access-control-*` を確認します。正常な重複もありますが、意図しない重複はブラウザ挙動を分かりにくくします。
- 手順 5
症状に沿って追跡
古い内容なら cache ヘッダー、ブラウザでブロックされる要求なら CORS、ログイン失敗なら redirect、cookie、token 関連ヘッダーから比較します。
- 手順 6
対象 URL と一緒に記録
リダイレクトやコールバックの問題では `URL Parser` と `Query String Parser` で URL も確認し、解析したヘッダー要約をデバッグメモに残します。
例
HTTP レスポンスヘッダーを確認するの例
入力
HTTP/2 200
content-type: application/json; charset=utf-8
cache-control: public, max-age=3600
access-control-allow-origin: https://app.example.com
vary: origin, accept-encoding
strict-transport-security: max-age=31536000; includeSubDomains出力
Start line: HTTP/2 200
Total headers: 5
Cache headers: cache-control, vary
CORS headers: access-control-allow-origin
Security headers: strict-transport-securityよくあるミス
レスポンス本文だけを見る
JSON 本文が正しく見えても、cache、CORS、cookie、security ヘッダーによりブラウザが応答を拒否したり再利用したりします。
ヘッダーの追加元を無視する
ヘッダーはアプリ、フレームワークミドルウェア、CDN、リバースプロキシ、ホスティング既定値から来ます。アプリを直す前に環境差を比べます。
すべての重複をバグ扱いする
`set-cookie` は複数回出るのが普通です。ヘッダー名とブラウザ挙動を確認せずに重複を削除しないでください。
最終リクエストだけ見て preflight を見落とす
CORS 問題は最終 API 応答ではなく OPTIONS preflight 応答で起きることがあります。ブラウザが cross-origin 要求を止める場合は両方を取得します。
Cookie やトークンをそのまま共有する
ヘッダーのスクリーンショットやログにはセッション Cookie、Bearer トークン、ユーザー識別子が入ることがあります。共有前に機密値をマスクします。
よくある質問
個人 Cookie やトークンを貼り付けてもよいですか?
共有用メモやスクリーンショットでは、セッション ID、トークン、API キー、ユーザー識別子を削除してください。ローカル解析でもコピーした出力は漏れる可能性があります。
レスポンスヘッダーで CORS エラーを説明できますか?
はい。CORS 失敗は `access-control-allow-origin`、credentials、methods、allowed headers、preflight 応答の組み合わせに左右されます。
curl とブラウザでヘッダーが違うのはなぜですか?
要求ヘッダー、Cookie、リダイレクト、プロトコル、キャッシュが違う可能性があります。正確な URL と要求条件をそろえて比較します。
キャッシュ問題ではどのヘッダーを先に見ますか?
`cache-control`、`etag`、`last-modified`、`age`、`vary`、CDN 関連ヘッダーを先に見ます。ブラウザキャッシュと CDN キャッシュで規則が違う場合があります。
ブラウザ保護用のヘッダーでは何を確認しますか?
コンテンツ読み込み、HTTPS 強制、iframe 埋め込み、参照元送信、ブラウザ機能の許可を制限するヘッダーが、画面表示や API フローを止めていないか確認します。
レスポンスヘッダーだけでなくリクエストヘッダーも必要ですか?
必要なことが多いです。CORS、cache、content negotiation、cookie、authorization の動作はリクエストヘッダーに依存するため、環境比較では対応する要求条件も取得します。