Uploading file in react native Android - reactjs

I'm making my android app with react native.
I want to make an upload(file, image) to my api server.
I searched in google, but I have some question.
The upload Flow what I thought is like below.
1. GET ACCESS TO LOCAL STORAGE
2. IF PERMISSION GRANTED, CLICK BUTTON AND MAKE POPUP
3. SELECT THE FILE/IMAGE AND GET URI
4. UPLOAD FILE WITH AXIOS
Am I thinking wrong? Is there a library to make it easier? Thank you

you can use react-native-image-crop-picker . it will ask for permission and you can take picture from camera or select image from gallery
if you want file other than image you can use react-native-document-picker
then upload file using axios

Related

Is it a way to imitate iOS native custom url call from a React app?

Facebook has this Sharing to Stories functionality fro native iOS and Android. I am not sure possible or not but I would to do the same, open Instagram, and profile with custom content.
Seems open Instagram works, but profile data not. Do you know why?
Image is copied programmatically, put on pasteboard, and url loads this instagram-stories://share?source_application=2773133082797983 but till content, the mp4 is not loaded. What do I miss? Is it even doable from a React app??

React file upload without using node - possible?

Is it possible to have a file upload work in React only without Node? I say this because every single article I read, node is involved. All I want to do is for a user to be able to upload a picture to my react app (filling in a simple form), and when they submit that form, a new post is created along with the picture they uploaded. I don't need the post to persist, this is frontend only. Is it possible to do this without node?
You can make this to work but you will need AWS or other Image upload services like Cloudinary.
You can create an account with AWS, create a bucket and use their SDK to push the image to them and they will return a URL.
Checkout this article though: https://javascript.plainenglish.io/how-to-upload-files-to-aws-s3-in-react-591e533d615e

display and save a local image into database in react js

I'am developing a blog website using react.js where users can post and comment ...
so we know that a user can comment with an image ,and let's say he want to upload a local image that stored in his machine,i want to display that image as a comment and save it into postgres database which i'am using for that.
My question is what are the steps that i should follow to achieve my purpose,thanks in advance.
If you have to do in simple steps, you can save the image to base64, its just string representation of an image. So it can be saved in DB directly and when you have to show it just decode the string and display it accordingly.
References :-
https://github.com/dankogai/js-base64#readme
https://scotch.io/tutorials/how-to-encode-and-decode-strings-with-base64-in-javascript
Alternatively, what you can do when user selects an image, then upload that image to your server and get the path to that(multipart file upload) and from path you can show it where you want to show.
References :-
how to send a multipart/form-data from React.js with an image?
I hope it helps, Thanks :)

How to load local image choosen by user in React 360

Im using React-360 to display a 360 photo. It works fine when we give remote url as src in Environment.setBackgroundImage(src, {format: format});
But i have a requirement to allow user to select a local 360 photo file and preview it.
Using Input tag and javascript i'm getting the file choose by user; but i'm not able to pass that file as src.
i tried this too.. didn't work.
src = URL.createObjectURL(file);
Environment.setBackgroundImage(src, {format: format});
Is it not possible to load local file in react 360.
Same Problem in google vr view also. Anything i can do to load local file choose by user.
have you tried using the asset method like so?
Environment.setBackgroundImage(asset('your_image.jpg'));
I think this could be what you are looking for.

How to store images in firebase using URL from cloud storage service?

Hi I am developing an ionic app using firebase as my database.
I read this question.
I understand it and have a more specific question.
I uploaded an image on amazon s3, imgur and filestack, and tried all three in firebase using data:url/<the url of image> and data:image/jpeg;<url of image>.
Am I typing something wrong into firebase?
The image does not come up. I do not want to write code in the app to upload the image etc, I just simply want an image to display on the app beside some data corresponding to an item in my firebase database.
I have read about base64, do I have to use it in this case?
(Optional) Perhaps If you could expand on the steps of doing this:
"You can use a filepicker to get the image file. Then you can host the image however you want, i prefer amazon s3. Once the image is hosted you can display the image using the url generated for the image."
I don't have much ionic experience, but why not just save the direct path to the image url and not include the data:url/ portion.
Simply store the url in firebase and then when it's retrieved inject it into your img src.

Resources