Implementando 0Auth2.0 con Google

Clase 30 de 39 • Curso de Autenticación con Passport.js 2019

Contenido del curso

Aprender sobre autenticación y autorización

Conocer qué son los JSON Web Tokens

Entender cómo funcionan las cookies

Implementar autenticación en Express usando Passport.js

Entender qué es OAuth 2.0 y OpenID Connect

28
¿Qué es OAuth 2.0 y OpenID Connect?
04:25 min

Implementar autenticación con redes sociales

Asegurar tu aplicación de Express

Tomar examen

Comentarios

Wandy Rafael Santana Evangelista

student•

Hola Devs:

Aqui tienen:

const GOOGLE_AUTHORIZATION_URL = 'https://accounts.google.com/o/oauth2/v2/auth';
const GOOGLE_TOKEN_URL = 'https://www.googleapis.com/oauth2/v4/token';
const GOOGLE_URSERINFO_URL = 'https://www.googleapis.com/oauth2/v3/userinfo';

Diego Francisco Luna Lopez

student•

Amigo eres increíble

Edgar Ocampo

student•

Heroe sin capa

Robert Jarod Meza Garcia

student•

No entendí nada, que bonito he copiado JAjajajajaj es absurdo este curso. Solo copiamos codigo

CARLOS GUZMAN

student•

Este curso frustra realmente, no por su contenido, si no por la forma como es impartido, honestamente y con mucho respeto, siento que el tutor estuviese leyendo sus comentarios a medida que escribe, los conceptos son pobres.

José Enrique Pérez Aquino

student•

Hola, si te sientes perdido en este curso te recomiendo fuertemente probar algún otro curso de NodeJs como este. Curso de NodeJs. Luego, regresa a este. También podrías tomar de manera opcional este. Curso de Autenticación con OAuth.

En definitiva este curso es avanzado y debes tener ciertas bases bien firmes para poder comprenderlo sin problemas.

Migrant Cyborg

student•

ATENCIÓN!!!! Si recién llegaste a esta clase, a menos que ya tengas un conocimiento avanzado de autenticación, no vas a entender absolutamente nada. LO MEJOR que le puedes hacer a tu vida es leer los tres enlaces recomendados de esta clase, y después ver la clase. Vas a poder entender mas fácilmente porque hace lo que hace el profesor en el código y tu vida será mas feliz, conseguirás un buen trabajo/ te darán un ascenso/ empezaras ese proyecto al que le quieres dedicar todo en tu vida, pero antes debes leer esa documentación, de lo contrario te esperan 7 años de mala suerte.

Deja tu like a este comentario para que mas personas logren su sueño de entender esta clase!

Saludos.

Luis Berenguer

student•

La verdad es que me perdí mucho en esta clase, voy a leer la documentación que comentaste.

Matias Sebastian Perez

student•

Tengo una pregunta con respecto a porque no ponemos la opcion "{ session: false }" en el endpoint "/auth/google-oauth", pero en el endpoint "/auth/google-oauth/callback" la ponemos.

Juan Castro

teacher•

:wave: Hey!

:one: El primer paso en la autenticación de Google es mandar al usuario a google.com. Luego de la autorización, Google mandará al usuario nuevamente a nuestra aplicación en /auth/google/callback.

app.get(
  "/auth/google-oauth",
  passport.authenticate("google-oauth", {
    scope: ["email", "profile", "openid"]
  })
);

:two: Si toda sale bien, ejecutamos la función de callback. Con { session: false } solo estamos indicando que no debemos salvar al usuario en la sesión. no es necesario en el primer paso porque apenas estamos validando la autenticación del usuario.

app.get(
  "/auth/google-oauth/callback",

  passport.authenticate(
    "google-oauth",
    { session: false }
  ),

  function(req, res, next) {
    if (!req.user) {
      next(boom.unauthorized());
    }

    const { token, ...user } = req.user;

    res.cookie("token", token, {
      httpOnly: !config.dev,
      secure: !config.dev
    });

    res.status(200).json(user);
  }
);

Referencias:

:point_right: http://www.passportjs.org/docs/google/ :point_right: https://stackoverflow.com/questions/40828955/passport-jwt-google-strategy-disable-session-res-send-after-google-cal :point_right: https://github.com/jaredhanson/passport/issues/169 :point_right: https://medium.com/front-end-weekly/learn-using-jwt-with-passport-authentication-9761539c4314

José Armando Gutiérrez Araujo

student•

No se entiende nada, y en la documentación de passport-oauth tampoco hay nada, y entonces? -_-

Diego Pedroza

student•

Por mi parte el _oauth2 me salia undefined. entonces lo que hice fue usar axios, para obtener la información del usuario:

const GOOGLE_USERINFO_URL = 'https://www.googleapis.com/oauth2/v1/userinfo';
oAuth2Strategy.userProfile = async (accessToken, done) => {
  try {
    const { data, status } = await axios({
      url: `${GOOGLE_USERINFO_URL}`,
      headers: { Authorization: `Bearer ${accessToken}`}
    });

    if (!data || status !== 200) {
      return done(boom.unauthorized('Failed to get user information'));
    }

    const { id, name, email } = data;

    const profile = {
      id,
      name,
      email
    }

    done(null, profile);
  } catch (error) {
    return done(error);
  }
}

