Laravel's intended() with vue router

Question

I am working on a project and am struggling with redirecting to intended location after login. The problem is that Laravel does not include Vues route (anything after #/...) so it always redirects me only to 'domain.com/'

I am using laravel routing only for 'login' 'logout' and '/' and rest of the app is single page utilizing vue routing.

Users of the app are receiving notification emails when they need to take action. Those email contain links to requests where their action is required (e.g. domain.com/#/request/3413). Of course they need to login to be able to access that so they are redirected to login page by laravel (domain.com/login#/request/3413)

After successful login I am trying to redirect them with

return redirect()->intended('/');

But it redirects them to 'domain.com/' instead of 'domain.com/#/request/3413'

Is there any way to make laravel include vues route in that redirect?

Thanks a lot!

score 3 · Accepted Answer · answered Aug 15 '17 at 06:36

So after some excruciating research I have found out that anything after # is handled by browser meaning that server does not see it so you cant access it in your PHP code. I found out thanks to this thread: Getting FULL URL with #tag

I am unsure if that part of the request is not even sent to server but it seems like that and is even pretty logical to me that it would be so.

So to solve this I changed the link sent to user via email to something like this

domain.com/?request=3413

This way I can access it in my PHP code and put together the redirect link after successfull login.

Would you mind to share how did you set all this together with a code example? i'm looking for the same thing — NaturalDevCR, Nov 08 '18 at 18:47

score 0 · Answer 2 · answered Jan 30 '19 at 08:44

You can remove the # in the URL in Vue Router by enabling History Mode like so:

const router = new VueRouter({
  mode: 'history',
  routes: [...]
})

You will need to direct all your requests to where you app lives. If your backend is Laravel, you can define a catch-all route in your routes/web.php file

Route::get('/{any}', 'SpaController@index')->where('any', '.*');

The caveat to this is that the server will no longer return 404s for paths that are not found so you will have to create a NotFoundComponent to display on your Vue app if a path is not found.

const router = new VueRouter({
  mode: 'history',
  routes: [
    { path: '*', component: NotFoundComponent }
  ]
})

Read the Vue Router History Mode Documentation for more info

thanks :D i have already learned this by now but i hope your answer will help someone else :D i should have put it here myself :D — joasisk, Jan 31 '19 at 09:45

Laravel's intended() with vue router

2 Answers2