error 400 when accessing firebase storage trying to get file url

Question

I'm trying the ionic and firebase platforms and i ran into a problem.

so i have an image in the storage I'm trying to access, i tried using the getDownloadURL() method but i keep getting an error 400, "invalid http method/url pair". i can't find any solution to it. same error when trying to use getMetadata().

firebase is initialized and all is working well for now, authentication, database readings and all. except for this error...

i have the following code in a service..

// Get a reference to the storage service, which is used to create references in your storage bucket
var storage = firebase.storage();

// Create a storage reference from our storage service
var storageRef = storage.ref();

// Create a child reference
var imagesRef = storageRef.child('images');
// imagesRef now points to 'images'

return {
    getImgRef: function (imgName) {
        var imgRef = imagesRef.child('Tanker.ico')
        imgRef.getDownloadURL().then(function (url) {
            return url
        }).catch(function(error) {
            switch (error.code) {
                case 'storage/object_not_found':
                    // File doesn't exist
                    break;

                case 'storage/unauthorized':
                    // User doesn't have permission to access the object
                    break;

                case 'storage/canceled':
                    // User canceled the upload
                    break;

                case 'storage/unknown':
                // Unknown error occurred, inspect the server response
                    break;
            }
        });

    }
}

all goes well until the getDownloadURL(), same if i try getMetadata().

any help with this issue?

Answer 1

Use %2F where there is forward slash (/) after bucket, like:

If you want to access: https://firebasestorage.googleapis.com/v0/b/BUCKET.appspot.com/o/images/folder/image.png?alt=media

Then write this: https://firebasestorage.googleapis.com/v0/b/BUCKET.appspot.com/o/images%2Ffolder%2Fimage.png?alt=media

Answer 2

Try to use the the full image path like the below

// Get a reference to the storage service, which is used to create references in your storage bucket
    var storage = firebase.storage();

    // Create a storage reference from our storage service
    var storageRef = storage.ref();

    // Create a child reference
    var imagesRef = storageRef.child('images/Tanker.ico');
    // imagesRef now points to 'images'

    return {
        getImgRef: function (imgName) {
            //var imgRef = imagesRef.child('Tanker.ico')
            imagesRef.getDownloadURL().then(function (url) {
                return url
            }).catch(function(error) {
                switch (error.code) {
                    case 'storage/object_not_found':
                        // File doesn't exist
                        break;

                    case 'storage/unauthorized':
                        // User doesn't have permission to access the object
                        break;

                    case 'storage/canceled':
                        // User canceled the upload
                        break;

                    case 'storage/unknown':
                    // Unknown error occurred, inspect the server response
                        break;
                }
            });

        }
    }