Zaloguj się przez Google w Laravel za pomocą Laravel Socialite
Niedawno opublikowałem artykuł Logowanie z LinkedIn przy użyciu Laravel Socialite i jeden z naszych czytelników zapytał o zintegrowanie logowania Google w Laravel. Logowanie przez Google jest również jedną z popularnych platform wykorzystywanych do logowania społecznościowego na stronie.
Gdy zezwalasz użytkownikom na logowanie się za pomocą ich profilu społecznościowego w Twojej witrynie, pomijasz proces weryfikacji ich adresu e-mail. Twoi użytkownicy nie muszą przechodzić procesu aktywacji przez e-mail. Możemy polegać na serwisach społecznościowych, które już zweryfikowały użytkowników na swojej platformie. Zapewnia to lepsze wrażenia użytkowników, ponieważ nie muszą oni zapamiętywać swoich danych logowania do Twojej witryny, a także oszczędza przed dodawaniem kodów w celu weryfikacji.. To sytuacja korzystna dla obu stron.
W tym artykule zapoznamy się krok po kroku z dodawaniem Google Login w Laravel za pomocą Laravel Socialite. Laravel socialite obsługuje przepływ OAuth dla logowania społecznościowego za kulisami. Ten pakiet przyspiesza proces integracji logowania społecznościowego na Laravelu.
W tym samouczku użyję świeżej instalacji Laravela, więc uruchom poniższe polecenie, które zainstaluje Laravela dla Ciebie:
composer create-project --prefer-dist laravel/laravel googlelogin
Po zainstalowaniu Laravela utwórz bazę danych i dodaj swoje dane uwierzytelniające do bazy danych w .env
pliku. Ponieważ dodajemy social login w aplikacji, dodam 2 dodatkowe kolumny do domyślnego pliku migracji użytkowników i trochę zmodyfikuję jego kod.
Otwórz plik migracji użytkownika i dodaj poniższy kod do up
metody.
/**
* 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();
});
}
W powyższym kodzie Dodałem 2 kolumny provider
i provider_id
która będzie posiadać wartości „google" i profilu Google identyfikator użytkownika odpowiednio. Utwórz tabelę „użytkownicy”, uruchamiając polecenie migracji.
php artisan migrate
Musisz również dodać te 2 kolumny do modelu użytkownika.
aplikacja/Użytkownik.php
/**
* The attributes that are mass assignable.
*
* @var array
*/
protected $fillable = [
'name', 'email', 'password', 'provider', 'provider_id',
];
Utwórz aplikację Google i zdobądź swoje poświadczenia
Następnie musimy stworzyć projekt w konsoli Google APIs. Aby ukończyć proces OAuth dla użytkowników, będziemy wymagać identyfikatora klienta i klucza klienta aplikacji.
Wykonaj poniższe czynności, aby utworzyć projekt Google i uzyskać poświadczenia. Ze względu na samouczek używam adresu URL serwera lokalnego. Możesz dostosować ten adres URL zgodnie z wymaganiami.
- Przejdź do Konsoli programisty Google.
- Kliknij na rozwijane menu i utwórz nowy projekt, klikając znak (+). Alternatywnie możesz również wybrać istniejący projekt.
- Na pulpicie projektu wybierz Poświadczenia z paska bocznego.
- Na karcie Poświadczenia kliknij menu rozwijane Utwórz poświadczenia i wybierz Identyfikator klienta OAuth.
- Wybierz aplikację internetową z Typ aplikacji. W Autoryzowane adresy URL przekierowania wpisz adres URL
http://localhost:8000/google/callback
.
Po zapisaniu otrzymasz wyskakujące okienko wraz z identyfikatorem klienta i kluczem tajnym klienta. Skopiuj te klucze, których będziemy potrzebować za kilka chwil.
Twórz trasy i kontroler
Jesteś gotowy z kluczami API. Aby przejść dalej, musimy utworzyć trasy, plik ostrza i kontroler. Utwórz za LoginController
pomocą polecenia:
php artisan make:controller LoginController
Następnie utwórz plik blade o nazwie login.blade.php
i dodaj do niego poniższy kod HTML.
<a href="{{ url('/login/google') }}">
{{ __('Login with Google') }}
</a>
Nazwij ten widok z index
metody LoginController
.
public function index()
{
return view('login');
}
Aby wywołać ten widok, musisz dodać do niego trasę. Dodajmy jeszcze kilka tras, które będą potrzebne w następnej części samouczka.
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';
});
Zauważ, że dodałem home
trasę. Gdy użytkownik zaloguje się w Google, przekieruję go na home
trasę. Zachowuję go tylko do celów demonstracyjnych. Powinieneś zmienić tę trasę na coś innego.
Zaloguj się przez Google w Laravel za pomocą Laravel Socialite
Jak dotąd skończyliśmy z podstawową konfiguracją wymaganą do logowania społecznościowego. Teraz. czas zainstalować bibliotekę Laravel Socialite. Zainstaluj go, uruchamiając poniższe polecenie w terminalu.
composer require laravel/socialite
Po zainstalowaniu biblioteki otwórz config/services.php
i dodaj konfigurację Google w następujący sposób:
'google' => [
'client_id' => env('GOOGLE_CLIENT_ID'),
'client_secret' => env('GOOGLE_CLIENT_SECRET'),
'redirect' => env('GOOGLE_REDIRECT_URL'),
],
Ponieważ użyliśmy env
metody, aby uzyskać poświadczenia, musimy dodać te poświadczenia w .env
pliku.
GOOGLE_CLIENT_ID=YOUR_CLIENT_ID
GOOGLE_CLIENT_SECRET=YOUR_CLIENT_SECRET
GOOGLE_REDIRECT_URL=http://localhost:8000/google/callback
Pamiętaj, aby zastąpić symbole zastępcze rzeczywistymi wartościami. Na koniec musimy dodać w LoginController.php
pliku kod, który przekierowuje użytkownika na stronę logowania Google iw zamian obsługuje odpowiedź. W tym pliku piszemy funkcję, która przekierowuje użytkownika na stronę logowania Google i po udanej autoryzacji wstawi dane użytkownika do bazy danych i zaloguje użytkownika.
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
]);
}
}
W naszym pliku kontrolera sprawdzamy, czy użytkownik z provider_id
już istnieje, czy nie. Jeśli istnieje, zwróć bieżącą instancję użytkownika, w przeciwnym razie wstaw ją do tabeli użytkowników i zaloguj się.
Mam nadzieję, że dowiedziałeś się o Google Login w Laravel za pomocą pakietu Socialite. Chciałbym usłyszeć wasze przemyślenia i sugestie w sekcji komentarzy poniżej.
Powiązane artykuły
- Zaloguj się na LinkedIn w Laravel za pomocą Laravel Socialite
- Zaloguj się za pomocą Twittera w Laravel za pomocą Laravel Socialite
- Jak dodać logowanie Google OAuth do witryny za pomocą PHP