Social Media LinkedIn login in Laravel

Hello Coders !! This tutorial is about the third party Social Media LinkedIn login in Laravel. Laravel and we are currently using the latest version of laravel.

So let’s start with the fresh laravel installation

Step 1: Laravel Installation

Run below code to install the fresh Laravel

composer create-project --prefer-dist laravel/laravel linkedin

After successfully run this code you will see the folder name “linkedin” with laravel installed in it. Now you just need to connect the site with the database so create a fresh database and credential in the “.env” file. you will find this file in a root folder.

If this file is not visible then it must be hidden so allow to see the hidden files in your system.

After that open the “.env” file and add database credentials similar to below.

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=linkedin
DB_USERNAME=root
DB_PASSWORD=******

Now, migrate two tables in your database and to do that run below command in your terminal and within your project directory.

php artisan migrate

This command will migrate two tables in database

1. users
2. password_resets  

Step 2: Add attribute in user table

Now, In the user table add one attribute “linkedinId” and for that open database migration file. You will find that file in “root/database/migrations/xxx_create_users_table.php” similar to this. Open this file and add the attribute the same as the below code.

<?php

use Illuminate\Support\Facades\Schema;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Database\Migrations\Migration;

class CreateUsersTable extends Migration
{
    /**
     * Run the migrations.
     *
     * @return void
     */
    public function up()
    {
        Schema::create('users', function (Blueprint $table) {
            $table->bigIncrements('id');
            $table->string('name');
            $table->string('email')->unique();
            $table->timestamp('email_verified_at')->nullable();
            $table->string('password');
            $table->string('linkedinId'); // This line I added
            $table->rememberToken();
            $table->timestamps();
        });
    }

    /**
     * Reverse the migrations.
     *
     * @return void
     */
    public function down()
    {
        Schema::dropIfExists('users');
    }
}

Now, Let’s migrate this table if you already have this table in the database then refresh the migration or delete it and then migrate again.

php artisan migrate

Step 3: Laravel Authentication:

Laravel is providing authentication so we just need to run below command for it.

php artisan make:auth

Step 5 : Install laravel/socialite Package installation:

Now install laravel/socialite package created by driesvints
laravel/socialite
This package will build an authentication protocol for social media login.

run below code in terminal

composer require laravel/socialite

Now open root/linkedin/config/app.php file and below lines in it.

find providers and add this line at the end.

'providers' => [
        // ...
        Laravel\Socialite\SocialiteServiceProvider::class,
    ]

and also add this line at the end inside aliases

'aliases' => [
        // ...
        'Socialite' => Laravel\Socialite\Facades\Socialite::class,
    ]

Step 6 : Create LinkedIn app for Taken

Open this link: https://www.linkedin.com/developer/apps and log in.

If you haven’t created any app then create one and after creating it you will find client ID and client secret key.

Also do not forget to mention redirect URL’s on this same page below. It will look like this.

Now, open config > service.php

root/linkedin/config/services.php

add LinkedIn service at below in array. Here instead of “XXX” you need to write the client_id and client_secret from linked in-app.

'linkedin' => [
        'client_id' => 'xxxxx',
        'client_secret' => 'xxxxx',
        'redirect' => 'http://localhost:8000/callback'],

Generate a controller:

We need to create one controller for LinkedIn Social media Login, So run below code in terminal it will create a controller file.

php artisan make:controller LinkedinLoginController

Now you will find the controller file created at this place.

 root/linkedin/app/Http/Controllers/LinkedinLoginController.php

open this file and add two methods

• redirect(): Redirect users to Linkedin.
• callback(): Handle callback from Linkedin.

Here is the file should like this

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\User;
use Socialite;
use Auth;
use Exception;



class SocialAuthLinkedinController extends Controller
{
    public function redirect()
    {
        return Socialite::driver('linkedin')->redirect();
    }


    public function callback()
    {
        try {
            $linkdinUser = Socialite::driver('linkedin')->user();
            $existUser = User::where('email',$linkdinUser->email)->first();
            if($existUser) {
                Auth::loginUsingId($existUser->id);
            }
            else {
                $user = new User;
                $user->name = $linkdinUser->name;
                $user->email = $linkdinUser->email;
                $user->linkedin_id = $linkdinUser->id;
                $user->password = md5(rand(1,10000));
                $user->save();
                Auth::loginUsingId($user->id);
            }
            return redirect()->to('/home');
        } 
        catch (Exception $e) {
            return 'error';
        }
    }
}

Now open routes file from here

root/linkedin/routes/web.php

and register these two routes and the file will look like this.

<?php
Route::get('linkedin', function () {
    return view('loginlinkedin');
});
Auth::routes();

Route::get('/redirect', 'SocialAuthLinkedinController@redirect')->name('redirect');
Route::get('/callback', 'SocialAuthLinkedinController@callback')->('callback');

Route::get('/home', 'HomeController@index')->name('home');

Create Linkedin Login view file:

Create a file in the resources > views > linkedinlogin.blade.php and add the following code in it.

<html lang="en">
<head>
    <title>Laravel Linkedin Login</title>
    <link rel="stylesheet" href="{{asset('css/app.css')}}">
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container  text-center">
    <h2>Laravel Linkedin Login</h2><br/>
    <form method="post" action="{{ url('/login') }}">
        @csrf
        <div class="row">
            <div class="col-md-4"></div>
            <div class="form-group col-md-4">
                <label for="Email">Email:</label>
                <input type="text" class="form-control" name="email">
            </div>
        </div>
        <div class="row">
            <div class="col-md-4"></div>
            <div class="form-group col-md-4">
                <label for="Password">Password:</label>
                <input type="password" class="form-control" name="password">
            </div>
        </div>
        <div class="row">
            <div class="col-md-4"></div>
            <div class="form-group col-md-4">
                <input type="checkbox" name="remember"> Remember Me
            </div>
        </div>
        <div class="row">
            <div class="col-md-4"></div>
            <div class="form-group col-md-4">
                <a href="{{ url('/redirect') }}" class="btn btn-primary">Login With Linkedin</a>
                <button type="submit" class="btn btn-success">Login</button>
            </div>
        </div>
        <div class="row">
            <div class="col-md-4"></div>
            <div class="form-group col-md-4">
                <a class="btn btn-link" href="{{ url('/password/reset') }}">Forgot Your Password?</a>
            </div>
        </div>
    </form>
</div>
</body>
</html>

Now first start the server if you haven’t then run site in the browser.

http://localhost:8000/linkedin

Done !! So this is the tutorial about the Social Media LinkedIn login in Laravel.

Here is the GitHub link for this tutorial !!