passport.use('google-oauth', oAuth2Strategy);

Luis Berenguer

student•

Podemos implementar 0Auth2.0 con Google usando http (para pruebas) o necesitamos https?

Kevin Fiorentino

student•

Hola! Creo que lo más probable es que no sea posible. Se necesita HTTPS. He hecho pruebas de implementar el OAuth 2.0 de GitHub con Passport y tuve que hostear la app en algún servidor para tener HTTPS. Te recomiendo Heroku para esto que es muy fácil de deployar una app de prueba. Saludos!

Luis Berenguer

student•

Esta clase fue difícil de entender.

Luis Berenguer

student•

Creo que hubiera sido más sencillo implementar el paquete passport-google-oauth20 porque las URLs no las he podido encontrar y llevo leyendo la documentación que nos dejan en los recursos de abajo más de 15 minutos.

Naldo Duran

student•

✌

Eduardo Toledo Valerio

student•

¿A alguien mas le surge este error a la hora de entrar a http://localhost:8000/auth/google-oauth? Error de autorización Error 400: redirect_uri_mismatch The redirect URI in the request, http://localhost:8000/auth/auth/google-oauth/callback, does not match the ones authorized for the OAuth client. To update the authorized redirect URIs, visit: https://console.developers.google.com/apis/credentials/oauthclient/403982055480-und6ah5voc7scc2at7ulk2mtluf2ubtd.apps.googleusercontent.com?project=403982055480

Karen Paola Diaz Duarte

student•

tremendo, muy bueno :)

Maria Elizabeth Minero Alvarenga

student•

const GOOGLE_AUTHORIZATION_URL = 'https://accounts.google.com/o/oauth2/v2/auth';
const GOOGLE_TOKEN_URL = 'https://www.googleapis.com/oauth2/v4/token';
const GOOGLE_URSERINFO_URL = 'https://www.googleapis.com/oauth2/v3/userinfo';

app.get(
  "/auth/google-oauth/callback",

  passport.authenticate(
    "google-oauth",
    { session: false }
  ),

  function(req, res, next) {
    if (!req.user) {
      next(boom.unauthorized());
    }

    const { token, ...user } = req.user;

    res.cookie("token", token, {
      httpOnly: !config.dev,
      secure: !config.dev
    });

    res.status(200).json(user);
  }
);

const GOOGLE_USERINFO_URL = 'https://www.googleapis.com/oauth2/v1/userinfo';
oAuth2Strategy.userProfile = async (accessToken, done) => {
  try {
    const { data, status } = await axios({
      url: `${GOOGLE_USERINFO_URL}`,
      headers: { Authorization: `Bearer ${accessToken}`}
    });

    if (!data || status !== 200) {
      return done(boom.unauthorized('Failed to get user information'));
    }

    const { id, name, email } = data;

    const profile = {
      id,
      name,
      email
    }

    done(null, profile);
  } catch (error) {
    return done(error);
  }
}

passport.use('google-oauth', oAuth2Strategy);

Implementando 0Auth2.0 con Google

Aprender sobre autenticación y autorización

Lo que aprenderás sobre Passport.js

Stack de seguridad moderno

¿Qué es la autenticación y la autorización ?

Introducción a las sesiones

Conocer qué son los JSON Web Tokens

Anatomía de un JWT

Autenticación tradicional vs JWT

Firmando y Verificando nuestro JWT

Server-side vs Client-side sessions

Buenas prácticas con JWT

Entender cómo funcionan las cookies

¿Qué son las cookies y cómo implementar el manejo de sesión?

Cookies vs Session Storage vs Local Storage

Implementar autenticación en Express usando Passport.js

Arquitectura del proyecto Platzi Video

Agregando la colección de usuarios

Agregando la colección de películas de usuario

Implementando el POST y DELETE de las películas de usuario

Cómo conectarnos a la base de datos

Configuración de Passport.js

Implementación de BasicStrategy con Passport.js

Implementación de Strategy y ExtractJwt con Passport.js

Implementación de nuestro Sign-in

Implementación de nuestro Sign-up

Protegiendo nuestras rutas con Passport.js

Middleware para el manejo de scopes

Configuración del server render

Comunicación máquina a máquina

Implementando recordar sesión

Implementación de las rutas de las películas de usuario

Entender qué es OAuth 2.0 y OpenID Connect

¿Qué es OAuth 2.0 y OpenID Connect?

Implementar autenticación con redes sociales

Cómo crear un proyecto en Google API para hacer autenticación con 0Auth 2.0

Implementando 0Auth2.0 con Google

Implementando Sign Provider en nuestra API

Autenticación con Google usando OpenID Connect

Cómo crear una cuenta de desarrollador con Twitter

Autenticación con Twitter

Autenticación con Facebook

Asegurar tu aplicación de Express

Seguridad con Helmet y npm audit

Automatizar el chequeo de vulnerabilidades con Snyk

Qué es OWASP y buenas prácticas de seguridad

Conclusiones y cierre del curso