Реагировать на аутентификацию с использованием redux - PullRequest
0 голосов
/ 16 июня 2020

Я создаю страницу аутентификации пользователя с помощью response и redux. Я отправляю форму входа, а затем перехожу на страницу профиля, на которой отображаются некоторые данные пользователя. Дело в том, что когда я отправляю данные на сервер и получаю токен в ответе, я сохраняю его в локальном хранилище, чтобы впоследствии получить данные этого пользователя, используя этот токен. Мне просто интересно, есть ли другой способ сохранить этот токен в redux, а не в локальном хранилище, и передать его функции, которая извлекает пользовательские данные в redux. Вот действие, которое я использую, чтобы опубликовать электронную почту и пароль и сохранить их в локальном хранилище.

function login(email, password) {



    return dispatch => {
        dispatch(request({ email }));

        userService.login(email, password)
            .then(
                user => {

                      //  console.log(user);
                //      console.log(user.data.token)
                  userService.fetchUserData(user.data.token)
                      .then(response =>{
                          console.log(response.data);
                          dispatch(success(response.data));
                          localStorage.setItem('user', JSON.stringify(response.data));




                          history.push(`${baseURL}/main`);

                      });
                    //history.push('/main');
                },
                error => {
                    dispatch(failure(error.toString()));
                    dispatch(alertActions.error(error.toString()));


                }
            );
    };

    function request(user) { return { type: userConstants.LOGIN_REQUEST, user } }
    function success(user) { return { type: userConstants.LOGIN_SUCCESS, user } }
    function failure(error) { return { type: userConstants.LOGIN_FAILURE, error } }
}

А это функция, которая извлекает данные с помощью токена в локальном хранилище:


function login(email, password) {
    const requestOptions = {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify({ email, password })
    };

    return fetch(`<backendURL>/auth/login`, requestOptions)
        .then(handleResponse)
        .then(user => {
            // store user details and jwt token in local storage to keep user logged in between page refreshes
           // localStorage.setItem('user', JSON.stringify(user));
           // console.log('this is the token:'+user.data.token);
            let token=user.data.token
     //   console.log('this is the user token:'+token);



            return user;
        });
}

Надеюсь, что мой вопрос достаточно ясен, и заранее благодарю.

1 Ответ

0 голосов
/ 16 июня 2020

Не рекомендуется хранить токен аутентификации пользователя в магазине Redux.

Можно сохранить токен в магазине Redux и получить его в любое время. Но вы должны понимать, что сеанс пользователя должен поддерживаться приложением в браузере до тех пор, пока он не станет действительным. И действительность сеанса подтверждается Сервером с использованием токена аутентификации.

С учетом сказанного, хранилище Redux очищается при обновлении браузера sh. Это означает, что все состояние, хранящееся в магазине, потеряно, и приложение будет снова подключено. Это, в свою очередь, отправит все действия и получит последние данные с сервера. Для получения данных с сервера требуется токен аутентификации, и он не будет доступен, если он хранится в хранилище Redux. Вот почему вы храните токен в localStorage, который гарантирует, что токен будет доступен, даже если страница обновится.

Надеюсь, это поможет!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...