uploadImageAsync expo example with authentication

[marktinman]

Please provide the following:

1. SDK Version: 35.0.0
2. Platforms(Android/iOS):

I found the example on github on how to upload images to Firebase, this has been referenced in a few posts here;

GitHub - expo/firebase-storage-upload-example: This example has moved

I took the relevant code and try to incorporate that in my “study-app”. Everything works fine when I set the authentication to Firebase to everyone read and write. However the default was only authenticated users could write.

How can I make sure that the person that is trying to upload the image is authenticated?

I have the token and Firebase userid stored in redux so I can get to this information.

The firebase configuration has been set in a separate file and is exported as firebase with the apiKey, authDomain, databaseURL and storageBucket set.

How and where can I send the token with this upload?

[marktinman]

The relevant code that I have used is;

async function uploadImageAsync(selectedImage) {
// Why are we using XMLHttpRequest? See:
// TypeError: Network request failed when fetching a file:// uri · Issue #2402 · expo/expo · GitHub
const blob = await new Promise((resolve, reject) => {
const xhr = new XMLHttpRequest();
xhr.onload = function () {
resolve(xhr.response);
};
xhr.onerror = function (e) {
console.log(e);
reject(new TypeError(‘Network request failed’));
};
xhr.responseType = ‘blob’;
xhr.open(‘GET’, selectedImage, true);
xhr.send(null);
});

    const ref = firebase
        .storage()
        .ref()
        .child(uuid.v4());
    const snapshot = await ref.put(blob);

    // We're done with the blob, close and release it
    blob.close();

    const imageLink = await snapshot.ref.getDownloadURL();
    setDownloadURL(imageLink)
}