Google-Login in Laravel mit Laravel Socialite
Vor kurzem habe ich einen Artikel Login with LinkedIn Using Laravel Socialite veröffentlicht und einer unserer Leser fragte nach der Integration von Google Login in Laravel. Die Google-Anmeldung ist auch eine der beliebtesten Plattformen für die Anmeldung in sozialen Netzwerken auf der Website.
Wenn Sie Benutzern erlauben, sich mit ihrem sozialen Profil auf Ihrer Website anzumelden, überspringen Sie den Vorgang der Validierung ihrer E-Mail. Ihre Benutzer müssen keinen E-Mail-Aktivierungsprozess durchlaufen. Wir können uns auf soziale Websites verlassen, da sie bereits Benutzer auf ihrer Plattform validiert haben. Es bietet Ihren Benutzern eine bessere Benutzererfahrung, da sie sich ihre Anmeldeinformationen für Ihre Website nicht merken müssen und Sie auch die Codes für den Bestätigungsablauf nicht hinzufügen müssen. Es ist eine Win-Win-Situation.
In diesem Artikel studieren wir Schritt für Schritt die Anleitung zum Hinzufügen von Google Login in Laravel mit Laravel Socialite. Laravel Socialite verarbeitet den OAuth-Flow für die soziale Anmeldung hinter den Kulissen. Dieses Paket beschleunigt den Prozess der Integration von Social Login auf Laravel.
Für dieses Tutorial verwende ich eine frische Laravel-Installation, also führen Sie den folgenden Befehl aus, der Laravel für Sie installiert:
composer create-project --prefer-dist laravel/laravel googleloginErstellen Sie nach der Installation von Laravel eine Datenbank und fügen Sie Ihre Datenbankanmeldeinformationen in die .envDatei ein. Da wir der Anwendung Social Login hinzufügen, werde ich der Standardbenutzermigrationsdatei 2 weitere Spalten hinzufügen und den Code ein wenig ändern.
Öffnen Sie die Migrationsdatei Ihres Benutzers und fügen Sie den folgenden Code zur upMethode hinzu.
/**
* 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();
});
}In dem obigen Code habe ich zwei Spalten hinzugefügt providerund provider_iddie die Werte ‚Google’ und Benutzer-Google – Profil – ID bzw. halten. Erstellen Sie die Tabelle ‘users’, indem Sie den Befehl migration ausführen.
php artisan migrateSie müssen diese beiden Spalten auch zum Benutzermodell hinzufügen.
app/User.php
/**
* The attributes that are mass assignable.
*
* @var array
*/
protected $fillable = [
'name', 'email', 'password', 'provider', 'provider_id',
];Erstellen Sie eine Google-Anwendung und erhalten Sie Ihre Anmeldeinformationen
Als Nächstes müssen wir ein Projekt in der Google APIs-Konsole erstellen. Wir benötigen die Client-ID und das Client-Geheimnis der Anwendung, um den OAuth-Prozess für die Benutzer abzuschließen.
Führen Sie die folgenden Schritte aus, um ein Google-Projekt zu erstellen und die Anmeldeinformationen abzurufen. Für das Tutorial verwende ich die lokale Server-URL. Sie können diese URL Ihren Anforderungen entsprechend anpassen.
- Rufen Sie die Google-Entwicklerkonsole auf.
- Klicken Sie auf das Dropdown-Menü und erstellen Sie ein neues Projekt, indem Sie auf das (+)-Zeichen klicken. Alternativ können Sie auch das vorhandene Projekt auswählen.
- Wählen Sie im Projekt-Dashboard in der Seitenleiste Anmeldeinformationen aus.
- Klicken Sie auf der Registerkarte Anmeldeinformationen auf das Dropdown-Menü Anmeldeinformationen erstellen und wählen Sie OAuth-Client-ID aus.
- Wählen Sie die Webanwendung aus dem Anwendungstyp aus. Geben Sie unter Autorisierte Weiterleitungs-URLs die URL ein
http://localhost:8000/google/callback.
Sobald Sie es gespeichert haben, erhalten Sie das Popup zusammen mit Ihrer Client-ID und Ihrem Client-Geheimnis. Kopieren Sie diese Schlüssel, die wir in wenigen Augenblicken benötigen.
Routen und Controller erstellen
Sie sind mit Ihren API-Schlüsseln fertig. Um weiter fortzufahren, müssen wir nun Routen, Blade-Dateien und Controller erstellen. Erstellen Sie eine LoginControllermit dem Befehl:
php artisan make:controller LoginControllerErstellen Sie danach eine Blade-Datei mit dem Namen login.blade.phpund fügen Sie den folgenden HTML-Code hinzu.
<a href="{{ url('/login/google') }}">
{{ __('Login with Google') }}
</a>Rufen Sie diese Ansicht mit der indexMethode von auf LoginController.
public function index()
{
return view('login');
}Um diese Ansicht aufzurufen, müssen Sie eine Route dafür hinzufügen. Lassen Sie uns auch ein paar weitere Routen hinzufügen, die für den nächsten Teil des Tutorials erforderlich sind.
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';
});Beachten Sie, dass ich eine homeRoute hinzugefügt habe. Wenn sich ein Benutzer bei Google anmeldet, werde ich ihn auf die homeRoute umleiten. Ich behalte es nur zu Demozwecken. Sie sollten diese Route in etwas anderes ändern.
Google-Login in Laravel mit Laravel Socialite
Bisher sind wir mit der grundlegenden Einrichtung, die für das Social Login erforderlich ist, fertig. Jetzt. Es ist Zeit, die Laravel Socialite- Bibliothek zu installieren. Installieren Sie es, indem Sie den folgenden Befehl im Terminal ausführen.
composer require laravel/socialiteÖffnen Sie nach der Installation der Bibliothek die config/services.phpGoogle-Konfiguration und fügen Sie sie wie folgt hinzu:
'google' => [
'client_id' => env('GOOGLE_CLIENT_ID'),
'client_secret' => env('GOOGLE_CLIENT_SECRET'),
'redirect' => env('GOOGLE_REDIRECT_URL'),
],Da wir die envMethode zum Abrufen von Anmeldeinformationen verwendet haben, müssen wir diese Anmeldeinformationen in der .envDatei hinzufügen .
GOOGLE_CLIENT_ID=YOUR_CLIENT_ID
GOOGLE_CLIENT_SECRET=YOUR_CLIENT_SECRET
GOOGLE_REDIRECT_URL=http://localhost:8000/google/callbackStellen Sie sicher, dass Sie die Platzhalter durch tatsächliche Werte ersetzen. Schließlich müssen wir der LoginController.phpDatei Code hinzufügen, der den Benutzer zur Google-Anmeldeseite umleitet und im Gegenzug die Antwort verarbeitet. In dieser Datei schreiben wir eine Funktion, die einen Benutzer auf die Google-Anmeldeseite umleitet und bei erfolgreicher Autorisierung Benutzerdaten in die Datenbank einfügt und den Benutzer anmeldet.
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
]);
}
}In unserer Controller-Datei prüfen wir, ob der Benutzer mit provider_idbereits existiert oder nicht. Wenn sie existiert, geben Sie die aktuelle Benutzerinstanz zurück, andernfalls fügen Sie sie in die Benutzertabelle ein und melden Sie den Benutzer an.
Ich hoffe, Sie haben Google Login in Laravel mit dem Socialite-Paket kennengelernt. Ich würde gerne Ihre Gedanken und Vorschläge im Kommentarbereich unten hören.
Zum Thema passende Artikel
- Melden Sie sich mit LinkedIn in Laravel mit Laravel Socialite an
- Melden Sie sich mit Twitter in Laravel mit Laravel Socialite an Social
- So fügen Sie Google OAuth-Login in Website mit PHP hinzu