Laravel Redirect::route not working

Question

I am trying to use Redirect::route() with my SPA ajax based app, but it is not working for some reason, I mean, the location of the page doesn't change to where it's supposed to be redirected. I am trying to use this when a user is logging in and logging out.

Routes:

Route::get('/', ['as' => 'root','uses' => 'HomeController@index']);

Route::group(['before' => 'ajax'], function() {
    Route::get('/login', ['as' => 'login', 'uses' => 'UserController@login'])->before('guest');
    Route::post('/login', ['as' => 'signin', 'uses' => 'UserController@signin']);
    Route::get('/logout', ['as' => 'logout', 'uses' => 'UserController@logout'])->before('auth');
});

Controller's methods:

public function signin() {
    $user = [
        'email' => Input::get('email'),
        'password' => Input::get('password')
    ];

    if (Auth::attempt($user)) {
        //return Redirect::route('root')->with('flash_notice', 'You are successfully logged in!'); // not redirecting
        // I have to use a json response instead and refresh from the js function, but I am losing the notice
        return Response::json([
            'status' => true,
            'notice' => 'You are successfully logged in!'
        ]);
    }

    return Response::json([
        'status' => false,
        'error' => 'Your email or password combination was incorrect.'
    ]);
}
public function logout() {
    Auth::logout();

    return Redirect::route('root')->with('flash_notice', 'You are successfully logged out.'); // not redirecting
}

As I commented, I can't use Redirect::route(). Instead I am forced to use window.location.replace() in my js functions when responding to a successfull ajax request:

/* Login */
$(document).on('click', '#login-submit', function(event) {
    event.preventDefault();
    $.post('/login', $('#login-form').serialize(), function(data) {
        if (data['status'] == true) {
            window.location.replace('/home/main');
        } else {
            $('#error').removeClass('hidden');
            $('#error').html(data['error']);
        }
    });
});

Doing it this way is not only undesirable for me, but I am also losing the notice messages; they just appear for an instant and then go away after the page is loaded.

Why is this happening? How can I make Redirect::route()` work? Or at least, how can I avoid that ugly effect when the notice just shows up for an instant and the go away, and manage to show the notice?

Answer 1

The thing is that you can not redirect user based on headers from ajax request. If you want to have validation performed by server in ajax request then your approach is completely correct. To keep the notice after successfully login you can do

Set timeout

Your user will have enough time to read the notice.

setTimeout(function() {
    window.location.replace('/home/main');
}, 500);

Add continue button next to the notice

They will have as much time as needed but it can be not the best UX design.

$('#results').html('<div class="alert alert-info">You have been successfully logged in. Click here to continue');

$('#results').click(function() {
    window.location.replace('/home/main');
});

Redirect user and send notice by GET request

Attach massage as get parameters and at the boot of scripts check for it.

window.location.replace('/home/main?message="You have been successfully logged in"');

and then

function GetURLParameter(sParam)
{
    var sPageURL = window.location.search.substring(1);
    var sURLVariables = sPageURL.split('&');
    for (var i = 0; i < sURLVariables.length; i++) 
    {
        var sParameterName = sURLVariables[i].split('=');
        if (sParameterName[0] == sParam) 
        {
            return sParameterName[1];
        }
    }
}​

var message = GetURLParameter('message');

if(message) {
   $('#results').html('<div class="alert alert-info">' + message + '</div>');
}