Сохранение токена Auth в localStorage (React + ROR)

Question

Сохранение токена Auth в localStorage (React + ROR)

После входа в систему я сохраняю токен аутентификации в локальном хранилище браузера, чтобы я мог аутентифицировать каждое действие, запущенное на сервере. После входа в систему я должен обновить свой браузер, чтобы извлечь токен, поскольку корневой компонент не перезагружен. есть ли способ reerender index.js? Я создаю электронное приложение, поэтому обновление браузера не является вариантом.

в index.js

const AUTH_TOKEN = localStorage.getItem('user')

if(AUTH_TOKEN){
  axios.defaults.headers.common['Authorization'] = AUTH_TOKEN;
  store.dispatch({type: AUTHENTICATED});
}

но это будет отображаться только при загрузке приложения в первый раз. Магазин и маршруты определены внутри. Поэтому после входа в систему токен авторизации будет сохранен в localstorage, но не обновлен в приложении. Есть идеи?

ruby-on-rails,reactjs,redux,electron,

0

Ответов: 3

рубин-на-рельсы, reactjs, перевождь, электрон,

Похожие вопросы

score 1 · Answer 1

1

Вы можете просто установить заголовок авторизации axios после сохранения токена авторизации.

score 0 · Answer 2

0

вы можете управлять токеном, как и там, обновляться на токене,

const watchToken = (delay) => {
      return setTimeout(() => {
        myApi.getToken().then(res => {
          if (res.token) {
            store.dispatch({ type: AUTHENTICATED })
          } else {
            store.dispatch({ type: NOT_AUTHENTICATED })
          }
        })
      }, delay);
    }

    class App extends Component {
      tokenManager;

      constructor() {
        super();
        this.state = {
          isReady: false
        };
      }

      componentWillMount() {
        this.tokenManager = watchToken(20000)
      }

      componentWillUpdate(nextProps, nextState) {
        if (nextProps.TOKEN !== this.props.TOKEN) {
          this.tokenManager = watchToken(20000);
        }
      }

      componentWillUnmount() {
        this.tokenManager.clearTimeout();
      }

      render() {
        return (
          <div>
          </div>
        );
      }
    }

score 0 · Answer 3

0 принят

Так вот что я сделал

В действии Auth

            localStorage.setItem('user', response.data.auth_token);
            localStorage.setItem('name', response.data.user.name);
            localStorage.setItem('email', response.data.user.email);
            axios.defaults.headers.common['Authorization'] = response.data.auth_token;
            dispatch({ type: AUTHENTICATED });