javascript - 在 React Native 中将照片上传到 Node 服务器

Question

尝试使用名为“react-native-fetch-blob”的 React 库上传本地资源(简单的 jpeg 文件)。我的服务器正在记录请求，但是无论我尝试什么，req.body 要么是空的，要么是未定义的。

我尝试将文件作为“base64”编码字符串上传，但仍然失败。

我也知道我的 uri 是有效的。

前端代码:

 RNFetchBlob.fetch('POST', 'http://localhost:3000/api/analyze', {
      'Content-Type': 'multipart/form-data'
    }, RNFetchBlob.wrap(this.state.imgSource.uri))
    .then( res => {
      console.log('success:', res);
    })
    .catch( err => {
      console.log('error:', err);
    })

我在后端使用express以及express-formidable包来解析多部分/表单数据。

任何帮助将不胜感激!我还花了很多时间在我正在使用的每个软件包的问题跟踪器上，似乎找不到问题所在。

Answer 1

尝试使用 native fetch API和FormData对象。类似这样的事情:

  const postImage = (imagePath) => {
    const photo = {
      uri: imagePath,
      name: 'image.jpg',
      type: 'image/jpeg',
    };
    const data = new FormData();
    data.append('file', photo);
    const config = {
      method: 'POST',
      body: data,
      headers: {
        'Content-Type': 'multipart/form-data',
      },
    };
    return fetch("https://your.endpoint/img", config);
  }

  postImage(pathToYourFile)
    .then(resp => resp.json())
    .then(json => console.log(json))
    .catch(err => console.log(err))

这样 React Native 就知道如何将给定路径转换为多部分请求。