React Native: Upload Picture from local path to Firebase storage - android

I'd simply like to upload an image from a local path on my mobile device to Firebase Storage. I get this image using a module called ImagePicker and it provides me with a path that is formatted like this:
"file:///storage/emulated/0/Android/data/com.explr/files/Pictures/image-468dccf5-35a0-42cc-9910-1f8ba83c9bf8.jpg"
I've read on a post that this wasn't possible due to differences between react for the web and react for mobile, but that post was from 2016.
So did anything change? Is it possible now?
Thanks for helping!

Related

How to convert blob to base64 on React Native

I'm developing an application that runs both web and mobile app (React Native).
In the mobile app, I have to fetch a file from S3 Bucket and convert it to base64 in order to show and write it to mobile storage.
When fetching a file that has a small size, I just fetch a file from S3 without responseType.
But when I fetch a large file, I don't get any data from API and the mobile app is stunned (it keeps loading and I cannot get any response from API). So I have to pass responseType: 'blob' to get data from API.
My question is: How to convert or read Blob to base64 while React Native cannot use FileReader like a web application?
Thanks in advance!
Oh I try using FileReader to read Blob and it work! I thought FileReader is not working in React Native

Save image from html to phone photo directory

I have the below tag in my website for downloading image
<a href="data:image/png;base64,%20iVBOdfd...." download="myimage.png" />
The above tag is working normally, when it is pressed, it will download the image without any issue.
When I tried this function on ios / android, the web browser will download the image to some "Download" folder instead of writing it to camera roll (IOS) / DCIM (android).
My question is, is it possible to write to camera roll or DCIM? If it is possible, how can I achieve it? This function is crucial to my application as my users always find it hard to navigate on phone to retrieve the downloaded images at later time.
P.S: My concern is more about the writing destination, filesystem access on phone, not the download itself.
P.S: this is a normal website written using html, vuejs. not native, not react native, not vue-native.
Thank you.
That is not possible since it is the web browser who has access to the device and your web application cannot decide where to save the image. You'll need to implement an app to achieve the expected result. Also study Progressive Web Apps to see whether it's possible

Download generated Blob with Ionic 3 into Android Device

I have encounter this issue recently while using Ionic3 to develop app on Android phone. I have cols and rows of data which I extracted into a 2D array. After which, I create a csv blob from the 2D array using papaparse.
let csv = papa.unparse({
fields: this.headerRow,
data: this.csvData
});
var blob = new Blob([csv]);
var a = window.document.createElement("a");
a.href = window.URL.createObjectURL(blob);
a.download = "confidentialData.csv";
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
The code above works only for browser download, when I load it into my android phone, it does not download at all. I have read many other posts on how Ionic app download file into the device using FileTransfer and File. But I cant seem to work around with these because FileTransfer.download requires a url source in order to download the file into the device.
But for my case, the file is not hosted anywhere and the blob is generated dynamically from my code. Would appreciate any help or recommendation on how I can download my csv blob into my android device using Ionic 3. Thank you very much.
You are getting it wrong. FileTransfer works as an upload or download from an url (For example uploading a picture to a server from your device or downloading a picture from the server to your device).
What you want to look at is Cordova File and use the functions createFile and writeFile to save the data on the device.
EDIT: To save your file on the Documents or Downloads folder you will need to use cordova.file.externalRootDirectory + '/Download/' for it to work, also take in mind that a lot of folders are just read only (dataDirectory on iOS for example)
Hope this works.

How to clear temporary data (storage) inside of a cordova project?

I am using cordova 3.5 and eclipse to develop a mobile application. Inside of an image stream I am downloading 30 images through jquery append (url). The storage information are displayed in the following figure.
Anyone knows how to clear the "DATA" (19.41MB) category programmatically?
I have the same issue with IOS, when I try to follow apples data storage guidelines...
best
M

Android web application on cloud storage

I have a cloud storage website and I want to create an Android application for that website.
I tried 2 methods.
First Method
Using Phonegap to open a remote website which handles everything and its built-in PHP so everything works fine. But a Cloud Storage app must allow uploading and downloading. In Phonegap I can upload through the website but can't download directly to local storage. It can only be done locally if my website is in the local www folder. Also in this way API of Phonegap can't be used either. If I download any file the browser opens up, in this case.
Second Method:
I tried to use Phonegap locally and just create an API of my cloud storage website so that locally with the help of jQuery ,Ajax so that I can post data to the remote URL, but that can't be done due to the Same Origin policy. I may receive the JSON data of files and show but can't log the user in and other features. :( Again a problem.
What else can I do? Is there any other method or solution you can provide me regarding these two methods or any alternative method I can use?
Depending on the kinds of data you're talking about there are several alternatives.
You're describing a cloud storage app (I'm assuming like drop box or Google drive right).
Therefore you'll want to write to the file system instead of some kind of database (locally ofc)
I would therefore check out the following api docs;
http://docs.phonegap.com/en/2.1.0/cordova_file_file.md.html#File
Examples are there too.
PS ive had same origin problems in development, but they seem to go away in production, try testing there too.

Categories

Resources