RN 一次fetch请求问题解决

fetch网络请求

1. 问题：服务端返回没有对应的参数
2. 搜索：《React-Native系列》31、 Fetch发送POST请求的坑与解决方案
3. 处理：按照上面使用FormData，失败

  static login(username,password,successCallback,failCallback){
      let params = new FormData();
      params.append("loginNo",username);
      params.append("password",md5(password));
      HttpUtils.post("http://.../login",params,successCallback,failCallback);
  }

4. 处理：使用postman测试，运行正常，但是设置了Content-Type=application/json
5. 处理：header设置content-type，新问题
6. 问题：multipart != application/json
7. 搜索：https://stackoverflow.com/questions/39351026/multipart-application-json-fetch-post-error-on-android-react-native
8. 处理：修改'Content-Type': 'multipart/form-data'，问题
9. 问题：服务端返回没有对应的参数（同问题1）
10. 处理：在回去用postman测试，发现使用form-data不行，用raw可行

image.png

11.处理：不适用FormData，改为JSON来传递参数， 成功，最终代码如下

  static login(username,password,successCallback,failCallback){
      let params = {
          "loginNo":username,
          "password":md5(password)
      };
      HttpUtils.post("http://.../login",params,successCallback,failCallback);
  }

  static post(url,params,successCallback,failCallback){
    fetch(url,{
      method:'POST',
      headers: {
        'Content-Type': 'application/json',
      },
      body:JSON.stringify(params)
    })
      .then((response)=>response.json())
      .then((responseData)=>{
        successCallback(responseData);
      })
      .catch(function(err){
        failCallback(err)
      });
  }