✅ WEB і WordPress новини, теми, плагіни. Тут ми ділимося порадами і кращими рішеннями для сайтів.

Система соціального входу за допомогою Laravel Socialite

19

Кредит: Ця стаття натхненна цим повідомленням Laravel Social Authentication with Socialite

Ви хочете впровадити систему соціального входу на своєму веб-сайті Laravel? Дозволяючи соціальний вхід, вашим користувачам не потрібно реєструватися на вашому веб-сайті. Це також економить нам багато роботи, наприклад, надсилання посилання для активації, перевірка облікового запису електронної пошти. У цій статті ми вивчаємо, як додати систему соціального входу за допомогою Laravel socialite.

Бібліотека Laravel Socialite забезпечує автентифікацію OAuth за допомогою Facebook, Twitter, Google, LinkedIn, GitHub та Bitbucket. Що нам потрібно зробити, це встановити цю бібліотеку на нашому веб-сайті Laravel, налаштувати її, отримати ключі API із соціального сайту, і ми готові піти.

Система соціального входу за допомогою Laravel Socialite

Створити таблицю користувачів

Для впровадження системи соціального входу нам потрібно створити таблицю користувачів, яка буде зберігати деталі, надані соціальним сайтом.

Якщо у вас нова установка Laravel, відкрийте інструмент командного рядка в кореневому каталозі проекту та запустіть команду php artisan make:auth. Ця команда створить контролери аутентифікації, такі як LoginController, RegisterController тощо, які знаходяться в каталозі app / Http / Controllers / Auth. Він також створює подання login.blade.php, register.blade.php в каталозі resources / view / auth.

Далі відкрийте таблицю міграції для користувачів. Ми змінимо цю міграцію за замовчуванням і додамо ще два стовпці з назвою provider і provider_id.

public function up()
{
    Schema::create('users', function (Blueprint $table) {
        $table->increments('id');
        $table->string('name');
        $table->string('email')->nullable();
        $table->string('password')->nullable();
        $table->string('provider');
        $table->string('provider_id');
        $table->rememberToken();
        $table->timestamps();
    });
}

Як бачите, ми встановлюємо для стовпців електронної пошти та пароля значення, що мають нульовий статус. Чому? Коли ми використовуємо соціальну автентифікацію для входу, немає гарантії отримання ідентифікатора електронної пошти користувача. І пароль також не потрібен у такому випадку. Таким чином, ми зберігаємо адресу електронної пошти та пароль недійсними. Постачальник стовпців зберігатиме назву соціального сайту, як-от facebook, twitter тощо. Стовпець provider_id зберігатиме соціальний ідентифікатор користувача, відповідний соціальному сайту.

Після того, як ви змінили міграцію користувачів, як зазначено вище, запустіть команду php artisan migrate. Це створить таблицю під назвою "користувачі" у вашій базі даних.

Можливо, під час запуску команди міграції ви отримаєте якусь дивну помилку, пов’язану з довжиною символу. Якщо так, то відкрийте файл AppServiceProvider.php з каталогу app / Providers. У цьому файлі нам потрібно встановити довжину рядка за замовчуванням для стовпців таблиці бази даних.

Файл AppServiceProvider.php

<?php
 
namespace AppProviders;
 
use IlluminateSupportServiceProvider;
use IlluminateSupportFacadesSchema;
 
class AppServiceProvider extends ServiceProvider
{
    /**
     * Bootstrap any application services.
     *
     * @return void
     */
    public function boot()
    {
        Schema::defaultStringLength(255);
    }
 
    /**
     * Register any application services.
     *
     * @return void
     */
    public function register()
    {
        //
    }
}

Модель користувача

За замовчуванням Laravel включає модель AppUser Eloquent до каталогу додатків. Відкрийте User.php з папки програми. Додайте ще два стовпця провайдера, provider_id до змінної $ fillable.

protected $fillable = [
    'name', 'email', 'password', 'provider', 'provider_id',
];

Встановіть та налаштуйте Laravel Socialite

Щоб встановити цю бібліотеку, у вас повинен бути встановлений композитор.

У вашому інструменті командного рядка запустіть наведену нижче команду.

composer require laravel/socialite

Після встановлення бібліотеки зареєструйте LaravelSocialiteSocialiteServiceProvider у своєму файлі конфігурації config / app.php.

'providers' => [
    // Other service providers...
 
    LaravelSocialiteSocialiteServiceProvider::class,
],

У тому ж файлі config / app.php, під масивом псевдонімів, додайте фасад Socialite.

'Socialite' => LaravelSocialiteFacadesSocialite::class,

