Size: a a a

React — русскоговорящее сообщество

2020 October 07

АК

Андрей Кобец... in React — русскоговорящее сообщество
Umid Musaev
Ребят, вопрос по авторизации пользователя с имеющимся токеном при инициализации приложения. Использую функциональный вид компонентов.
На данный момент уже описал отдельно функцию, где делаю запрос на подтверждение токена, что есть в localstorage, и получаю ответ. Далее, мне необходимо решить, где я буду его вызывать. Пробывал вызвать в App.js но, т.к. вышеописанная функция является асинхронной, то вызвать её синхронно из App не удаётся(как оказалось, app сделать асинхронным нельзя).
Думал просто сделать всё через .then, но если запрашиваемая страница требует авторизации, то она отрендерится раньше чем обработается запрос на подтверждение токена.
Акцесс токен всегда отправляется в заголовке запроса, потом на бэке он проверяется на его актуальность, если он протух то нужно делать рефреш
источник

UM

Umid Musaev in React — русскоговорящее сообщество
Андрей Кобец
Подтверждай токен в самом запросе который требует его
По сути, я делаю админку, и ни на какую страницу не должно быть доступа без прав. Так же, в приложении могут быть страницы без получения каких-либо данных с api. Итого, надо на все страницы сделать проверку авторизации, даже при инициализации
источник

АК

Андрей Кобец... in React — русскоговорящее сообщество
Запросы чем отправляешь?
источник

UM

Umid Musaev in React — русскоговорящее сообщество
Axios
источник

UM

Umid Musaev in React — русскоговорящее сообщество
Там уже сделал обработку на 403 и 401
источник

D♥

Dmitriy ♥️ in React — русскоговорящее сообщество
в интерсепторах редиректы можно делать
источник

UM

Umid Musaev in React — русскоговорящее сообщество
Dmitriy ♥️
в интерсепторах редиректы можно делать
Это уже есть, но дело в инициализации и страницах без запросов
источник

UM

Umid Musaev in React — русскоговорящее сообщество
Единственная доступная страница -
/signin
источник

АК

Андрей Кобец... in React — русскоговорящее сообщество
Umid Musaev
Это уже есть, но дело в инициализации и страницах без запросов
Там даже данные о пользователе не подгружаются?
источник

D♥

Dmitriy ♥️ in React — русскоговорящее сообщество
Umid Musaev
Это уже есть, но дело в инициализации и страницах без запросов
на реакте хз, но в ангуляре есть гуарды, а в nuxt - middleware. срабатывают при изменение роута
источник

D♥

Dmitriy ♥️ in React — русскоговорящее сообщество
должно быть что-то похожее. возможно, с библиотекой роутера
источник

UM

Umid Musaev in React — русскоговорящее сообщество
Андрей Кобец
Там даже данные о пользователе не подгружаются?
По идее, не должны
Но вот сейчас думаю, может сделать какой-либо preloader, и как только запрос пройдёт - вытаскивать Router
источник

АК

Андрей Кобец... in React — русскоговорящее сообщество
Umid Musaev
По идее, не должны
Но вот сейчас думаю, может сделать какой-либо preloader, и как только запрос пройдёт - вытаскивать Router
Ты роутер описываешь компонентами или через массив?
источник

UM

Umid Musaev in React — русскоговорящее сообщество
Андрей Кобец
Ты роутер описываешь компонентами или через массив?
Компонентами
источник

D♥

Dmitriy ♥️ in React — русскоговорящее сообщество
react-navigation ?
источник

UM

Umid Musaev in React — русскоговорящее сообщество
Dmitriy ♥️
react-navigation ?
react-router-dom
источник

АК

Андрей Кобец... in React — русскоговорящее сообщество
Umid Musaev
react-router-dom
источник

E

Egor in React — русскоговорящее сообщество
я делал обертку для Route, которая редиректит на страницу авторизации, если ты неавторизован
а инфу о том, авторизован или нет, клал в стор, в самом начале
источник

АК

Андрей Кобец... in React — русскоговорящее сообщество
Umid Musaev
react-router-dom
Пробуй отлавливать изменение роутера и там проверять авторизацию
источник

UM

Umid Musaev in React — русскоговорящее сообщество
Egor
я делал обертку для Route, которая редиректит на страницу авторизации, если ты неавторизован
а инфу о том, авторизован или нет, клал в стор, в самом начале
Так тут запрос то не отправишь с await'ом)
источник