Erreur 401 (non autorisée) Lorsque vous effectuez des appels REST en utilisant Axios avec en-têtes JWT inclus

Question

Je suis en train de développer une petite application de nœud de réaction avec passeport JWT pour l'authentification. J'ai testé tout le point de terminaison à travers le facteur (en passant le jeton avec l'en-tête d'autorisation) et ils fonctionnent correctement.

C'est l'im appel fait à partir de l'extrémité avant

export const getUsersDetails=()=>{ 
    console.log(localStorage.getItem('jwtToken')); 
    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)); 
      }); 
     }; 
} 

j'activer CORS en utilisant le module CORS. c'est la façon dont les appels du réseau ressemble à partir du navigateur

l'en-tête d'autorisation ressemble
authorization:[object Object], eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.....

Si cela est comme authorization: eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9..... Est-ce la raison pour laquelle im faire face à ce problème? Comment surmonter cela?

Answer 1

Lorsque vous voulez une autorisation dans votre application, cela dépend de la manière dont vous avez effectué votre back-end. Si tout va bien à travers le facteur, montrez à quoi ressemblent vos entêtes chez le facteur quand vous avez goûté. J'utilise XSRF jeton et est ici comment ma demande regard d'en-tête:

{headers: 
      {"Access-Control-Allow-Headers" : "*", 
      "X-XSRF-TOKEN": this.$cookie.get('XSRF-TOKEN')} 
    } 

Peut-être que vous devriez simplement mettre "Access-Control-Allow-Headers" : "*"