在 React Native 中上传多个图像时出错

Question

const availabilityData = new FormData();

  availabilityData.append('name', title);
  availabilityData.append('foodType', foodType);
  availabilityData.append('availability_type', category);
  availabilityData.append('description', description);
  availabilityData.append('total_quantity', quantity);
  availabilityData.append('cooked_time', madeOn);
  availabilityData.append('best_before', bestBefore);
  availabilityData.append('storage_description', storageDesc);
  availabilityData.append('latitude', fromLocation.latitude);
  availabilityData.append('longitude', fromLocation.longitude);
  availabilityData.append('city', selectedCity);
  availabilityData.append('creator_delivery_option', deliveryOption);

  for (let i = 0; i < imageLoc.length; i++) {
    const newFile = {
      uri: imageLoc[i],
      type: 'image/jpg',
      name: new Date(),
    };
    availabilityData.append('files[]', newFile);
  }

  await axios({
    url: constants.BASE_URL + 'availability/createAvailability',
    method: 'post',
    data: availabilityData,
    headers: {
      Authorization: `UserData ${token}`,
      Accept: 'application/json',
      'Content-Type': 'multipart/form-data',
    },

  })
    .then(function (response) {
      Alert.alert('Availability Created Successfully');
      navigation.popToTop();
      removeAllInputs();
      setLoading(false);
    })
    .catch(function (error) {
      console.log(error);
      setLoading(false);
    });
}

imageLoc 是我存储所选图像位置的状态。

当我打印 imageLoc 时输出： ["content://com.android.externalstorage.documents/document/primary%3ADCIM%2FCamera%2FWe4Us%2FWe4Us-151358739.jpg", "content://com.android.externalstorage.documents/document/primary%3ADCIM% 2FCamera%2FWe4Us%2FWe4Us-151913720.jpg”、“content://com.android.externalstorage.documents/document/primary%3ADCIM%2FCamera%2FWe4Us%2FWe4Us-15253326.jpg”、“content://com.android. externalstorage.documents/document/primary%3ADCIM%2FCamera%2FWe4Us%2FWe4Us-152139570.jpg", "content://com.android.externalstorage.documents/document/primary%3ADCIM%2FCamera%2FWe4Us%2FWe4Us-1524187.jpg" ]

Error I got in the backend

Answer 1

您的文件数组中有 Content-Provider 路径。内容提供者在 Android 中不是有效的 url，可能 Axios 还没有准备好处理它们。在这种情况下，您可以使用 react-native-fs 将文件复制到其他位置：

RNFS.copyFile(uri, targetPath)

然后将targetPath提供给axios。确保在发送图像后删除副本。