Question

我在react中编写代码以将JSON数据和文件发送到Backend Server，看起来不错，但是当我在React Native中发送相同的数据时，会出现多部分表单数据的情况。

这是我在React Side上尝试过的代码，它可以正常工作：

  const incident = {
    'incidentDateTime': '05-Apr-2019 12:39',
    'description': 'desc',
    'actionTaken': 'Action Taken',
    'additionalInformation': '',
    'incidentTypeId': 1,
    'communityId': 1,
    'reporterId': 2,
    'reporterName': 'test user'
  }

  formData.append('incident', new Blob([JSON.stringify(incident)], {
      type: 'application/json'
    })
  )


  const instance = axios.create({
    baseURL: 'http://18.XXX.XX.XXX:80XX/api/',
    headers: { 'x-authorization': 'Bearer XXXXXXXX' }
  })

  instance.post('incidents', formData)

它工作正常，但是如果我在React Native.Server中以相同的模式发送数据，则Server将给出没有多部分表单数据的异常。我尝试使用react-native-fetch-blob软件包。以下是通过react-native-fetch-blob

编写的代码

  import RNFetchBlob from 'react-native-fetch-blob'


  const BlobRN = RNFetchBlob.polyfill.Blob
  const formData = new FormData()

    const incident = {
      // 'id': 0,
      'incidentDateTime': '05-Apr-2019 12:39',
      'description': 'desc',
      'actionTaken': 'Action Taken',
      'additionalInformation': '',
      'incidentTypeId': 1,
      'communityId': 1,
      'reporterId': 2,
      'reporterName': 'test user'
    }


    const blobAttrs = { type: 'application/json' }
    const blobPromise = BlobRN.build(incident, blobAttrs)

    blobPromise.then(blobInstance => {

      formData.append('incident', {
        uri: fileInstance._ref,
        type: fileInstance.type,
        name: fileInstance.name
      })

      const instance = axios.create({
        baseURL: 'http://18.XXX.XX.XX:80XX/api/',
        headers: { 'x-authorization': 'Bearer XXXX' }
      })

      instance.post('incidents', formData)
    })

Here is the snapshot of request when tried through react-native-fetch-blob

Blob在React Native中无法正常工作

0 个答案: