Вхід Google у Laravel за допомогою Laravel Socialite
Нещодавно я опублікував статтю Вхід за допомогою LinkedIn за допомогою Laravel Socialite, і один з наших читачів запитав про інтеграцію входу Google у Laravel. Вхід в Google також є однією з популярних платформ, що використовуються для соціального входу на веб-сайті.
Коли ви дозволяєте користувачам входити у свій соціальний профіль на вашому веб-сайті, ви пропускаєте процес перевірки їх електронної пошти. Вашим користувачам не потрібно виконувати процес активації електронної пошти. Ми можемо покладатися на соціальні сайти, оскільки вони вже перевірили користувачів на своїй платформі. Це забезпечує кращу взаємодію з користувачем для ваших користувачів, оскільки їм не потрібно запам’ятовувати свої облікові дані для входу на ваш веб-сайт, а також позбавляє вас від додавання кодів для перевірки. Це безпрограшна ситуація.
У цій статті ми вивчаємо покрокове керівництво щодо додавання входу Google у Laravel за допомогою Laravel Socialite. Laravel socialite обробляє потік OAuth для соціального входу за лаштунки. Цей пакет прискорює процес інтеграції соціального входу на Laravel.
Для цього підручника я використаю свіжу інсталяцію Laravel, тому запустіть наведену нижче команду, яка встановить Laravel для вас:
composer create-project --prefer-dist laravel/laravel googlelogin
Після встановлення Laravel створіть базу даних та додайте свої дані до .env
файлу. Оскільки ми додаємо соціальну реєстрацію в програмі, я додаю ще 2 стовпці до файлу міграції користувачів за замовчуванням і трохи змінив його код.
Відкрийте файл міграції користувача та додайте код нижче до up
методу.
/**
* Run the migrations.
*
* @return void
*/
public function up()
{
Schema::create('users', function (Blueprint $table) {
$table->bigIncrements('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();
});
}
У наведеному вище коді я додав 2 колонки provider
і provider_id
які будуть утримувати значення «Google» і профіль користувача ідентифікатор Google відповідно. Створіть таблицю "користувачі", запустивши команду migrate.
php artisan migrate
Вам також потрібно додати ці 2 стовпці до моделі користувача.
app / User.php
/**
* The attributes that are mass assignable.
*
* @var array
*/
protected $fillable = [
'name', 'email', 'password', 'provider', 'provider_id',
];
Створіть програму Google і отримайте свої облікові дані
Далі нам потрібно створити проект на консолі API Google. Для завершення процесу OAuth для користувачів нам знадобляться ідентифікатор клієнта та секрет клієнта програми.
Виконайте наведені нижче дії для створення проекту Google та отримання облікових даних. Для підручника я використовую URL-адресу локального сервера. Ви можете налаштувати цю URL-адресу відповідно до своїх вимог.
- Перейдіть на Консоль розробника Google.
- Клацніть на розкривне меню та створіть новий проект, натиснувши знак (+). Ви також можете вибрати існуючий проект.
- На інформаційній панелі проекту виберіть Бічні дані на бічній панелі.
- На вкладці Повноваження натисніть спадне меню Створити облікові дані та виберіть ідентифікатор клієнта OAuth.
- Виберіть веб-програму з типу програми. В авторизованих URL-адресах переспрямування введіть URL-адресу
http://localhost:8000/google/callback
.
Після збереження ви отримаєте спливаюче вікно разом із вашим ідентифікатором клієнта та секретом клієнта. Скопіюйте ці ключі, які нам знадобляться за кілька хвилин.
Створіть маршрути та контролер
Ви готові до використання ваших ключів API. Тепер, щоб продовжити далі, нам потрібно створити маршрути, файл леза та контролер. Створіть LoginController
команду:
php artisan make:controller LoginController
Після цього створіть файл леза з назвою login.blade.php
та додайте до нього HTML нижче.
<a href="{{ url('/login/google') }}">
{{ __('Login with Google') }}
</a>
Викличте цей вигляд із index
методу LoginController
.
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';
});
Зверніть увагу, що я додав home
маршрут. Коли користувач увійде в систему Google, я перенаправлю його на home
маршрут. Я просто зберігаю його для демонстраційних цілей. Вам слід змінити цей маршрут на інший.
Вхід Google у Laravel за допомогою Laravel Socialite
Поки що ми закінчили з базовим налаштуванням, необхідним для соціального входу. Зараз. настав час встановити бібліотеку Laravel Socialite. Встановіть його, запустивши наведену нижче команду в терміналі.
composer require laravel/socialite
Після встановлення бібліотеки відкрийте config/services.php
та додайте конфігурацію Google таким чином:
'google' => [
'client_id' => env('GOOGLE_CLIENT_ID'),
'client_secret' => env('GOOGLE_CLIENT_SECRET'),
'redirect' => env('GOOGLE_REDIRECT_URL'),
],
Оскільки ми використовували env
метод для отримання облікових даних, нам потрібно додати ці облікові дані у .env
файл.
GOOGLE_CLIENT_ID=YOUR_CLIENT_ID
GOOGLE_CLIENT_SECRET=YOUR_CLIENT_SECRET
GOOGLE_REDIRECT_URL=http://localhost:8000/google/callback
Обов’язково замініть заповнювачі фактичними значеннями. Нарешті, нам потрібно додати код у LoginController.php
файл, який переспрямовує користувача на сторінку входу в Google, а у відповідь обробляє відповідь. У цьому файлі ми пишемо функцію, яка перенаправляє користувача на сторінку входу в Google, і після успішної авторизації вона вставить дані користувача в базу даних і ввійде в систему.
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 Google authentication page.
*
* @return Response
*/
public function redirectToProvider($provider)
{
return Socialite::driver($provider)->redirect();
}
/**
* Obtain the user information from Google.
*
* @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
]);
}
}
У нашому файлі контролера ми перевіряємо, чи provider_id
вже існує користувач з, чи ні. Якщо він існує, поверніть поточний екземпляр користувача, інакше вставте його в таблицю користувачів і ввійдіть в систему.
Сподіваюся, ви дізналися про вхід в Google у Laravel за допомогою пакету Socialite. Я хотів би почути ваші думки та пропозиції у розділі коментарів нижче.
Пов’язані статті
- Увійдіть за допомогою LinkedIn в Laravel за допомогою Laravel Socialite
- Увійдіть за допомогою Twitter у Laravel за допомогою Laravel Socialite
- Як додати вхід Google OAuth на веб-сайт за допомогою PHP