LaravelでAPIリクエスト時に勝手にリダイレクトされてしまう

実現したいこと

LaravelでAPIリクエスト時に勝手にリダイレクトされないようにしたいです。

前提

Laravelのスターターキットを使用して、Reactとデフォルトの認証機能を選択して、アプリを構築しました。
デフォルトで生成されていたファイルなどはそのままにしています。

発生している問題・エラーメッセージ

フロントエンド側でAPIリクエストを送信した際に、処理は成功してステータスコード200が返ってくるのですが、その際に現在のURLにリダイレクト（もしくはリロード？）が発生してしまいます（JSONのレスポンスを返すようにしています）。

リダイレクトだと思った理由は、ページがリロードされているのと、コンソールに「http://localhost:8000/home に移動しました」というメッセージが表示されていたため、そう思いました。

該当のソースコード

該当のAPIリクエスト部分
    const handleAddTodo = async () => {
        const options: RequestInit = {
            headers: {
                'Content-Type': 'application/json',
            },
            method: 'POST',
            body: JSON.stringify({ name: todoName }),
        };
        const res = await fetch('/api/todos', options);
        const json = await res.json();
        console.log(json);
    };

    return (
        <form
            onSubmit={(e) => {
                e.preventDefault();
                handleAddTodo();
            }}
        >
            <input
                type="text"
                value={todoName}
                onChange={(e) => {
                    setTodoName(e.target.value);
                }}
            />
            <button>add</button>
        </form>
    );

Laravel側の処理
1Route::post('/todos', function(Request $request): JsonResponse {
2    return processFileAndRespond(JSON_FILE_PATH, function($fileData) use ($request) {
3        // 新しいTodoを作成する
4        $nextId = max(array_column($fileData['todos'], 'id')) + 1;
5        $newTodo = [
6            'id' => $nextId,
7            'name' => $request->name,
8            'isCompleted' => false, 
9        ];
10        // Todos追加
11        $fileData['todos'][] = $newTodo;
12        // ファイル上書き保存
13        Storage::put(JSON_FILE_PATH, json_encode($fileData, JSON_PRETTY_PRINT));
14
15        return $newTodo;
16    });
17});
18
19function processFileAndRespond(string $filePath, ?callable $callbackFunc = null): JsonResponse {
20    // ファイルが存在するかチェック
21    if (!Storage::exists($filePath)) {
22        return response()->json(['message' => '指定のパスにファイルが存在しませんでした。'], 404);
23    }
24    // JSONファイルをデコードして取得
25    $jsonData = Storage::json($filePath);
26    // ファイルの内容更新
27    if($callbackFunc) {
28        $jsonData = $callbackFunc($jsonData);
29    }
30
31    return response()->json(['data'=> $jsonData], 200);
32};

試したこと

チャットGPTに相談しました。
Laravelの公式ドキュメントを見ました。
https://laravel.com/docs/12.x/middleware#laravels-default-middleware-groups

補足情報（FW/ツールのバージョンなど）

バージョン

Laravel: v12
Laravel Sanctum: v4
React: v19

その他

ブラウザのコンソールに何もエラーが発生していないことを確認しました。
laravel.logを確認しましたが、何も記載されていません。
Laravelのスターターキットで自動生成されていた、認証機能周り（ミドルウェアなど）が影響しているのではないかと思っています。
JSONファイルにデータを保存している理由は、DB操作の実装をしたことがまだなく、一気に色々やると分かりにくくなると思ったので、一旦JSONファイルに保存するようにしています。
PHP、Laravelは最近触り始めたばかりであまり詳しくないので、詳細に教えていただけますとありがたいです。

utm.

2025/03/08 09:46

formがsubmitされているとかはありませんか？(おそらく違いそうですが) Laravelがページをリロードするというのが根本的に無理な気がするので、API通信を1度、ローカルでなにか実行するような処理に置き換えてテストしてみてはいかがでしょうか。

satou

2025/03/08 09:54

utmさん、コメントありがとうございます！フォーム送信時に実行している関数（handleAddTodo）の処理を全てコメントアウトするとリダイレクトなどは何も発生しないので、フロントエンド側の問題ではないのかなと思いました。 handleAddTodoの中身の処理を「console.log('test');」だけにして実行するとコンソールに「test」と表示されて、ブラウザがリロードしていないことを確認しました。

satou

2025/03/08 10:10

サーバーを再起動したら、リダイレクトが発生しないようになりました！初歩的な確認を忘れていてすみません！ご協力いただいた皆様、ありがとうございました！