проблема с авторизацией: Bearer access_token (заголовки) в Axios POST реагирует

Question

Я пытаюсь создать логин из конечной точки, которая использует авторизацию и однонаправленный доступ на предъявителя. Я не знаю, как правильно передать токен авторизации в заголовке и, следовательно, возникает следующая ошибка.

Ответ {тип: «основной», URL: «http://127.0.0.1:8000/", перенаправлен: true, статус: 200, ok: true,…}

Я попытался прочитать сообщение Axios и тип предоставления, чтобы увидеть, как я могу передать access_token носителю. Проблема в том, что токен генерируется во время регистрации для каждого пользователя. Как я могу использовать это в логине. Изображение от почтальона для иллюстрации. Я скопировал access_token, сгенерированный от регистрации до авторизации.

handleLogin(event){
      event.preventDefault();
        var formData = new FormData();
        formData.append("password", this.state.l_password);
        formData.append("email",this.state.l_email);
        formData.append("remember_me", true);
      fetch('api/auth/login',
         {
            headers:{
               // 'accept': 'application/x-www-form-urlencoded',
                'content-type': 'application/json',
                'authorization': 'bearer',
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            },
            method: "POST",
            body:formData

         }
      )
           .then(response => {
                console.log(response);

            })
            .then(json => {
                return json.json();

            })
        }

От Почтальона, я использую только тип контента: application / json в качестве заголовка для входа в систему. Но больше всего озадачило то, что он показывает статус: хорошо, и на самом деле он не работает.

Answer 1

Вы делаете это немного неправильно.Во-первых, вы должны учитывать, что API использует токен, который необходимо указать в вашей конечной точке, например / oauth / token .Во-первых, если у вас есть почтальон, попробуйте проверить http://localhost:port/oauth/token, затем укажите тип содержимого заголовка: application / json и в вашем теле сделайте что-то вроде этого: -

{
    "username": "something@yahoo.com", 
    "password" : "abcdef",
    "client_id": "4",
    "client_secret" :"XXXXXXXXXXXXXXXXXXXXXX", 
    "grant_type": "password",
    "scope": "*"
}

Если вы посмотритевнимательно в коде, который я имею ниже, вы можете видеть, что я сделал все в теле.

Однако, я переписал ваш код

handleLogin(event){
      event.preventDefault();
      fetch('/oauth/token',
         {
            method: "POST",
            headers:{
                'Accept': 'application/json',
                'Content-Type': 'application/x-www-form-urlencoded',
            },

            body:`grant_type=password&username=${this.state.username}&password=${this.state.l_password}&client_id=4&client_secret=XXXXXXXXXXXXXXXXXXX&scope=*`

         }
      )
      .then(response =>
        response.json()
      )
      .then(responseJson => {
          const returnObj = responseJson;
          console.log(returnObj);
      })

Чтобы прочитать больше введите описание ссылкиздесь другие ресурсы введите описание ссылки здесь

Answer 2

Вы можете сохранить токен в localalstorage и создать некоторый механизм для проверки, вошел ли пользователь в систему.

вот статья, которая охватывает весь процесс https://medium.com/@romanchvalbo/how-i-set-up-react-and-node-with-json-web-token-for-authentication-259ec1a90352

Answer 3

Попробуйте это

const headers = { {Authorization: 'bearer '+ token,/*...*/} }
axios.get(endpoint, headers)