Я заранее прошу прощения за стену текста.
Я работаю над проектом для школы.Мы пытаемся создать приложение для обмена сообщениями с отдельным интерфейсом.Для серверной части мы решили использовать Hapi (NodeJS), который теперь является рабочим API, который аутентифицируется на основе JWT.Предположим, что серверная часть работает на http://localhost:3000.
. Для взаимодействия с API и создания удобного мессенджера мы решили использовать VueJS, используя Vuetify в качестве среды разработки.Мы создали шаблон веб-пакета с помощью vue create (Vue CLI3) и приступили к разработке страницы регистрации / входа в систему, которая подается на http://localhost:8080.
. Теперь я подошел к тому моменту, когда мне нужно подумать о способепоказать различный контент на основе аутентификации.Я могу запросить JWT из API, войдя в систему, но я не хочу хранить его в локальном хранилище, поскольку это небезопасно.То же самое касается файлов cookie, если они не являются HttpOnly.
Мне кажется, что приложение мессенджера не требует, чтобы пользователь входил в систему каждый раз, когда он перезапускает свой браузер, поэтому мне нужна какая-то постоянная работа, которая оставляет толькоодин вариант (пожалуйста, исправьте меня, если я ошибаюсь): HttpOnly куки, содержащие наши данные сеанса, в данном случае JWT. Поскольку я не могу установить файлы cookie HttpOnly с помощью Vue (так как это JS), как бы мне создать постоянную аутентификацию?
Мы хотим, чтобы пользователь перенаправлялся на страницу входа, еслиони не вошли в систему. Если они есть, они могут получить доступ и увидеть дополнительные функции (компоненты Vue).Если они обновляют или перезапускают свой браузер, они все равно должны войти в систему и иметь возможность доступа к функциям, которые предлагает API (например, отправка сообщений другим, чтение их собственных сообщений). Это, хотя и не уязвимо для XSS.
Я выпустил Google-фу уже 2 дня и не могу найти хорошего ответа.Люди используют VueX, который на самом деле не является постоянным и работает только с локальным хранилищем, что опять-таки небезопасно для хранения JWT.
Возможно ли это вообще с отдельным интерфейсом / бэкэндом?Если я отправлю обратно файл cookie с помощью Hapi, он может работать и храниться в браузере, но это будет HttpOnly, поэтому как мне прочитать его с помощью интерфейса, чтобы определить, аутентифицирован ли я?
Пожалуйстабыть как можно более многословным, так как мне кажется, что мне не хватает многих принципов и контекста дизайна, которые, очевидно, очень очевидны для всех остальных в Интернете.Я искренне верю, что если есть очень хороший ответ на этот вопрос, это поможет другим людям начать с нуля.
TL; DR: Как создать постоянную аутентификацию с помощью внешнего интерфейса Vue и Hapi.конец, не жертвуя безопасностью?