Objective: 要成功将BASE64图像数据传递到我的node / express后端，以便我可以将其上传到Microsoft Azure存储 .

Issue: 发送图像数据时未点击 endpoints ，catch块表示图像未上传，并且未记录console.log . 当我只发送文件扩展名时， endpoints 被成功命中（控制台记录用户obj） . 据我所知，我需要将图像BASE64数据上传到Azure以在整个应用程序中使用 .

Stack:

  • React-Native（^ 0.54.0）

  • 节点/快递

  • Microsoft Azure存储

  • Postgres（sequelize ": " ^ 4.33.2）

我使用 'react-native-image-picker' 来访问用户相机，返回的照片对象如下所示：

Object {isVertical: false, origURL: "assets-library://asset/asset.JPG?id=ED7AC36B-A150-4C38-BB8C-B6D696F4F2ED&ext=JPG", longitude: -19.5112, data: "/9j/4AAQSkZJRgABAQAASABIAAD/4QBYRXhpZgAATU0AKgAAAA…paLbTp1up3fnf8jjajOztyvlV0ldN23+NWvpoklpsr2P/2Q==", fileName: "IMG_0005.JPG"…}
  data:(...)
  fileName:(...)
  fileSize:(...)
  height:(...)
  isVertical:(...)
  latitude:(...)
  longitude:(...)
  origURL:(...)
  timestamp:(...)
  uri:(...)
  width:(...)

数据字段包含我认为需要传递给后端的BASE64图像数据，以便将其上传到我的Azure存储 . 下面是应该将适当的数据发送到后端的客户端函数 .

export function uploadUserPhoto(photoData, photoExt, id) {
  return dispatch => {
    dispatch(authProgress());
      axios.patch(`${API_URL}/users/upload_profile_photo/${id}`, {
        headers: {
            'Accept': 'image/jpeg',
            'Content-Type': 'image/jpeg'
        },
          user: {
              imageData: photoData,
              imageFileName: photoExt
          }
      })
      .then(response => {
          dispatch({type: USER_PHOTO_UPLOAD, payload: response.data});
          Actions.Profile()
          Alert.alert("Upload success!");
      })
      .catch(error => {
        dispatch({ type: USER_PHOTO_UPLOAD_FAILED, payload: error });
        Alert.alert("Upload failed! Please try again!");
      });
  };
}

我可以确认photoData，photoExt已成功传递到具有图像数据和文件名的函数中 . 节点端如下所示：

router.patch('/upload_profile_photo/:id', async(req, res) => {
console.log(req.body.user)
const paths = await profilePicUpload(req.body.user, req.params.id );
    await models.User.update({image: paths },                     
    { where : {id: req.params.id} });
    const userInfo = await models.User.findById(req.params.id);
    try {
        res.send(userInfo)
    }
    catch(err) {
        console.log(err)
    }
});

有什么建议？我看过使用 new FormData() 但没有运气 . 阅读其他帖子，有些表明 Headers 问题，但我不知道这是怎么回事 .

谢谢 .

javascript node.js image azure express