Create A User Authentication System with Facebook and Laravel Socialite
Note: This is Recipe 4 of our Laravel 5 Cookbook
What will we learn?
We will learn how to use Socialite - a new Laravel 5 feature - to let users log in using their Facebook account.
After learning this recipe, you may apply the technique to authenticate users with other social networks (Twitter, Github, Gmail, etc.) as well.
In most web frameworks, authenticating users using 3rd party providers is never as easy as it could be. Luckily, Laravel 5 provides a simple way to authenticate with OAuth providers using Socialite.
Currently, Socialite officially supports authentication with Facebook, GitHub, Google, Twitter and Bitbucket. If you want to use Socialite with other providers (Youtube, Wordpress, etc.), check out SocialiteProviders, which is a collection of OAuth 1 and 2 packages that extends Socialite.
Actually, Socialite is an official package, and it's not included in Laravel by default. To use Socialite, we have to install it by running this command:
composer require laravel/socialite
Alternatively, you may edit the composer.json file, add below code into the require section and run composer update:
Next, open config/app.php.
Add the following line into the providers array:
Add the Socialite facade into the aliases array:
'Socialite' => Laravel\Socialite\Facades\Socialite::class,
Done! Socialte is now ready to use!
Create a Facebook app
In order to use Facebook as our authentication provider, we must create a Facebook app.
Don't worry, it's very simple.
First, let's go to:
Register a Facebook account or login if you have one already.
There is an Account Menu at the top right corner of the page.
Click Add a New App and choose Website to create a Facebook app.
Alternatively, you can access this link:
Enter your app's name and click Create New Facebook App ID:
Choose a Category for your app and then click Create App ID
Click Skip Quick Start to access your App Dashboard
That's it! You can get your App ID and App Secret here.
Create a Facebook Test App
If you're working on Homestead, you will have to create a Test App to test the authentication locally.
Find the Test Apps button, which is on the left menu:
Follow the instructions to create a test app. You can name the app whatever you want.
After that, click Settings -> Add Platforms -> Website
Enter your app URL into the Site URL field. (For example, cookbook.app)
Enter your app URL into the App Domains field, too.
Click Save Changes to update your Test App.
Well done! Don't forget to grab your Test App ID and Test App Secret.
Tell Laravel about your Facebook app
After creating your Facebook app, you can connect it to your Laravel app by simply editing the config/services.php file. Add this:
'facebook' => [ 'client_id' => 'yourFacebookAppID', 'client_secret' => 'yourFacebookAppSecret', 'redirect' => 'http://yourLaravelAppURL/login/facebook/callback', ],
If you're using the .env config file, you may use the following instead:
'facebook' => [ 'client_id' => 'FACEBOOK_ID', 'client_secret' => 'FACEBOOK_SECRET', 'redirect' => 'FACEBOOK_URL', ],
Edit your .env files:
FACEBOOK_ID=yourFacebookAppID FACEBOOK_SECRET=yourFacebookAppSecret FACEBOOK_URL=http://yourLaravelAppURL/login/facebook/callback
Done! Laravel automatically detects your Facebook app information and prepares everything for you!
Note: If you're using Homestead, use your Test App ID and Secret.
Update Users Migration
We have to update our database to store users' Facebook Unique ID and other related information.
Read more at:
This post is submitted by one of our members. You may submit a new post here.