Passer JWT dans les en-têtes avec axios

Question

J'ai créé un petit projet avec un nœud principal et je réagis pour récupérer les données via la bibliothèque REST que j'ai utilisée Axios. Mais quand je passe les en-têtes avec elle, je reçois toujours une erreur disant Failed to load resource: the server responded with a status of 401 (Unauthorized). J'ai découvert deux méthodes et les deux n'ont pas fonctionné.

Elles sont

export const getUsersDetails=()=>{
  console.log('calling');
  return (dispatch) => {
    return axios.get('http://localhost:3030/users',{headers: { "Authorization": localStorage.getItem('jwtToken') }}).then((data)=>{
                 console.log('data comming',data);
                dispatch(getUsersData(data));
            }).catch((error)=>{
              console.log('error comming',error);
                dispatch(errorgetUsersData(error));
            });
        };
}

et

axios.defaults.headers.common['Authorization'] = localStorage.getItem('jwtToken');

Mais quand j'utilise postman j'obtiens les données requises du backend. Une raison particulière pour laquelle je continue à recevoir cette erreur non autorisée?.

Answer 1

Vous devez concaténer 'Bearer' avant le jeton, comme ceci:

axios.defaults.headers.common['Authorization'] = 
                                'Bearer ' + localStorage.getItem('jwtToken');