How To Perfom Social Login With Laravel Socialite

Oftentimes when building web applications you might consider allowing your users to log in using various channels like Facebook, Google, Twitter, or Github. This achieved by connecting to the OAuth server of Google or anything and perform authentication. The nuances of connecting to APIs making the request might seem intimidating but luckily for us, someone did the heavy lifting for us, meet Laravel Socialite, a simple, convenient way to authenticate with OAuth providers. Let's see Socialite in action by implementing login with Twitter.

To follow along with this guide you will need a Twitter developer account and well of course a Laravel project. In your project folder install Socialite

composer require laravel/socialite

Next thing add this to your config/services.php file

'twitter' => [
    'client_id' => env('TWITTER_CONSUMER_KEY'),
    'client_secret' => env('TWITTER_CONSUMER_SECRET'),
    'redirect' => env('TWITTER_REDIRECT_URI'),
],

I'm sure you know how Laravel configuration files work. Once you have everything configured let's start making the login. To do this we need a couple of GET routes, one to redirect to Twitter and a callback to handle the "login". Let's start with redirecting. Let's create our controller

php artisan make:controller Auth\\TwitterLogin

In the controller let's create our redirect action

use Laravel\Socialite\Facades\Socialite;
use App\Providers\RouteServiceProver;
use App\Models\User;

/**
 * Redirect to Twitter OAuth
 */
public function redirect()
{
    return Socialite::driver('twitter')->redirect();
}

Simple as that. Let's see what the callback will look like

/**
 * Log in the user
 */
public function callback()
{
    try {
        $user = Socialite::driver('twitter')->user();
    } catch (\Exception $e) {
        return redirect()->route(RouteSeriveProvider::HOME);
    }
o
    $user = User::where('email', $user->getEmail())->first();
o
    if (is_null($user)) {
        return redirect()->route('register')->withInput([
            'name' => $user->getName(),
            'email' => $user->getEmail(),
        ])->with('status', 'You do not have an account with us, add a password to create account');
    }

    Auth::login($user);

    return redirect()->intended(RouteServiceProvider::HOME);
}

Basically, this method goes into a try block and tries to retrieve the user from Socialite but if it fails probably because the user may have visited that route without the proper parameters we wouldn't want to throw a 500 Internal Server error but just redirect them to the home page which will ask them to log in again. Next, it goes into the database and tries to find a user with the email provided by Twitter OAuth. If the first row is null it redirects the user to the signup page so they can create an account. Notice the withInput method called to pre-populate the signup fields for the user. If all goes well and we found the user we log them in by calling the Auth facade's login method. Finally, we redirect the user to their intended page. Simple right? Yes.

Add this to the routes file to add routes

Route::namespace('Auth')->group(function () {
    Route::get('/auth/twitter/redirect', 'TwitterLogin@redirect')->name('auth.twitter.redirect');
    Route::get('/auth/twitter/callback', 'TwitterLogin@callback')->name('auth.twitter.callback');
});

As of now, everything is now set up, in your login page add a button that points to the auth.twitter.redirect route to start authenticating with Twitter. Laravel Socialite is very flexible if don't want to use Twitter just change the argument you pass to the driver method with the name of your preferred driver. And also if your provider is not supported out of the box Socialite check out the community driven Socialite Providers website.