Увійдіть за допомогою Twitter у Laravel за допомогою Laravel Socialite

Нещодавно я опублікував статтю про Вхід за допомогою Twitter у PHP. Один з наших читачів попросив написати статтю про логін за допомогою Twitter у Laravel. Хоча Laravel побудований на мові програмування PHP, і я писав про вхід до Twitter у PHP, я знаю, що попередні підручники не підходять для фреймворку Laravel. Laravel має власну структуру папок, потік розробки. Розробник повинен дотримуватися стандартів Laravel, будуючи в ньому веб-додатки.

Laravel має свої офіційні пакети, які допомагають розробникам досягти певної функціональності. Один із пакетів – Socialite. Використовуючи Socialite, ви можете інтегрувати соціальний логін з різними провайдерами, такими як Facebook, Twitter, LinkedIn, Google тощо.

У цій статті ми вивчаємо Вхід за допомогою Twitter у Laravel за допомогою Laravel Socialite.

Починаємо

Почнемо зі свіжої інсталяції Laravel. Необов’язково використовувати нову інсталяцію Laravel, ви також можете використовувати свій існуючий проект.

Для встановлення останньої версії Laravel виконайте команду нижче:

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

Після встановлення створіть базу даних та додайте облікові дані у .envфайл. Ми будуємо систему входу, тому ми повинні зберігати дані користувачів у базі даних.

Цей підручник заснований на Увійти за допомогою Twitter, тому ми отримаємо ідентифікатор користувача Twitter після успішної автентифікації. Щоб зберегти цей соціальний ідентифікатор, ми додаємо стовпці providerта provider_idдо таблиці "користувачі". У стовпці providerзберігатиметься значення "twitter", а в стовпці provider_id– ідентифікатор користувача Twitter.

Коли ми використовуємо соціальний логін, нам не потрібно зберігати паролі, тому стовпець пароля повинен приймати значення ‘NULL’ за замовчуванням. Немає гарантії отримання електронної пошти користувача після входу в соціальну мережу, тому для цікавості нам потрібно встановити стовпці електронної пошти, щоб також приймати значення NULL.

Відкрийте файл міграції таблиці "користувачі" та додайте код нижче.

/**
 * Run the migrations.
 *
 * @return void
 */
public function up()
{
    Schema::create('users', function (Blueprint $table) {
        $table->increments('id');
        $table->string('name');
        $table->string('email')->nullable();
        $table->timestamp('email_verified_at')->nullable();
        $table->string('password')->nullable();
        $table->string('provider');
        $table->string('provider_id');
        $table->rememberToken();
        $table->timestamps();
    });
}

Після цього запустіть команду міграції, яка створить таблиці у вашій базі даних.

php artisan migrate

Вам також потрібно додати стовпці providerта provider_idдо моделі користувача.

app / User.php

/**
 * The attributes that are mass assignable.
 *
 * @var array
 */
protected $fillable = [
    'name', 'email', 'password', 'provider', 'provider_id'
];

Отримайте облікові дані Twitter

Оскільки ми збираємося інтегрувати логін Twitter у Laravel, спочатку потрібно отримати свої облікові дані Twitter. Виконайте наведені нижче дії, щоб створити програму Twitter і отримати свої облікові дані.

• Увійдіть до облікового запису розробника Twitter і створіть нову програму.
• Заповніть усі обов’язкові поля, такі як назва програми та опис.
• Додайте домен веб-сайту в поле Веб-сайт.
• Встановіть URL-адресу зворотного дзвінка як http://localhost:8000/twitter/callback. Налаштуйте URL-адресу відповідно до ваших вимог.
• Після реєстрації скопіюйте та вставте створені облікові дані програми (споживчий ключ та секрет), які потрібні через деякий час.

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

Створіть маршрути та контролер

Для того, щоб включити функціональність входу в Twitter, нам потрібно додати код у наш проект Laravel. Давайте створимо LoginControllerкоманду:

php artisan make:controller LoginController

Нам потрібно додати посилання для входу у файл леза. Створіть a login.blade.phpта додайте до нього наступний HTML.

<a href="{{ url('/login/twitter') }}" class="btn btn-success">
    {{ __('Login with Twitter') }}
</a>

Ви можете викликати цей вигляд за допомогою indexметоду LoginController.

/**
 * Call the view
 */
public function index()
{
    return view('login');
}

Далі додайте маршрут до нього. Я також додаю ще кілька маршрутів, які будуть потрібні для наступної частини підручника.

Route::get('login', 'LoginController@index');
Route::get('login/{provider}', 'LoginController@redirectToProvider');
Route::get('{provider}/callback', 'LoginController@handleProviderCallback');
Route::get('/home', function() {
    return 'User is logged in';
});

Після того, як користувач увійде в систему за допомогою Twitter, я перенаправлю їх на homeмаршрут. Це просто для демонстраційних цілей. Вам слід змінити цей маршрут на інший.

Увійдіть за допомогою Twitter у Laravel

Настав час скористатися пакетом Socialite зараз. За допомогою наведеної нижче команди ви можете встановити пакет Socialite у свій проект Laravel.

composer require laravel/socialite

Після встановлення Socialite нам потрібно налаштувати його. Відкрийте config/services.phpта додайте конфігурацію Twitter до цього файлу наступним чином:

'twitter' => [
    'client_id' => env('TWITTER_API_KEY'),
    'client_secret' => env('TWITTER_API_SECRET_KEY'),
    'redirect' => env('TWITTER_CALLBACK_URL'),
],

Ви можете помітити, що я використовував envметод для отримання вказаних значень. Це означає, що нам потрібно визначити ці константи у .envфайлі.

TWITTER_API_KEY=PASTE_TWITTER_API_KEY
TWITTER_API_SECRET_KEY=PASTE_TWITTER_API_SECRET_KEY
TWITTER_CALLBACK_URL=http://localhost:8000/twitter/callback

Не забудьте замінити заповнювачі вашими фактичними ключами API. Далі LoginControllerми пишемо функцію, яка перенаправляє користувача на сторінку входу в Twitter, і після успішної авторизації він ввійде в систему.

LoginController.php

<?php
 
namespace AppHttpControllers;
 
use IlluminateHttpRequest;
use Socialite;
use AppModelsUser;
use Auth;
 
class LoginController extends Controller
{
    /**
     * Where to redirect users after login.
     *
     * @var string
     */
    protected $redirectTo = '/home';
  
    /**
     * Call the view
     */
    public function index()
    {
        return view('login');
    }
  
    /**
     * Redirect the user to the Twitter authentication page.
     *
     * @return Response
     */
    public function redirectToProvider($provider)
    {
        return Socialite::driver($provider)->redirect();
    }
    
    /**
     * Obtain the user information from Twitter.
     *
     * @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
        ]);
    }
}

Перейдіть на сторінку входу та натисніть посилання "Увійти за допомогою Twitter". Завершіть процес, і вам слід увійти в систему за допомогою Twitter. Ви також можете знайти записи користувачів у usersтаблиці.

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

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

• Увійдіть за допомогою LinkedIn в Laravel за допомогою Laravel Socialite
• Вхід Google у Laravel за допомогою Laravel Socialite