guest176969 guest176969 - 1 month ago 19
Javascript Question

Javascript return variable from function and pass as parameter

I got this function to insert image into firebase. What I am trying to do is select image, insert the image to firebase storage, get its downloadURL, then insert new record for account along with the downloadURL.

uploadAsByteArray = async (pickerResultAsByteArray, progressCallback) => {

try {
var metadata = {
contentType: 'image/jpeg',
};

let name = new Date().getTime() + "-media.jpg"
var storageRef = firebase.storage().ref();
var ref = storageRef.child('assets/' + name)
let uploadTask = ref.put(pickerResultAsByteArray, metadata)

uploadTask.on('state_changed', function (snapshot) {

progressCallback && progressCallback(snapshot.bytesTransferred / snapshot.totalBytes)

var progress = (snapshot.bytesTransferred / snapshot.totalBytes) * 100;
console.log('Upload is ' + progress + '% done');

}, function (error) {
console.log("in _uploadAsByteArray ", error)
}, function () {
var downloadURL = uploadTask.snapshot.downloadURL;
//console.log("_uploadAsByteArray ", uploadTask.snapshot.downloadURL)
console.log('URLLLLL ' + downloadURL);


// save a reference to the image for listing purposes
var ref = firebase.database().ref('assets');
ref.push({
'URL': downloadURL,
//'thumb': _imageData['thumb'],
'name': name,
//'coords': _imageData['coords'],
'owner': firebase.auth().currentUser && firebase.auth().currentUser.uid,
'when': new Date().getTime()
})
});
return downloadURL;
} catch (ee) {
console.log("when trying to load _uploadAsByteArray ", ee)
}
}


I wanted to return variable downloadURL from this function and pass as parameter to my addNewAccount(), I am getting undefined.

addNewAccount = (downloadURL) => {
console.log(downloadURL);
}

Answer Source

You need use call back, like you do with progressCallback and pass there your downloadURL:

Then here you will have your downloadURL in progress:

api.uploadAsByteArray(byteArray, (downloadURL) => {
  //console.log('downloadURL' + downloadURL)
  this.setState({ downloadURL: downloadURL})
})

After setState you will have a downloadURL in the components state and can pass it in addNewAccount:

<TouchableOpacity onPress={()=> this.addNewAccount(downloadURL)}>

Your function uploadAsByteArray:

uploadAsByteArray = async(pickerResultAsByteArray, progressCallback) => {

    try {
        var metadata = {
            contentType: 'image/jpeg',
        };

        let name = new Date().getTime() + "-media.jpg"
        var storageRef = firebase.storage().ref();
        var ref = storageRef.child('assets/' + name)
        let uploadTask = ref.put(pickerResultAsByteArray, metadata)

        uploadTask.on('state_changed', function(snapshot) {

            progressCallback && progressCallback(snapshot.bytesTransferred / snapshot.totalBytes)

            var progress = (snapshot.bytesTransferred / snapshot.totalBytes) * 100;
            console.log('Upload is ' + progress + '% done');

        }, function(error) {
            console.log("in _uploadAsByteArray ", error)
        }, function() {
            var downloadURL = uploadTask.snapshot.downloadURL;
            //console.log("_uploadAsByteArray ", uploadTask.snapshot.downloadURL)
            console.log('URLLLLL ' + downloadURL);


            // save a reference to the image for listing purposes
            var ref = firebase.database().ref('assets');
            ref.push({
                'URL': downloadURL,
                //'thumb': _imageData['thumb'],
                'name': name,
                //'coords': _imageData['coords'],
                'owner': firebase.auth().currentUser && firebase.auth().currentUser.uid,
                'when': new Date().getTime()
            })
            progressCallback(downloadURL);
        });
    } catch (ee) {
        console.log("when trying to load _uploadAsByteArray ", ee)
    }
}