Как сохранить и передать имя пользователя и пароль при перенаправлении по внешней ссылке в react

#reactjs #react-router #axios

#reactjs #react-маршрутизатор #axios

Вопрос:

я создаю страницу входа, после входа в систему необходимо перенаправить на внешнюю ссылку, как сохранить пользователя и ввести логин? мне нужно после нажатия кнопки войти, чтобы мои пользователи вошли на внешний веб-сайт

я использую

 "axios": "^0.18.0","react": "^16.8.5",
"react-dom": "^16.8.5",
"react-router": "^5.0.0",
"react-router-dom": "^5.0.0",
  
         e.preventDefault()
        axios.defaults.withCredentials = true;


        const bodyParameters = {
            params: {
                username: this.state.username,
                password: this.state.password,
                appType: this.state.appType
            }
        }


        axios.get(
            'http://localhost:8080/test/api',
            bodyParameters,

            {
                withCredentials: true
            }
        ).then((response) => {
            if (response.data.hasError !== true) {
                const token = localStorage.setItem('token', response.data.token)



                axios.defaults.headers['Authorization'] = "Bearer "   localStorage.getItem('token');

                window.location = 'http://localhost:8082/test'
                return response.data

            } else {
             console.log('error')
            }


        }).catch((error) => {

        });
  

Комментарии:

1. Это лучше делегировать серверу. Слишком небезопасно управлять этим в клиенте. Но один из способов сделать это — использовать localStorage (при условии, что он находится на той же вкладке), другой — с файлами cookie.

Ответ №1:

Вы можете использовать локальное хранилище —

        axios({
          method: 'post',
          url: 'http://localhost:4000/login',
        data: {
            user_email: formData.user_email.value,
            user_password: formData.user_password.value,
        }
    }).then(res => {
        if (res amp;amp; !res.data.error) {
            localStorage.setItem('sessionID', res.data.data.sessionID);
            localStorage.setItem('token', res.data.data.token);
            localStorage.setItem('sessionEmail', res.data.data.sessionEmail);
            localStorage.setItem('notify', JSON.stringify({msg: res.data.message, type: 'success'}));
            this.props.history.push("/testlist");
        } else if (res.data.error) {
            localStorage.setItem('notify', JSON.stringify({msg: res.data.message, type: 'error'}));
        }else if ( !res.data.error) {
            localStorage.removeItem('token', res.data.data.token);
            localStorage.setItem('notify', JSON.stringify({msg: res.data.message, type: 'error'}));
        } else {
            localStorage.setItem('notify', JSON.stringify({msg: res.data.message, type: 'error'}));
        }
    }, err => {
        console.log(err);
        localStorage.setItem('notify', JSON.stringify({msg: '500 api error', type: 'error'}));
    });
}
  

Комментарии:

1. как перенаправить? используйте окно. местоположение?

2. this.props.history.push используется для окна. Расположение