「React-Nativeシリーズ」31、FetchがPOST要求を送信するピットとソリューション


httpインタフェースをリクエストするときは、getとpostの方法を使用します.フォームに対してこのようなリクエストをコミットするには、postの方法を使用します.
では、RNのFetch APIでpostが提出するピットは何ですか?やめましょう.
まず、サーバ側のコードについて説明します.通常、Requestからパラメータを取得する方法は次のとおりです.
String paraValue = request.getParameter(paraName);
パラメータを取得できるかどうかは、この方法で取得します.
RNでは、通常どのようにコードを書きますか?
シナリオ1(推奨しない):
    let url = "http://127.0.0.1:8080/api/testFetch”
    let params = "name=admin&password=admin123”;
    fetch(url , {
      method: 'POST',
      headers: {},
      body: params,
    }).then((response) => {
      if (response.ok) {
          return response.json();
      }
    }).then((json) => {
      alert(JSON.stringify(json));
    }).catch((error) => {
      console.error(error);
    });
このとき,サーバ側ではnameとpasswordの値を取得できないことが分かった.
GETに変えてみて、paramsをurlに追加したらOK.これはどんな状況ですか?以下説明します.
はい、だめです.もう一つの方法を変えてみましょう.
シナリオ2(推奨しない):
    let params = {"name":"admin","password":"admin123"};
    
    fetch(url , {
      method: 'POST',
      headers: {},
      body:JSON.stringify(params),
    }).then((response) => {
      if (response.ok) {
          return response.json();
      }
    }).then((json) => {
      alert(JSON.stringify(json));
    }).catch((error) => {
      console.error(error);
    });
paramsを直接JSONオブジェクトにカプセル化し、bodyでJSONオブジェクトを文字列に変換して渡したところ、然並卵したが、Server端では値が得られなかったことが分かった.
はい、私たちは回り道をしないで、直接原因を説明します.
実際、シナリオ1とシナリオ2はbodyに直接文字列を渡し、サーバ側でbodyを取得する方法は以下の通りです.
StringBuilder buffer = new StringBuilder();
BufferedReader reader = beat.getRequest().getReader();
String line;
 while ((line = reader.readLine()) != null) {
	buffer.append(line);
 }
String body = buffer.toString();
この方法により、入力された文字列を取得することができる.
文字列を取得できる以上、私たちが入力した値を取得することもできます.JSONを回したり、&カット文字列を押したりすることができますが、この解決策は少し挫折しているようですね!!!
jqueryで、私たちは案通りにやったのかと聞かれるかもしれませんが、どうすればいいですか.
答え:パラメータ「name=admin&password=admin 123」はjqueryでは、入力オブジェクトフレームワークがformDataの形式に自動的にカプセル化されるため、fetchにはこの機能はありません.
究極のシナリオ(推奨):
fetchがFormDataを自動的に回転しない以上、私たちは自分でFormDataをnewしてbodyに直接伝えます.
FormDataでは、バイトストリームを転送して画像をアップロードする機能も実現できます.参考:http://blog.csdn.net/codetomylaw/article/details/52446786
     let formData = new FormData();
     formData.append("name","admin");
     formData.append("password","admin123");
    
    fetch(url , {
      method: 'POST',
      headers: {},
      body: formData,
    }).then((response) => {
      if (response.ok) {
          return response.json();
      }
    }).then((json) => {
      alert(JSON.stringify(json));
    }).catch((error) => {
      console.error(error);
    });
では、サーバ側でnameとpasswordの値を取得できます.