web-dev-qa-db-ja.com

React-Nativeアプリの認証ヘッダーでAxios GETを使用する

Authorizationヘッダーを必要とするAPIでGETリクエストにaxiosを使用しようとしています。

私の現在のコード:

const AuthStr = 'Bearer ' + USER_TOKEN;

ここで、USER_TOKENは必要なアクセストークンです。この文字列の連結は、これをAuthStr = 'Bearer 41839y750138-391'として投稿した場合の問題である可能性があります。次のGETリクエストは機能し、後のデータを返します。

axios.get(URL, { 'headers': { 'Authorization': AuthStr } })
  .then((response => {
    console.log(response.data);
  })
  .catch((error) => {
    console.log(error);
  });

また、これをグローバルヘッダーとして設定しようとしても成功しませんでした。

19
Ally Haire

この投稿に出くわし、それが役に立つと思うかもしれない他の誰かのために...私のコードに実際には何も悪いことはありません。パスワードアクセスコード(#facepalms)ではなくclient_credentialsタイプのアクセスコードを要求するというミスを犯しました。参考までに、私はurlencodedポストを使用しているので、クエリ文字列を使用しています。ですから、サンプルコードを探しているかもしれません。

これをデバッグするのを手伝ってくれた@swapnilに感謝します。

   const data = {
      grant_type: USER_GRANT_TYPE,
      client_id: CLIENT_ID,
      client_secret: CLIENT_SECRET,
      scope: SCOPE_INT,
      username: DEMO_EMAIL,
      password: DEMO_PASSWORD
    };



  axios.post(TOKEN_URL, Querystring.stringify(data))   
   .then(response => {
      console.log(response.data);
      USER_TOKEN = response.data.access_token;
      console.log('userresponse ' + response.data.access_token); 
    })   
   .catch((error) => {
      console.log('error ' + error);   
   });



const AuthStr = 'Bearer '.concat(USER_TOKEN); 
axios.get(URL, { headers: { Authorization: AuthStr } })
 .then(response => {
     // If request is good...
     console.log(response.data);
  })
 .catch((error) => {
     console.log('error ' + error);
  });
27
Ally Haire