Autenticação do Google NodeJS usando Passport e Express

Se você já usou sua conta do Google para fazer login em um aplicativo, deve ter notado como é fácil. Você só precisa clicar em um botão e não precisa digitar seu e-mail ou senha. Embora isso pareça simples, o que acontece nos bastidores é bastante complexo. No entanto, ferramentas como o Passport facilitam.

Neste tutorial, você aprenderá como implementar a autenticação do Google no Node usando o Passport e o Express.

O que é passaporte?

Passaporte (ou Passport.js) é um middleware de autenticação Node que fornece mais de 500 estratégias para autenticação de usuários, incluindo autenticação social usando plataformas como Google e Twitter.

Você vai usar passaporte-google-oauth2 estratégia para autenticar usuários no Google.

Criando um sistema de autenticação do Google no Node

Esta é uma visão geral do sistema de autenticação que você criará:

• Quando um usuário clicar no botão de login, ele será enviado para a página de login do Google, onde fará login.
• O Google redirecionará o usuário para seu aplicativo com um token de acesso. O token de acesso lhe dá permissão para acessar as informações de perfil desse usuário.
  instagram viewer
• Envie o token de acesso ao Google para obter os dados do perfil.
• Crie um novo usuário ou recupere o usuário existente do banco de dados.
• Use JWTs para proteger rotas confidenciais.

Como configurar a autenticação do Google no NodeJS usando o Passport

Siga as etapas abaixo para autorizar usuários com o Google OAuth,

Etapa 1: criar um ID de cliente do Google e um segredo do cliente

Antes de usar o Google para fazer login de usuários em seu aplicativo, você precisa registrar seu aplicativo no Google para obter o ID do cliente e o segredo do cliente para usar ao configurar o Passport.

Faça login no Console do Google Cloud e siga as etapas a seguir para registrar seu aplicativo.

Crie um novo projeto. Na barra de menus, selecione Credenciais e na lista suspensa, selecione ID do cliente OAuth.

Para o tipo de aplicativo, selecione aplicativo da web. Adicione o nome preferencial para seu aplicativo no campo Nome.

Em URIs de redirecionamento autorizados, use http://localhost: 3000 e http://localhost: 3000/auth/google/callback para URIs de redirecionamento autorizados.

Clique crio para criar o cliente OAuth. Como as credenciais do aplicativo são confidenciais, você precisará criar um .env e adicione o ID do cliente e o segredo do cliente a ele.

CLIENT_ID = 
CLIENTE_SECRETO = 

Etapa 2: configurar o servidor do nó

Crie uma pasta, usuário-google-auth, e navegue até ele.

mkdir user-google-auth
cd user-google-auth

Inicializar npm para criar pacote.json.

npm init -y

Como você usará expresso para crie o servidor, instale-o executando o comando a seguir.

npm instalar expresso

Abra a pasta com seu editor de texto preferido e crie um novo arquivo app.js. Ele servirá como o ponto de entrada do seu aplicativo.

Crie o servidor NodeJS em app.js.

const expresso = require("expresso");
const app = express();
const PORTA = 3000;
app.listen (PORT, () => {
 console.log(`Ouvindo na porta ${PORT}`);
});

Etapa 2: configurar o MongoDB

Você armazenará os dados do usuário recebidos do Google em um Banco de dados MongoDB. Antes de salvar as informações do usuário, você precisa definir a estrutura na qual os dados serão armazenados. Mangusto é perfeito para isso. Ele fornece uma maneira bastante direta de criar modelos de dados.

Instalar mangusto.

npm instalar mangusto

Criar um novo arquivo userModel.jse crie o esquema do usuário.

const mangusto = require("mangusto");
const { Esquema } = mangusto.modelo;
const UserSchema = new Schema({
 Google: {
 identificação: {
 tipo: seqüência de caracteres,
 },
 nome: {
 tipo: seqüência de caracteres,
 },
 o email: {
 tipo: seqüência de caracteres,
 },
 },
});
const Usuário = mongoose.model("Usuário", UserSchema);
module.exports = Usuário;

Dentro userModel.js, você importou o mangusto e criou um novo esquema.

Observe que você está agrupando as informações do Google. Isso é especialmente útil quando você também está usando outros métodos de autenticação e um usuário usa mais de um. Isso facilita a prevenção do registro duplo.

A seguir, crie db.js.

const mangusto = require("mangusto");
mangusto. Promessa = global. Promessa;
const dbUrl = "mongodb://localhost/user";
const conectar = assíncrono () => {
 mongoose.connect (dbUrl, { useNewUrlParser: true, useUnifiedTopology: true });
 const db = mangusto.conexão;
 db.on("erro", () => {
 console.log("não foi possível conectar");
 });
 db.once("abrir", () => {
 console.log("> Conectado com sucesso ao banco de dados");
 });
};
module.exports = { conectar };

Conecte-se ao banco de dados em app.js.

const expresso = require("expresso");
const app = express();
const PORTA = 3000;
const db = require("./db");
db.connect();
app.listen (PORT, () => {
 console.log(`Ouvindo na porta ${PORT}`);
});

Etapa 3: configurar o passaporte

Instalar Passaporte e passaporte-google-oauth2.

npm i passaporte passaporte-google-oauth2

Crie um novo arquivo, passaporteConfig.jse importe a estratégia do Google de passaporte-google-oauth2 e userModel.js.

const GoogleStrategy = require("passport-google-oauth2").Strategy;
const User = require("./userModel");

Use as credenciais do seu aplicativo para configurar Passaporte com o Google OAuth.

