Laravel Sanctum + React（axios）+ Digest認証（Basic認証）でつまずいた話

はじめに

表題の通りなのですが、Laravel Sanctum + React (axios)でログイン認証を実装しました。ローカルでは問題なかったのに、検証サーバにデプロイしてDigest認証をかけたところでつまずきました。その顛末を簡単にまとめます。

構成

• バックエンド
  • Laravel 11 + Sanctum
• フロントエンド
  • React + axios
• Webサーバ
  • Apache2 + Digest認証
• ブラウザ
  • Google Chrome

結論

Google Chromeは401エラーを受け取ると、Authorizationヘッダーの情報を忘れる（認証済み情報がリセットされる）ので、APIログインに失敗し401のレスポンスを受信するとDigest認証（もしくはBasic認証）の認証情報が消えてしまい、認証画面が再度表示される。

なぜか？

Google Chromeの仕様らしいことを以下のページで知りました。そんな知らんがな。

とりあえずの実装の逃げ

バックエンド側

認証エラーで401を返していたのを418に変更。

LoginController

- throw new ActionRuntimeException("Unauthorized.", 401);
+ throw new ActionRuntimeException("Unauthorized.", 418);

フロントエンド側

エラーステータス401のチェックを、418に変更。

ちなみに、エラーステータス418は418 I'm a teapotエラーです。詳細は以下をご覧下さい。

まとめ

401ステータスが利用出来ないので、401以外のステータスを使わないとGoogle Chromeでは認証情報が消えてしまうという問題によるものでした。他になにか良い対応方法があったら教えてください！