Motivation / 目的
「ログイン後にUserのマイページがまだ表示されない」というバグ報告を受けて調査した結果、CORS/Sanctum設定に原因と考えられる問題が複数見つかったため起票する。
Investigating the reported bug "User mypage still does not display after login" surfaced multiple CORS/Sanctum configuration issues that are likely root causes.
調査でわかったこと / What we found
- フロント(localhost:3876)・バックエンド(Laravel Sanctum, localhost:8700)はどちらも起動済みで、
/sanctum/csrf-cookie は204を返し XSRF-TOKEN / laravel_session のCookieも発行されている
- しかし
config/cors.php の supports_credentials が false になっている。Sanctumのcookieベースの SPA 認証は、フロントが credentials: 'include' でリクエストを送り、ブラウザが Access-Control-Allow-Credentials: true を確認できて初めてCookieをクロスオリジンで送受信できる。false のままだと、ログイン自体は成立しても、その後の「現在のユーザーを取得する」リクエストがブラウザ側でブロックされ、マイページが表示されない症状と一致する
config/cors.php の allowed_origins にフロントのURLが http://localhost:3876 のようにハードコードされている。実際に確認したレスポンスのCSPヘッダーには http://host.docker.internal:5173 への許可が含まれており、READMEの起動コマンド(--port 3876)と食い違っていた。バックエンド側が「フロントはVite標準の5173番ポートで動く」という前提のまま更新されておらず、実際の起動ポートとズレている
- フロント側は
VITE_API_BASE_URL(.env.local)でバックエンドのURLを環境変数化済みだが、バックエンド側はフロントのオリジンをハードコードしたままで対称になっていない
対応方針 / Proposed fix
config/cors.php の supports_credentials を true に修正する
config/cors.php の allowed_origins(および必要であれば config/sanctum.php の stateful domains)を、ハードコードではなく FRONTEND_URL 環境変数経由で参照するようにする
.env / .env.example に FRONTEND_URL を追加する
Test Results / テスト結果
(このIssueは調査記録・対応方針の共有のため作成。対応PRで実施したテストを記載予定)
Motivation / 目的
「ログイン後にUserのマイページがまだ表示されない」というバグ報告を受けて調査した結果、CORS/Sanctum設定に原因と考えられる問題が複数見つかったため起票する。
Investigating the reported bug "User mypage still does not display after login" surfaced multiple CORS/Sanctum configuration issues that are likely root causes.
調査でわかったこと / What we found
/sanctum/csrf-cookieは204を返しXSRF-TOKEN/laravel_sessionのCookieも発行されているconfig/cors.phpのsupports_credentialsがfalseになっている。Sanctumのcookieベースの SPA 認証は、フロントがcredentials: 'include'でリクエストを送り、ブラウザがAccess-Control-Allow-Credentials: trueを確認できて初めてCookieをクロスオリジンで送受信できる。falseのままだと、ログイン自体は成立しても、その後の「現在のユーザーを取得する」リクエストがブラウザ側でブロックされ、マイページが表示されない症状と一致するconfig/cors.phpのallowed_originsにフロントのURLがhttp://localhost:3876のようにハードコードされている。実際に確認したレスポンスのCSPヘッダーにはhttp://host.docker.internal:5173への許可が含まれており、READMEの起動コマンド(--port 3876)と食い違っていた。バックエンド側が「フロントはVite標準の5173番ポートで動く」という前提のまま更新されておらず、実際の起動ポートとズレているVITE_API_BASE_URL(.env.local)でバックエンドのURLを環境変数化済みだが、バックエンド側はフロントのオリジンをハードコードしたままで対称になっていない対応方針 / Proposed fix
config/cors.phpのsupports_credentialsをtrueに修正するconfig/cors.phpのallowed_origins(および必要であればconfig/sanctum.phpの stateful domains)を、ハードコードではなくFRONTEND_URL環境変数経由で参照するようにする.env/.env.exampleにFRONTEND_URLを追加するTest Results / テスト結果
(このIssueは調査記録・対応方針の共有のため作成。対応PRで実施したテストを記載予定)