Login do Google no Laravel usando Laravel Socialite
Recentemente publiquei um artigo Login com LinkedIn usando Laravel Socialite e um de nossos leitores perguntou sobre a integração do Google Login no Laravel. O login do Google também é uma das plataformas populares usadas para login social no site.
Ao permitir que os usuários façam login com seus perfis sociais em seu site, você pula o processo de validação de seus e-mails. Seus usuários não precisam seguir um processo de ativação por e-mail. Podemos confiar nos sites sociais, pois eles já validaram os usuários em sua plataforma. Oferece uma melhor experiência de usuário para seus usuários, pois eles não precisam se lembrar de suas credenciais de login para o seu site e também evita que você adicione códigos para o fluxo de verificação. É uma situação ganha-ganha.
Neste artigo, estudamos o guia passo a passo sobre como adicionar o login do Google no Laravel usando o Laravel Socialite. A socialite Laravel lida com o fluxo OAuth para login social nos bastidores. Este pacote acelera o processo de integração do login social no Laravel.
Para este tutorial, usarei uma instalação nova do Laravel, então execute o comando abaixo que instalará o Laravel para você:
composer create-project --prefer-dist laravel/laravel googleloginApós a instalação do Laravel, crie um banco de dados e adicione suas credenciais de banco de dados no .envarquivo. Como estamos adicionando o login social no aplicativo, adicionarei mais 2 colunas ao arquivo de migração de usuário padrão e modificarei um pouco seu código.
Abra o arquivo de migração do seu usuário e adicione o código abaixo ao upmétodo.
/**
* 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();
});
}No código acima, adicionei 2 colunas providere provider_idque conterão os valores ‘google’ e o id do perfil do usuário no Google, respectivamente. Crie a tabela de ‘usuários’ executando o comando migrate.
php artisan migrateVocê também precisa adicionar essas 2 colunas ao modelo do usuário.
app / User.php
/**
* The attributes that are mass assignable.
*
* @var array
*/
protected $fillable = [
'name', 'email', 'password', 'provider', 'provider_id',
];Crie um aplicativo do Google e obtenha suas credenciais
Em seguida, precisamos criar um projeto no console de APIs do Google. Exigiremos o ID do cliente e o segredo do cliente do aplicativo para concluir o processo OAuth para os usuários.
Siga as etapas abaixo para criar um projeto do Google e obter as credenciais. Para o bem do tutorial, estou usando a URL do servidor local. Você pode ajustar este URL de acordo com sua necessidade.
- Vá para o Google Developer Console.
- Clique no menu suspenso e crie um novo projeto clicando no sinal (+). Como alternativa, você também pode selecionar o projeto existente.
- No painel do projeto, selecione Credenciais na barra lateral.
- Na guia Credenciais, clique na lista suspensa Criar credenciais e selecione ID do cliente OAuth.
- Selecione o aplicativo da Web no tipo de aplicativo. Em URLs de redirecionamento autorizados, insira o URL
http://localhost:8000/google/callback.
Depois de salvá-lo, você receberá o pop-up junto com seu ID de cliente e segredo do cliente. Copie essas chaves que iremos exigir em alguns momentos.
Criar rotas e controlador
Você está pronto com suas chaves de API. Agora, para prosseguir, temos que criar rotas, arquivo blade e controlador. Crie um LoginControllerusando o comando:
php artisan make:controller LoginControllerDepois disso, crie um arquivo blade chamado login.blade.phpe adicione o HTML abaixo a ele.
<a href="{{ url('/login/google') }}">
{{ __('Login with Google') }}
</a>Chame essa visão do indexmétodo de LoginController.
public function index()
{
return view('login');
}Para chamar esta vista, você precisa adicionar uma rota para ela. Vamos adicionar mais algumas rotas que também serão necessárias para a próxima parte do tutorial.
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';
});Observe que adicionei uma homerota. Quando um usuário fizer o login com o Google, vou redirecioná-lo para a homerota. Eu apenas o mantenho para fins de demonstração. Você deve alterar esta rota para outra coisa.
Login do Google no Laravel usando Laravel Socialite
Até agora, concluímos a configuração básica necessária para o login social. Agora. é hora de instalar a biblioteca Laravel Socialite. Instale-o executando o comando abaixo no terminal.
composer require laravel/socialiteApós a instalação da biblioteca, abra config/services.phpe adicione a configuração do Google da seguinte forma:
'google' => [
'client_id' => env('GOOGLE_CLIENT_ID'),
'client_secret' => env('GOOGLE_CLIENT_SECRET'),
'redirect' => env('GOOGLE_REDIRECT_URL'),
],Como usamos o envmétodo para obter credenciais, precisamos adicionar essas credenciais ao .envarquivo.
GOOGLE_CLIENT_ID=YOUR_CLIENT_ID
GOOGLE_CLIENT_SECRET=YOUR_CLIENT_SECRET
GOOGLE_REDIRECT_URL=http://localhost:8000/google/callbackCertifique-se de substituir os marcadores de posição por valores reais. Finalmente, precisamos adicionar o código no LoginController.phparquivo que redireciona o usuário para a página de login do Google e, em troca, trata da resposta. Neste arquivo, estamos escrevendo uma função que redireciona um usuário para a página de login do Google e, com a autorização bem-sucedida, irá inserir os detalhes do usuário no banco de dados e fazer o login do usuário.
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
]);
}
}Em nosso arquivo de controlador, estamos verificando se o usuário com provider_idjá existe ou não. Se existir, retorne a instância do usuário atual, caso contrário, insira-o na tabela de usuários e efetue o login do usuário.
Espero que você conheça o Google Login no Laravel usando o pacote Socialite. Eu gostaria de ouvir seus pensamentos e sugestões na seção de comentários abaixo.
Artigos relacionados
- Faça login com o LinkedIn no Laravel usando o Laravel Socialite
- Faça login com o Twitter no Laravel usando o Laravel Socialite
- Como adicionar o login do Google OAuth a um site com PHP