multer，反應原生圖像選擇器圖像上傳不適用於 iOS

Question

我在通過 fetch 和 react-native-image-picker 上傳圖像到 multer 和 express js 后端時遇到了很大的麻煩。

下面是我的反應本機代碼。

try {

 const data = new FormData();

  data.append('image', {
    name: photo.fileName,
    type: photo.type,
    uri:
      Platform.OS === 'android' ? photo.uri : photo.uri.replace('file://', ''),
  });

 data.append('id', id)

    fetch(`${API}save-image`, {
      method: 'POST',

      body: data,
    })
      .then(response => response.json())
      .then(response => {
        console.log('upload succes', response);
      })
      .catch(error => {
        console.log('upload error', error);
      });
  } catch (error) {
    console.log(error);
    if (error.response !== undefined) {
      message = error.response.data.message;
    } else {
      message = error;
    }

    return Promise.reject(message);
  }

image變量是我們從 react-native-image-picker 庫獲得的響應對象，該庫包含圖像數據和 uri 以及其他需要的項目。

在后端，我試圖登錄由 multer 配置的 req.files 對象。

const Storage = multer.diskStorage({
    destination(req, file, callback) {
        callback(null, path.join(__dirname, '../uploads/'));
    },
    filename(req, file, callback) {
        callback(null, new Date().toISOString() + '_' + file.originalname);
    },
});

const upload = multer({
    storage: Storage,
    limits: { fieldSize: 25 * 1024 * 1024 },
});
router.post(
    '/save-image',
    upload.array('image', 3),
    controller.saveImage
);

在控制器中，我將只使用console.log(req.files)然后返回成功消息。

我可以在 android 模擬器的情況下看到控制台日志，但在 iOS 模擬器上看不到。

事實上，圖像似乎沒有被發送到后端。 但是后端沒有錯誤，並且在iOS的情況下不會記錄。

這真的很令人沮喪

有人可以幫忙嗎？

Answer 1

react-native 和flipper 版本低於0.39 ，導致文件上傳的網絡請求失敗，請嘗試手動更新您的flipper 版本。 在你的podfile ：

versions['Flipper'] ||= '~> 0.51.0'