React Native Fetch() with FormData() HTTP TypeError: 网络请求失败答案

【问题标题】：React Native Fetch() with FormData() HTTP TypeError: Network request failedReact Native Fetch() with FormData() HTTP TypeError: 网络请求失败
【发布时间】：2017-06-05 21:20:55
【问题描述】：

在 Android 上粘贴图片后，我正在使用 FormData() 和 Fetch() 将图片文件发布到我的服务器。

我使用公共 IP 不发布到我的本地主机或任何东西，也不使用 HTTPS，也使用 Genymotion 模拟器。

我的代码：

      var fd = new FormData();
      fd.append('image', {path:'file:///'}); 

      fetch(UPLOAD_URI,{
        method: 'POST',
        headers: {
          'Content-Type': 'multipart/form-data',
        },
        body: fd
        }).then(response => {
          console.log("image uploaded")
        }).catch(err => {
          console.log(err)
        })

错误返回在作为参数错误的捕获中：

TypeError: Network request failed
    at XMLHttpRequest.xhr.onerror (fetch.js:441)
    at XMLHttpRequest.dispatchEvent (event-target.js:172)
    at XMLHttpRequest.setReadyState (XMLHttpRequest.js:542)
    at XMLHttpRequest.__didCompleteResponse (XMLHttpRequest.js:378)
    at XMLHttpRequest.js:482
    at RCTDeviceEventEmitter.emit (EventEmitter.js:181)
    at MessageQueue.__callFunction (MessageQueue.js:236)
    at MessageQueue.js:108
    at guard (MessageQueue.js:46)
    at MessageQueue.callFunctionReturnFlushedQueue (MessageQueue.js:107)

是否缺少某种权限，有什么问题？

干杯，

【问题讨论】：

React Native Post Request via Fetch throws Network Request Failed的可能重复
那个是用 HTTPS 的，而不是用 HTTPS
你的 uri 是 https？

标签： reactjs react-native

【解决方案1】：

对于我在 android 上的情况，以下模块帮助我解决了这个问题，因为它使用 java 将我的文件发送到服务器并在 PHP 中使用 $_FILES 获取：

npm install react-native-file-transfer-android

我的代码：

var FileTransfer = require('react-native-file-transfer-android');

const UPLOAD_URI = "http://< IP / Domain>/index.php"


  makeUuid()
  {
      var text = "";
      var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";

      for( var i=0; i < 5; i++ )
          text += possible.charAt(Math.floor(Math.random() * possible.length));

      return text;
  }

  sendImageToServer(data){

        var uuid = this.makeUuid();
        FileTransfer.upload({
          uri: data,
          uploadUrl: UPLOAD_URI,
          fileName: 'temp.jpg',
          mimeType: 'image/jpg',
          headers: {
            'Accept': 'application/json'
          },
          data: {
            name:uuid
          }
            }, (err, res) => {
              if(err) {
                console.error(err);
              } else {
                console.log(res);
              }
          });
   }

  saveImage(imgDate){

    let states = {camera:false};
    states[this.state.ActiveImage] = imgDate.path;
    this.sendImageToServer(imgDate.path);
    this.setState({
      ...states
    });




  }

干杯。

【讨论】：