Vue: заголовок авторизации JWT с Axios - PullRequest
0 голосов
/ 20 сентября 2019

Я создал интерфейсное приложение на vue.js и использую Phoenix в качестве внутреннего.Я пытаюсь сделать запрос и возвращает ошибку: GET http://localhost:4000/api/v1/my_user 401 (Unauthorized)

это лучше, чем проблема с CORS.

В своей части сценария я создаю свой заголовок для управления контролем доступа и прохождения авторизации.В конце я вызываю свой URL и передаю переменные.

getCurrentUser: function() {
  let axiosConfig = {
    headers: {
      "Content-Type": "application/json;charset=UTF-8",
      "Access-Control-Allow-Origin": "*",
      "Authorization": "Bearer " + localStorage.getItem("jwt")
    }
  };

  // call rest API
  axios
    .get("http://localhost:4000/api/v1/my_user", {}, axiosConfig)
    .then(res => {
      console.log("RESPONSE RECEIVED: ", res);
      //const jwt = res.data.jwt;
      //this.showComponent = false;
      console.log("res:" + res);
      //localStorage.setItem("jwt", jwt); // store the token in localstorage
    })
    .catch(err => {
      console.log("AXIOS ERROR: ", err);
    });
},

localStorage.getItem ("jwt") возвращает правильный токен.Моя проблема в том, что я не встречаюсь с ошибкой при использовании клиента почтальона, и когда я передаю в качестве значения авторизации те же значения, что и в заголовке / Авторизация

1 Ответ

0 голосов
/ 25 сентября 2019

Я заменил этот код на:

getCurrentUser: function() {
    axios.defaults.headers.common["Authorization"] =
                "Bearer " + localStorage.getItem("jwt");

   // call rest API
    axios
        .get("http://localhost:4000/api/v1/my_user")
        .then(res => {
         console.log("RESPONSE RECEIVED: ", res);
    })
    .catch(err => {
        console.log("AXIOS ERROR: ", err);
    });
},
...