反応的な - ベアラートークンの認証 - httpReqest

Question

私はネイティブに反応する新しいです。だから私はいくつかの助けが必要です。

私は反応ネイティブでアンドロイドのアプリを書いています。

私はすでにログイン画面と、ログインプロセスが正常に完了したときに表示されるべきすべての画面を実装していました。

ローカルホストのウェブサイトにベアラ認証を使用してhttpリクエストを行うことがわかりません。要求方法はGETです。私のアプリでは、ユーザー名とパスワードを入力してhttps：/ localhost /.../ログインに送信する必要があります。

これまでのところ、ログイン画面のTextInputからユーザーとパスワードを取得し、両方の機能をhttpRequestという名前の関数に送信しました。

function httpRequest(name, password) { 
var httpResponse = null; 

// not implemented yet 

} 

私が起動する方法を知っている...私は私が反応し、ネイティブのドキュメントで見つけることができますフェッチ-入手mehtodで始まる必要がわからないのですか？しかし、私はベアラトークン（auth）でそれをどうすればよいですか？

Answer 1

これは、認証を扱う際に新参者が直面する共通の問題です。

は、私はあなたがこの良いあなたはそれを実装するために高度な知識のビットを必要としていますが、とにかく、それを学ぶことができます

https://auth0.com/blog/adding-authentication-to-react-native-using-jwt/を読む与えることをお勧めします。

Answer 2

POSTリクエストではなく、ユーザ名とパスワードをGETで送信する必要があります。したがって、要求の本文に名前とパスワードのデータを添付することができます。また、ご希望の場合はfetchをご利用ください。

あなたはこのようにそれを行うことができます。

function httpRequest(name, password) { 

    const user = { 
    name, 
    password, 
    }; 

    fetch('https://mywebsite.com/endpoint/', { 
    method: 'post', 
    headers: { 
     'Accept': 'application/json', 
     'Content-Type': 'application/json', 
    }, 
    body: JSON.stringify(user) 
    }) 
    .then(res => res.json()) 
    .then(data => { 
     console.log(data); 
     // data should contain a JWT token from your backend 
     // which you can save in localStorage or a cookie 
    }) 
    .catch(err => console.log(err)); 

} 

も簡単にヘッダを生成するためのフェッチヘルパー関数については、この質問に私の答えをチェックしてください。あなたの要求にJWTトークンを簡単に追加するための部分が含まれています。

How to post a json array in react native