0

tengo un problema que no he podido resolver, estoy un poco enredado y quisiera obtener alguna ayuda.

Estoy haciendo el registro de usuario de un proyecto personal pero quiero hacerlo de una forma bonita, funcional y lo más correcta que se pueda para un novato como yo. ya tengo el registro en la BD y luego procedo a enviar un correo de confirmación de cuenta con un link, cabe destacar que también estoy usando tokens para el acceso a recuros del servidor. El link lo creo con un hash + el id del usuario en la BD; el enlace termina viéndose así:

http://localhost:3000/ActivateAccount/?hash=$2b$10$uKG9PkUYjt.xyUXCEOhTCepo58g2deN5FYROAjsYa/KjEjNK5eGDS&id=34

Luego estoy intentando responder a ese link de la siguiente forma en el servidor:

router.get('/ActivateAccount', (req, res) => {
	// mostrar una página con un mensaje que indique que se está validando su cuenta
	// realizar operaciones en la bd para activar la cuenta del usuario
	// redireccionar a la página de inicio de ese usuaio ( como si se fuese logueado )

})

Acá es dónde tengo muchas complicaciones y estoy muy confundido, no se como programar la primera y la última línea comentadas en el código anterior. Lo que quisiera lograr es que cuándo el usuario haga click en el enlace, se muestre una página donde tal vez pudiera a parecer un loading spinner mientras en paralelo se están ejecutando las operaciones en la Base de datos para activar la cuenta y, que al finalizar dichas operaciones y esté validada la cta, se muestre un alert diciendo que la cuenta se ha validado y con un boton de "aceptar", y que el usuario al hacer click allí se redirija a la pagina de bienvenida para ese usuario.

Algo así como hace Facebook, cuándo ya se ha validado la cuenta, muestra una pequeña ventana diciendo que todo esta listo, y al hacer click en aceptar automáticamente te redirige a tu página de inicio, así como aparece en la siguiente imágen.

facebook

¿Cuáles son mis mayores problemas?

1) como haría para mostrar una página desde el servidor (la página que quiero que cargue mientras se realizan las operaciones en la BD) ? leí sobre servir archivos estáticos pero no estoy muy claro, entiendo que se puede renderizar una página en express con render pero ya lo probé, y al hacer eso como que se envía la respuesta al cliente de una vez y entonces las sentencias luego del render no se ejecutan.

2) la página que envío en el link, obviamente debe ser con el puerto del servidor, correcto? estoy trabajando con angular (puerto 4200) y node.js con Express (puerto 3000). para poder recibir los parámetros y procesarlos en el servidor, el link debe ser con el puerto del servidor, como lo mostré anteriormente o estoy equivocado?

3) he leído que los parámetros para validar la cuenta no debería ir en el link (por GET ) para protegerlos, pero he visto que así los envían mayormente los foros y páginas como Facebook.

Este es un ejemplo del link enviado por Facebook:

facebook.com/confirmemail.php?next=https%3A%2F%2Fwww.facebook.com%2F&rd&__req=n

Este es un ejemplo del link enviado por un foro:

https://www.foromecanicos.com/foro/account-confirmation/julian21931500.163342/email?c=1mGlZh9aoHEKoG1L

Sinceramente he buscado opciones, pero no he encontrado algo que me ayuda, espero alguien acá puede orientarme un poco, gracias de antemano.

Saludos!

1 respuesta 1

0

No hace falta hacer una página renderizada en el server, desde angular lo puedes hacer perfectamente.

Cuando envías la url en el correo de activación manda la url de angular a la ruta que cargue el componente de activar cuenta.

http://localhost:4200/ActivateAccount/?hash=$2b$10$uKG9PkUYjt.xyUXCEOhTCepo58g2deN5FYROAjsYa/KjEjNK5eGDS&id=34

En la parte servidor, puedes crear un endpoint que sea /activar-cuenta

router.post('/activar-cuenta', (req, res) => {
  // leer datos del req.body
  // hacer el get del usuario por id
  // validar el token
  // y confirmar la cuenta
  // todos estos pasos dependen de la implementación que tengas en el backend
  // devolver una respuesta en función de la validación 
});

En la parte de angular puedes crear una ruta que sea la de activar cuenta, por ejemplo. En el archivo de las rutas

// puedes poner un guard que valide que esta ruta se active solo si no está logueado el usuario
{
    path: 'ActivateAccount',
    component: ActivarCuenta
}

En tu componente ActivarCuenta

// es un pseudocodigo
constructor(private router: Router) {}
loading = true;
ngOnInit() {
   // leer los query params de la url
    this.router.queryParams.subscribe(params => {
        this.validateAccount(hash, id);
    });
}

validateAccount(hash, id) {
    // hacer una peticion post al endpoint /activar-cuenta con el user id y hash
    // esperar la repuesta
    // si todo va ok quitar loading 
    //mostrar un modal/alert dando el mensaje de activación
    // redirigir al login
}

La parte de hacer login en activar cuenta no te la recomiendo porque no tienes la contraseña (se que puedes hacer un get del usuario y la tienes pero no es muy recomendable) mejor luego de activar la cuenta redirigir a la pagina de login en angular.

16
  • Ante todo gracias por responder, ahora siento que estoy un poco más claro. Entiendo lo que menciones del login, pero como hace Facebook en ese caso? Tendrás idea? Yo tengo una tabla llamada "cuenta" con 3 col (id que hace ref a la tabla user, hash y activa), en mi pregunta mencioné que estoy haciendo uso de tokens y obviamente no se puede entrar al home sin un token, pero lo q se me había ocurrido era: al validar la cuenta, establecer la columna activa en true, dejar el hash, y entonces redireccionae al home, y en el Middleware que tengo al entrar al home verificar, si la col activa esta
    – JulianProg
    el 30 may. 2020 a las 22:02
  • En "true" y el hash está todavía en la tabla cuenta (esto me dice que el usuario se acabó de registrar) entonces autorizó el acceso y muestro el home y no solicito un token (por qué es la primera vez que ingresa como user nuevo) y elimino el hash de la tabla cuenta, si la col hash está vacia, quiere decir que la cuenta ya fue validada en algún momento y entonces se solicita el token. Crees que esté bien así? Todo esto con el fin de poder redireccionar al home una vez que se haya validado la cuenta y el user haga click en el botón aceptar como en Facebook. Tengo días en esto.
    – JulianProg
    el 30 may. 2020 a las 22:05
  • a que te refieres como lo hace facebook? la activación de la cuenta? Sinceramente no se al respecto, depende mucho del caso de uso. Me parece bien lo que comentas tener una tabla con active, hash y userid. Cuando te llamen al endpoint de activar-cuenta luego de validar el hash puedes poner active=true y el hash borrarlo porque una vez validada la cuenta no veo mucho sentido tenerlo. Pero si quieres tenerlo para temas de historial, pues como tu veas.
    – hawks
    el 30 may. 2020 a las 22:17
  • Y esta bien de tener un middleware(en nodejs) que valide si el usuario está activo sino es así puedes devolver un header o un json con active=false y con los interceptores de angular interceptar esa respuesta y mostrar una alert de reenviar correo de confirmación o activa tu cuenta.
    – hawks
    el 30 may. 2020 a las 22:17
  • Tambien cuando el user hace login puedes devolver que no esta activo y no dejar avanzar a la home. Para ea generación token puedes usar el paquete de node crypto.
    – hawks
    el 30 may. 2020 a las 22:19

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.