質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
SPA(Single-page Application)

SPA(Single-page Application)は、単一のWebページのみでコンテンツの切り替えができるWebアプリケーションもしくはWebサイトです。ブラウザでのページ遷移がないため、デスクトップアプリケーションのようなUXを提供します。

Laravel

LaravelとはTaylor Otwellによって開発された、オープンソースなPHPフレームワークです。Laravelはシンプルで表現的なシンタックスを持ち合わせており、ウェブアプリケーション開発の手助けをしてくれます。

Q&A

1回答

1862閲覧

Laravelで[/{any}]の形でルーティングした時の認証後のリダイレクト先について

nao3451

総合スコア1

SPA(Single-page Application)

SPA(Single-page Application)は、単一のWebページのみでコンテンツの切り替えができるWebアプリケーションもしくはWebサイトです。ブラウザでのページ遷移がないため、デスクトップアプリケーションのようなUXを提供します。

Laravel

LaravelとはTaylor Otwellによって開発された、オープンソースなPHPフレームワークです。Laravelはシンプルで表現的なシンタックスを持ち合わせており、ウェブアプリケーション開発の手助けをしてくれます。

0グッド

0クリップ

投稿2022/01/21 04:11

現在Laravel + ReactでSPAアプリを構築しようと作業しています。
認証については、Laravel側のルーティング、コントローラで、以下のように実装しようと考えました。

Laravel側認証周り設定

web.php

1Auth::routes(); 2Route::get('/{any}', [App\Http\Controllers\HomeController::class, 'index'])->where('any', '.*')->name('home');

HomeController.php

1 public function __construct() 2 { 3 $this->middleware('auth'); 4 }

この形で、/login、/registerなどを除くルーティングは、
認証を必須とするイメージで実現できる想定でした。

本題

認証自体は問題なく動作するものの、認証後のリダイレクト先が、

http://localhost:8000/js/index.js.map

のように、ソースマップのURLがlocation.hrefに設定されるようでした。
※前述のルーティングにより、全てのルートをHomeControllerに拾う為、画面は変わらない。
この原因について、ご教示いただければと思います。

調査したこと

  • ログイン前画面、ログイン後の画面でJS(Laravel Mixによりバンドル済み)を読み込んでおり、
    その中で、上記のソースマップを設定している。どうやらこいつが拾われている?
    例)//# sourceMappingURL=index.js.map

  • 自動生成されるLoginControllerで$redirectToを設定しているが、無視されている。

  • sessionファイルのURL : previousに上記ソースマップが設定されている。
    →前述のルーティングで、JS等ブラウザが読み込むURL全てを履歴としてスタックしてしまっている?
    →ただ、リダイレクト先に url()->previous() が指定されるのはなぜ?


以上、恐れ入りますが御助力いただければ幸いです。
よろしくお願いいたします。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

自分もLaravel + VueのWebアプリケーションで同じ現象が起こりますが、原因も特定できておりません。
その上で求めている回答とは違うかと思いますが、自分の対策だけ書かせていただきます。

以下のようなシンプルなミドルウェアを作って

app/Http/Middleware/RedirectIfIndexJsMap.php

PHP

1<?php 2 3namespace App\Http\Middleware; 4 5use Closure; 6 7class RedirectIfIndexJsMap 8{ 9 /** 10 * Handle an incoming request. 11 * 12 * @param \Illuminate\Http\Request $request 13 * @param \Closure $next 14 * @return mixed 15 */ 16 public function handle($request, Closure $next) 17 { 18 if ($request->path() === 'js/index.js.map') { 19 return redirect('/'); 20 } 21 return $next($request); 22 } 23} 24

挟んでおくことで、js/index.js.map を経由してホーム画面にリダイレクトさせるようにしました。
app/Http/Kernel.php

PHP

1 protected $middleware = [ 2 // \App\Http\Middleware\TrustHosts::class, 3 \App\Http\Middleware\TrustProxies::class, 4 \Fruitcake\Cors\HandleCors::class, 5 \App\Http\Middleware\PreventRequestsDuringMaintenance::class, 6 \Illuminate\Foundation\Http\Middleware\ValidatePostSize::class, 7 \App\Http\Middleware\TrimStrings::class, 8 \Illuminate\Foundation\Http\Middleware\ConvertEmptyStringsToNull::class, 9 \App\Http\Middleware\RedirectHomeIfIndexJsMap::class // 追加 10 ];

投稿2022/02/13 06:27

編集2022/02/13 06:28
Maple0922

総合スコア13

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問