Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

react native upload image as a file

I am having trouble uploading an image from my react native app. I have a react app that uploads images to the backend using <input> as a file.

The web app uploads to the backend like

File {name: "413_loveis_takingcareofu_wm.jpg", lastModified: 1503889026000, lastModifiedDate: Mon Aug 28 2017 10:57:06 GMT+0800 (HKT), webkitRelativePath: "", size: 34534, …}
lastModified
:
1503889026000
lastModifiedDate
:
Mon Aug 28 2017 10:57:06 GMT+0800 (HKT) {}
name
:
"413_loveis_takingcareofu_wm.jpg"
size
:
34534
type
:
"image/jpeg"

I am getting the image on the React Native mobile app using react-native-image-picker and I have the base64 and filepath.

How can I convert the filepath from

"file:///Users/kel/Library/Developer/CoreSimulator/Devices/7FAC36F6-803A-4268-9D65-28A9B8B65636/data/Containers/Data/Application/E34DD4A1-0207-4365-A428-614D39785781/Documents/images/798807FA-D41E-4109-B813-D21F22CC7F0D.jpg"

to what works on the web app?

like image 295
Kelvin Avatar asked Dec 18 '25 11:12

Kelvin


1 Answers

Please refer to :

https://snowball.digital/Blog/Uploading-Images-in-React-Native

https://github.com/kamilkp/react-native-file-transfer

var photo = {
    uri: uriFromCameraRoll,
    type: 'image/jpeg',
    name: 'photo.jpg',
};

or you can do,

var body = new FormData();
body.append('authToken', 'secret');
body.append('photo', photo);
body.append('title', 'A beautiful photo!');

xhr.open('POST', serverURL);
xhr.send(body);
like image 106
Mohhamad Hasham Avatar answered Dec 21 '25 02:12

Mohhamad Hasham



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!