node.js - make - react router redux login

Hacking authentication usind react-dev-tools

Question

Estoy aprendiendo autenticación basada en token en SPA y tengo una pregunta. Imagine que el proceso de autenticación en mi aplicación se hace de la siguiente manera: cada vez que un usuario proporciona credenciales correctas, le doy un token y cambio la clave "autentificada" en redux store a true, lo que le permite ver contenido privado en mi aplicación. El componente que quiero ocultar está codificado así:

if(this.props.authenticated) {
  return <SuperSecretComponentOfIlluminatiMasonic666Chemtrails />
} else {
  return <PublicComponent />
}

Me pregunto si es un enfoque seguro ya que cualquiera puede instalar reaccionar-dev-tools, voltear la clave "autenticada" en el navegador y ver las cosas que quiero ocultar sin proporcionar credenciales. ¿Debería mi componente estar codificado de una manera diferente o todo está bien y solo estoy obteniendo algo mal? He visto este enfoque en numerosos tutoriales, pero esta pregunta no me deja dormir por la noche

Answer 1

Debe obtener el contenido protegido de un servidor, y este servidor solo debe entregar el contenido cuando el usuario envía un token válido.

De esta manera, sí, cualquiera puede activar el interruptor en el cliente, pero eso solo muestra los componentes de la interfaz de usuario, sin ningún dato.

Este es el enfoque habitual al crear aplicaciones de una sola página. Siempre que no tenga datos secretos o confidenciales directamente en su cliente desde el principio, son tan seguros como su servidor / API que entrega los datos.