Usando React en el frontend con una API RESTful como backend y autorización por un JSON Web Token (JWT), ¿cómo manejamos las sesiones? Por ejemplo, después de iniciar sesión, obtengo un token JWT de REST. Si lo guardo en localStorage, soy vulnerable a XSS, si lo guardo en cookies, tengo los mismos problemas, excepto que configuro las cookies en HttpOnly, pero React no puede leer las cookies de HttpOnly (necesito leer las cookies para tomar JWT de él y usar este JWT con solicitudes REST), tampoco mencioné el problema de falsificación de solicitudes entre sitios (CSRF). Si usa REST como backend, no puede usar tokens CSRF.
Como resultado, React with REST parece una mala solución y necesito repensar mi arquitectura. ¿Es posible ofrecer a sus usuarios una aplicación React segura que maneje toda la lógica comercial en el lado de la API REST sin temor a perder sus datos?
Actualizar:
Por lo que entendí, es posible hacer esto:
Carezco de conocimientos teóricos aquí. La lógica parece bastante segura, pero todavía necesito una respuesta a mis preguntas y aprobar este "flujo de trabajo".
- React hace una llamada AJAX a la API REST
asegurado, un montón de librería de clientes de recursos tranquilos disponibles
- React obtiene el token JWT de REST
seguro, esto es lo que debe hacer JWT
- React escribe una cookie httponly
No lo creo, no debería funcionar, pero la sesión no es algo tan importante, pronto quedará obsoleta y volverá a verificar la contraseña en las operaciones clave, incluso los piratas informáticos la obtuvieron en muy poco tiempo, puede vincule el token de sesión junto con la IP cuando el usuario inicie sesión y compruébelo en su API de back-end. Si lo desea más seguro, simplemente mantenga el token en la memoria y vuelva a iniciar sesión cuando abra una nueva página o se actualice la página
- Debido a que reaccionar no puede leer la cookie httponly, la usamos tal cual en nuestra llamada REST donde necesitamos autenticación
asegurado, verifique el usuario y los permisos a través del token de inicio de sesión, como csrf, puede colocar su token de inicio de sesión en el encabezado de su solicitud y verificarlo en su API de back-end. Vincular el token de inicio de sesión a su propia biblioteca tranquila le ahorrará muchos códigos
- REST en las llamadas verifica el encabezado XMLHttpRequest, ¿qué es algún tipo de protección CSRF? El lado REST verifica la cookie, lee JWT y hace cosas
seguro, como lo hace la mayoría de la gente. Además, vincular el token csrf a tu propia lib tranquila te ahorrará muchos códigos
use el token de usuario en el encabezado https://www.npmjs.com/package/express-jwt-token Authorization JWT < jwt token >
use el token csrf en el encabezado https://github.com/expressjs/csurf req.headers['csrf-token'] - the CSRF-Token HTTP request header.
cliente tranquilo https://github.com/cujojs/rest
reaccionar con jwt https://github.com/joshgeller/react-redux-jwt-auth-example
Su servidor puede configurar la cookie JWT directamente como respuesta a la solicitud de inicio de sesión.
El servidor responde a POST /login con Set-Cookie: JWT=xxxxxx . Esa cookie es solo http y, por lo tanto, no es vulnerable a XSS, y se incluirá automáticamente en todas las solicitudes de obtención del cliente (siempre que use withCredentials: true ).
CSRF se mitiga como mencionó, consulte OWASP para obtener más detalles .