Firebase Storage - Get actual data instead of downloadURL

Question

Is there any way to get the actual data instead of downladURL from firebase storage ? In my case, i store string(some amount of html) to the storage and i want to get the actual data when its needed.

But i can't figure out how to do it. According to firebase documentation i can get the download able url but can't fetch the actual data.

Here is the function to fetch data from the storage(In the test case i can get the url properly, but i need the actual data)

// Create a reference to the file we want to download
var starsRef = storageRef.child('images/stars.jpg');

// Get the download URL
starsRef.getDownloadURL().then(function(url) {
  // Insert url into an <img> tag to "download"
})

Thanks

Update 17.02.2020

I solve my problem, my mistake! Its possible to download file from storage using ajax request which is mentioned in the docs. Here is the simple function i define which return a promise and after resolving you can get the actual file/data.

async updateToStorage(pathArray, dataToUpload) {

    let address = pathArray.join("/");

    // Create a storage ref
    let storageRef = firebase.storage().ref(address);

    // Upload file as string format, known as firebase task
    let uploadPromise = await storageRef.putString(dataToUpload);

    let url = await uploadPromise.ref.getDownloadURL();

    const res = await fetch(url);

    const content = await res.text();

    return content;
}

const avatar = await updateToStorage(['storage', 'uid', 'avatarUrl'], avatar.png);
//avatar will be the actual image after download.

Answer 1

The Cloud Storage for Firebase APIs for JavaScript running in web browsers actually don't provide a way to download the raw data of a file. This is different on Android and iOS. Notice that StorageReference doesn't have any direct accessors for data, unlike the Android and iOS equivalents. I don't know why this is. Consider it a feature request that you can file with Firebase support .

You will probably need to set up some sort of API endpoint that your code can call, routed through the web server that serves your web site, or through something else that supports CORS so that you can make an request from the browser that crosses web domains without security issues.