module.exports = (passaporte) => {
 passaporte.use (new GoogleStrategy({
 clientID: processo.env. ID DO CLIENTE,
 clientSecret: process.env. CLIENT_SECRET,
 callbackURL: " http://localhost: 3000/auth/google/callback",
 passReqToCallback: true
 },
 async (solicitação, accessToken, refreshToken, perfil, feito) => {
 experimentar {
 let existingUser = await User.findOne({ 'google.id': profile.id });
// se o usuário existir retorna o usuário
 if (usuário existente) {
 retorno feito (null, existingUser);
 }
// se o usuário não existir cria um novo usuário
 console.log('Criando novo usuário...');
 const novoUsuário = novo Usuário({
 método: 'google',
 Google: {
 id: perfil.id,
 nome: profile.displayName,
 email: profile.emails[0].value
 }
 });
 aguarde novoUsuário.save();
 retorno feito (null, newUser);
 } pegar (erro) {
 retorno feito (erro, falso)
 }
 }
 ));
}

Depois de receber as informações do perfil do Google, verifique se o usuário existe no banco de dados. Se o fizerem, simplesmente retorne o usuário encontrado. Se o usuário for novo, crie um novo documento no banco de dados e retorne o usuário criado.

Observe que você está trabalhando com env variáveis, então use o npm pacote dotenv para acessá-los em seu aplicativo.

Instalar dotenv.

npm instalar dotenv

Usar dotenv dentro app.js.

require("dotenv").config()

Dentro app.js,passar Passaporte para passaporteConfig.js

const passaporte = require("passaporte");
require("./passportConfig")(passaporte);

Etapa 4: criar rotas de autenticação

Você precisa de três rotas para:

• Redirecione o usuário para a página de login do Google para obter o token de acesso.
• Recupere os dados do usuário usando o token de acesso recebido.
• Redirecionar o usuário para a página de perfil após autenticação bem-sucedida.

// Redireciona o usuário para a página de login do Google
app.get(
 "/auth/google",
 passaporte.authenticate("google", { scope: ["email", "profile"] })
);
// Recupera os dados do usuário usando o token de acesso recebido
app.get(
 "/auth/google/callback",
 passaporte.authenticate("google", { session: false }),
 (req, res) => {
 res.redirect("/perfil/");
 }
);
// rota do perfil após login bem-sucedido
app.get("/profile", (req, res) => {
 console.log (req);
 res.send("Bem-vindo");
});

Etapa 5: proteger rotas privadas

Agora que você fez login como usuário, como você pode restringir algumas partes do seu aplicativo apenas para usuários autenticados? Uma maneira de fazer isso é usando JSON Web Tokens (JWTs). Os JWTs oferecem uma maneira segura de transmitir as informações. Para autorizar usuários usando JWTs, seu aplicativo irá:

• Gere um token usando os dados do usuário.
• Passe o token para o usuário (o usuário enviará de volta o token com solicitações que precisam de autorização).
• Verifique o token enviado de volta.
• Conceda acesso ao usuário se o token apresentado for válido.

Instalar jsonwebtoken para trabalhar com JWTs.

npm instalar jsonwebtoken

Dentro app.js, importar jsonwebtoken.

const jwt = require("jsonwebtoken")

Modifique o URL de retorno de chamada do Google para assinar o usuário e gerar um token.

app.get(
 "/auth/google/callback",
 passaporte.authenticate("google", { session: false }),
 (req, res) => {
 jwt.sign(
 { usuário: req.user },
 "chave secreta",
 { expiraEm: "1h" },
 (erro, token) => {
 se (erro) {
 return res.json({
 token: nulo,
 });
 }
 res.json({
 símbolo,
 });
 }
 );
 }
);

Se você fizer login, receberá o token.

A seguir, use passaporte-jwt, uma estratégia de JWT fornecida pelo Passport para verificar o token e autorizar os usuários.

npm instalar passaporte-jwt

Dentro passaporteConfig.js, adicione a estratégia JWT.

const JwtStrategy = require("passport-jwt").Strategy;
const { ExtractJwt } = require("passport-jwt");
module.exports = (passaporte) => {
 passaporte.use (novo GoogleStrategy(
// Estratégia do Google
 );
 passaporte.use(
 new JwtStrategy(
 {
 jwtFromRequest: ExtractJwt.fromHeader("autorização"),
 secretOrKey: "secretKey",
 },
 assíncrono (jwtPayload, feito) => {
 experimentar {
//Extrai usuário
 const usuário = jwtPayload.user;
 feito (nulo, usuário); 
 } pegar (erro) {
 feito (erro, falso);
 }
 }
 )
 );
}

Aqui, você está extraindo o token do cabeçalho de autorização onde ele está armazenado, o que é muito mais seguro do que armazená-lo no corpo da solicitação.

Depois que o token é verificado, o objeto do usuário é enviado de volta ao corpo da solicitação. Para autorizar usuários, adicione o middleware de autenticação JWT do passaporte às rotas protegidas.

app.get(
 "/perfil",
 passaporte.authenticate("jwt", { session: false }),
 (req, res, próximo) => {
 res.send("Bem-vindo");
 }
);

Agora, apenas as solicitações que fornecem um token válido terão acesso.

Próximos passos

Este tutorial mostrou como você pode usar o Passport para conectar usuários ao seu aplicativo usando a conta do Google deles. Usar o Passport é muito mais simples do que outros formulários e você economizará muito tempo ao usá-lo.

O Passport também fornece outras estratégias de autenticação para uso com outros provedores de identidade, como Twitter e Facebook. Então, vale a pena conferir também.

Autenticação do usuário no NodeJS usando Passport e MongoDB

Leia a seguir

Sobre o autor