angularjs - manejo de sesiones en angular 4
Cómo almacenar un token de autenticación en una aplicación angular (2)
Tengo una aplicación angular (SPA) que se comunica con un servidor REST API y estoy interesado en encontrar el mejor método para almacenar un token de acceso devuelto por un servidor API para que el cliente angular pueda usarlo para autenticar futuras solicitudes. a la API. Por razones de seguridad, me gustaría almacenarlo como una variable de sesión del navegador para que el token no se mantenga después de que se cierre el navegador.
Estoy implementando una versión ligeramente personalizada de OAuth 2.0 utilizando la concesión de contraseña del propietario del recurso. La aplicación angular proporciona un formulario para que el usuario ingrese su nombre de usuario y contraseña. Estas credenciales se envían a la API a cambio de un token de acceso que luego debe enviarse como encabezado (Autorización: portador% Token%) para todas las solicitudes salientes a la API para que pueda autorizar las solicitudes a otras rutas.
Soy bastante nuevo en el ámbito de Angular, pero el flujo de trabajo que me gustaría implementar en lo que respecta al manejo de estos tokens se resume de la siguiente manera.
1) El cliente realiza una solicitud a la API proporcionándole credenciales de usuario.
2) Si esta solicitud es exitosa, el token se almacena en algún lugar (¿dónde está la pregunta?)
3) Interceptar solicitudes HTTP. Si token está configurado, páselo como un encabezado a API
4) El token se destruye cuando el navegador / pestaña está cerrado.
Sé que Angular ofrece $ window.sessionStorage , que parece ser lo que estoy buscando, pero me preocupa la posibilidad de que no funcione en todos los navegadores según varios recursos que he leído. Esta es una aplicación de nivel empresarial y debe ser compatible en una amplia gama de navegadores (IE, Chrome, Firefox). ¿Puedo usar esto con seguridad con la confianza de que será estable?
Las alternativas, por lo que entiendo, son $ window.localStorage o cookies ($ cookies, $ cookieStore). Esta no sería una solución ideal para mí, ya que no quiero que persistan estos datos, pero si esto es más confiable, tendré que sacrificar la eficiencia por compatibilidad. También pensé que sería posible simplemente establecerlo como un valor en $ rootScope y hacer referencia de esta manera, pero no estoy seguro si esto es factible.
Espero que todo tenga sentido. Cualquier ayuda / sugerencia sería muy apreciada. ¡Gracias!
Si está buscando algo que definitivamente no persistirá, simplemente mantendría el token en la memoria y no confiaré en el navegador para el almacenamiento. Sin embargo, almacenar dentro de rootScope no sería la mejor práctica.
Le recomendaría que envuelva su código de acceso al servidor en un Servicio angular si aún no lo ha hecho. A continuación, puede encapsular su token dentro de ese Servicio en tiempo de ejecución (por ejemplo, como una propiedad) sin preocuparse de tener que acceder a él cuando llame desde otras partes de su aplicación.
Los servicios angulares son únicos, por lo que su "servicio de servidor" será una instancia global a la que se puede acceder mediante la inyección de dependencia normal.
$window.sessionStorage es el camino a seguir, a menos que esté apuntando a navegadores muy antiguos.
Según www.w3schools.com sessionStorage es compatible con IE 8.0, Chrome 4.0, Firefox 3.5 y Safari 4.0.