Laravel Login with AJAX

It's easy. Re-use your existing POST route for $.ajax and inside your authenticate method check request type. If you will detect ajax post request then simply as a response return a json with either true or false + any additional data you need.

@MarkMatute:

public function postLogin(Request $request)
{
    $auth = false;
    $credentials = $request->only('email', 'password');

    if (Auth::attempt($credentials, $request->has('remember'))) {
        $auth = true; // Success
    }

    if ($request->ajax()) {
        return response()->json([
            'auth' => $auth,
            'intended' => URL::previous()
        ]);
    } else {
        return redirect()->intended(URL::route('dashboard'));
    }
    return redirect(URL::route('login_page'));
}

@slick i cant send my ajax request, im getting errors, POST http://localhost:8000/auth/auth/login 500 (Internal Server Error) and this is my code ''' $(document).ready(function(){

var loginForm = $("#loginForm");
loginForm.submit(function(e){
    e.preventDefault();
    var formData = loginForm.serialize();

    $.ajax({
        url:'auth/login',
        type:'POST',
        data:formData,
        success:function(data){
            console.log(data);
        },
        error: function (data) {
            console.log(data);
        }
    });
});

alert('Successfully Loaded');

});

'''

@MarkMatute Do you get any error or exception details in the ajax response, anything in your log files? HTTP 500 means that something on your server side went wrong.

You can check your log files under the storrage/logs folder... Probably your 500 error can be resolved there :-)

Good luck

Ajax shouldn't be used for login, I never even send any secure information through ajax.

I would disagree about not using AJAX - while I haven't used it myself, it should behave (or you can make it behave) exactly like a POST request from a form - especially if you also make sure CSFR protection is in place - and so its just a nice UX addition. Stripe effectively use AJAX for sending card details across the wire, so I wouldn't worry. If you're ever worried about security just slap an SSL (even if it is self-signed) on the page and all AJAX & form requests will be secured through that.

Some times browsers send OPTIONS request... you will need to handle csrf protection and origin (if you work on different domains). I have implemented AngularJS as GUI and Laravel as API and work like a charm... but, yes... for production please user SSL

L5.1 will redirect after successfull login. So in case you want to prevent this behaviour, you'll have to override handleUserWasAuthenticated method from AuthenticatesUsers trait.

`` protected function handleUserWasAuthenticated(Request $request, $throttles) { if ($throttles) { $this ->clearLoginAttempts($request); }

    if (method_exists($this, 'authenticated')) {
        return $this ->authenticated($request, Auth::user());
    }
    if ($request->ajax()) {
           return response()->json([
               'intended' => \URL::previous()
           ]);
    } else {
        return redirect()->intended($this->redirectPath());
    }
}

`

Override this method in your LoginController to login by ajax :)

/**
 * The user has been authenticated.
 *
 * @param  \Illuminate\Http\Request  $request
 * @param  mixed  $user
 * @return mixed
 */
protected function authenticated(\Illuminate\Http\Request $request, $user)
{
    if ($request->ajax()){

        return response()->json([
            'auth' => auth()->check(),
            'user' => $user,
            'intended' => $this->redirectPath(),
        ]);

    }
}

@ahmed-aliraqi This works, thank you!

@JLRDW - What difference Ajax makes in sending the secure information?

It is ok if it is sent to a https url.