Тепер прийшов час зареєструвати свою заявку на соціальному сайті. Наприклад, ми припускаємо, що ви хочете застосувати автентифікацію для входу на Facebook. Тож продовжуйте і створюйте додаток на Facebook.

Після того, як ви готові з ідентифікатором програми, секретом програми вашої програми Facebook, відкрийте файл config / services.php і додайте до нього код нижче.

'facebook' => [
    'client_id' => env('FB_APP_ID'),
    'client_secret' => env('FB_APP_SECRET'),
    'redirect' => env('FB_CALLBACK_URL'),
],

Як показано у наведеному вище коді, ми повинні зберігати деталі нашої програми та URL зворотного дзвінка у файлі .env.

FB_APP_ID=PASTE_APP_ID_HERE
FB_APP_SECRET=PASTE_APP_SECRET_HERE
FB_CALLBACK_URL=YOU_SITE_URL/login/facebook/callback

Ми передали URL-адресу зворотного виклику як YOU_SITE_URL / login / facebook / callback. Тепер настав час створити два маршрути, один для перенаправлення користувача на постачальника OAuth (у нашому випадку Facebook), а інший для отримання зворотного дзвінка від постачальника після автентифікації.

Фактичний код для обробки OAuth

На цьому етапі ми закінчили всі налаштування Laravel Socialite. Настав час написати якийсь код, який обробляє переспрямування OAuth і отримати дані користувача.

Відкрийте файл login.blade.php і помістіть у нього код нижче, можливо, після кнопки надсилання.

<div class="form-group">
    <div class="col-md-6 col-md-offset-4">
        Login with
        <a href="{{ url('/login/facebook') }}"><i class="fa fa-facebook-official" aria-hidden="true"></i> Facebook</a>
        <a href="{{ url('/login/twitter') }}"><i class="fa fa-twitter" aria-hidden="true"></i> Twitter</a>
        <a href="{{ url('/login/github') }}"><i class="fa fa-github" aria-hidden="true"></i> Github</a>
    </div>
</div>

Тут ми додаємо посилання на Github та Twitter. Кроки для додавання OAuth для цих соціальних сайтів також збігаються з Facebook. Вам просто потрібно створити додаток для відповідних соціальних сайтів і зберігати ці деталі так само, як ми додали для Facebook.

У своєму файлі маршрутів визначте маршрути, як показано нижче.

Route::get('login/{provider}', 'AuthLoginController@redirectToProvider');
Route::get('login/{provider}/callback', 'AuthLoginController@handleProviderCallback');

Далі перейдіть до app / Http / Controllers / Auth / LoginController.php та змініть файл. Ви повинні додати в нього код нижче.

<?php
 
namespace AppHttpControllersAuth;
 
use AppHttpControllersController;
use IlluminateFoundationAuthAuthenticatesUsers;
use Socialite;
use AppUser;
use Auth;
 
class LoginController extends Controller
{
    /**
     * Redirect the user to the GitHub authentication page.
     *
     * @return Response
     */
    public function redirectToProvider($provider)
    {
        return Socialite::driver($provider)->scopes(['email'])->redirect();
    }
 
    /**
     * Obtain the user information from GitHub.
     *
     * @return Response
     */
    public function handleProviderCallback($provider)
    {
        $user = Socialite::driver($provider)->user();
        $authUser = $this->findOrCreateUser($user, $provider);
        Auth::login($authUser, true);
        return redirect($this->redirectTo);
    }
 
    /**
     * If a user has registered before using social auth, return the user
     * else, create a new user object.
     * @param  $user Socialite user object
     * @param $provider Social auth provider
     * @return  User
     */
    public function findOrCreateUser($user, $provider)
    {
        $authUser = User::where('provider_id', $user->id)->first();
        if ($authUser) {
            return $authUser;
        }
        return User::create([
            'name'     => $user->name,
            'email'    => $user->email,
            'provider' => $provider,
            'provider_id' => $user->id
        ]);
    }
}

Метод redirectToProvider перенаправляє користувача на сторінку входу на соціальну сторінку. Після того, як користувач авторизує програму, ми отримуємо інформацію про користувача у функції handleProviderCallback. Якщо користувача не існує в нашій системі, ми додаємо його дані за допомогою методу findOrCreateUser.

Ми сподіваємось, ви дізналися про систему соціального входу за допомогою Laravel Socialite. Якщо у вас є якісь запитання чи пропозиції, залиште коментар нижче.

Пов’язані статті

Джерело запису: artisansweb.net

Цей веб -сайт використовує файли cookie, щоб покращити ваш досвід. Ми припустимо, що з цим все гаразд, але ви можете відмовитися, якщо захочете. Прийняти Читати далі