如何将用户从 ImagePicker.launchCameraAsync() 拍摄的图像 append 发送到 FormData

Question

I am trying to append the photo taken by the user from ImagePicker.launchCameraAsync()

I need to send the file itself not a base64 version of it and I am using expo with react native so react-native-fs doesn't work with me

I can get the path of the taken photo and the some other properties of it but not the image itself

A snippet of the code I am using to get the image is:

let permission = await ImagePicker.requestCameraPermissionsAsync();
    if (permission.granted === false) {
      alert("Camera access is required for single upload");
      return;
    }
    const takenImage = await ImagePicker.launchCameraAsync();
    if (takenImage.cancelled === true) {
      alert("No images were taken");
      return;
    }

    let data = new FormData();

And the request is

await axios
      .post("A link here", data, {
        withCredentials: true,
        headers: {
          "Content-Type": "multipart/form-data",
        },
      })
      .then((res) => {
        console.log(res.data);
      })
      .catch((err) => console.log(err.response));

So any ideas how can i do this trick?

Answer 1

you can use this code to append image to form data

let formdata = new FormData();
formdata.append('Name of the key from backend', {
    uri: 'file path of image',
    type: 'image type e.g jpeg/png etc',
    name: 'image name',
    });

After that send request like this

let axiosConfig = {headers:{}}
axios.post(URL, formdata, axiosConfig)