4.8 KiB
4.8 KiB
id | title | challengeType | videoUrl | localeTitle |
---|---|---|---|---|
589a69f5f9fc0f352b528e70 | Implementation of Social Authentication | 2 | Implementación de la autenticación social. |
Description
- El usuario hace clic en un botón o enlace que lo envía a nuestra ruta para autenticarse mediante una estrategia específica (por ejemplo, Github)
- Su ruta llama a
passport.authenticate('github')
que los redirige a Github. - La página en la que aterriza el usuario, en Github, les permite iniciar sesión si aún no lo están. Luego les pide que aprueben el acceso a su perfil desde nuestra aplicación.
- El usuario es devuelto a nuestra aplicación en una url de devolución de llamada específica con su perfil, si se aprueban.
- Ahora están autenticados y su aplicación debería verificar si se trata de un perfil de retorno, o guardarla en su base de datos si no lo está.
process.env.GITHUB_CLIENT_ID
. Para este desafío vamos a utilizar la estrategia Github. La obtención de su ID de cliente y Secreto de Github se realiza en la configuración del perfil de su cuenta en 'Configuración del desarrollador' y luego en ' Aplicaciones OAuth '. Haga clic en 'Registrar una nueva aplicación', nombre su aplicación, pegue la url en su página de inicio de Glitch ( no la url del código del proyecto ) y, por último, para la url de devolución de llamada, pegue la misma url que la página de inicio pero con '/ auth / github / callback 'añadido. Aquí es donde los usuarios serán redirigidos para que nosotros los manejemos después de la autenticación en Github. Guarde la información devuelta como 'GITHUB_CLIENT_ID' y 'GITHUB_CLIENT_SECRET' en su archivo .env. En su proyecto remezclado, cree 2 rutas aceptando solicitudes GET: / auth / github y / auth / github / callback. El primero solo debe llamar al pasaporte para autenticar 'github' y el segundo debe llamar al pasaporte para autenticar 'github' con una redirección de falla a '/' y luego, si eso es exitoso, redirigir a '/ profile' (similar a nuestro último proyecto). Un ejemplo de cómo debería verse '/ auth / github / callback' es similar a cómo manejamos un inicio de sesión normal en nuestro último proyecto: app.ruta ('/ login') .post (passport.authenticate ('local', {failureRedirect: '/'}), (req, res) => { res.redirect ('/ profile'); });Envía tu página cuando creas que lo has hecho bien. Si te encuentras con errores, puedes revisar el proyecto hasta este punto aquí .
Instructions
Tests
tests:
- text: Ruta / auth / github correcta
testString: 'getUserInput => $.get(getUserInput("url")+ "/_api/server.js") .then(data => { assert.match(data, /("|")\/auth\/github("|")[^]*get.*passport.authenticate.*github/gi, "Route auth/github should only call passport.authenticate with github"); }, xhr => { throw new Error(xhr.statusText); })'
- text: Ruta / auth / github / callback correcto
testString: 'getUserInput => $.get(getUserInput("url")+ "/_api/server.js") .then(data => { assert.match(data, /("|")\/auth\/github\/callback("|")[^]*get.*passport.authenticate.*github.*failureRedirect:( |)("|")\/("|")/gi, "Route auth/github/callback should accept a get request and call passport.authenticate for github with a failure redirect to home"); }, xhr => { throw new Error(xhr.statusText); })'
Challenge Seed
Solution
// solution required