Как сохранить токен авторизации в приложении Angular

У меня есть приложение Angular (SPA), которое обменивается данными с сервером REST API, и я заинтересован в поиске лучшего способа хранения токена доступа, который возвращается с сервера API, чтобы клиент Angular мог использовать его для аутентификации будущих запросов к API. По соображениям безопасности я хотел бы сохранить его как переменную сеанса браузера, чтобы токен не сохранялся после закрытия браузера.

Я внедряю слегка настроенную версию OAuth 2.0, используя грант Resource Owner Password. Приложение Angular предоставляет форму для ввода пользователем имени пользователя и пароля. Эти учетные данные затем отправляются в API в обмен на токен доступа, который затем должен быть отправлен в качестве заголовка (Authorization: Bearer% Token%) для всех исходящих запросов к API, чтобы он мог авторизовать запросы к другим маршрутам.

Я довольно новичок в области Angular, но рабочий процесс, который я хотел бы реализовать, поскольку обработка этих токенов сводится к следующему.

1) Клиент делает запрос к API, предоставляя ему учетные данные пользователя.

2) Если этот запрос выполнен успешно, токен сохраняетсягде-то (где вопрос)

3) Перехват HTTP-запросов. Если токен установлен, передайте его в качестве заголовка API

4) Токен уничтожается, когда браузер / вкладка закрыта.

Я знаю угловые предложения$ window.sessionStorageПохоже, это то, что я ищу, но меня беспокоит возможность того, что он не будет работать во всех браузерах в соответствии с различными ресурсами, которые я прочитал. Это приложение корпоративного уровня и должно быть совместимо с широким спектром браузеров (IE, Chrome, Firefox). Могу ли я безопасно использовать это с уверенностью, что оно будет стабильным?

Насколько я понимаю, альтернативами являются либо $ window.localStorage, либо cookie-файлы ($ cookies, $ cookieStore). Это не было бы идеальным решением для меня, так как я не хочу, чтобы эти данные сохранялись, но если это будет более надежным, мне придется пожертвовать эффективностью для совместимости. Я также подумал, что можно было бы просто установить его как значение в $ rootScope и ссылаться на него таким образом, но я не уверен, возможно ли это.

Я надеюсь, что все имело смысл. Любая помощь / предложения будут с благодарностью. Спасибо!

Ответы на вопрос(2)

Ваш ответ на вопрос