Downloading Photographs from Firebase Cloud Storage

App Development
1

I need some help understanding what I am doing incorrectly downloading images that are tied to database references for displaying in a tableview.

I have uploaded images to Firebase Cloud Storage and created a reference in my database. Each database entry can have more than one image so I have a database entry called photos that is an array of url references.

To get the data to display in my tableview I iterate through the database a number of times, so end up with an array of data. For the photos, this is an array containing an array of URL references.
When I tried to get the photo data from this array of arrays using the getData method I got an error message (something about the URL references not beginning with “http:/ or https:/”) which I assumed was because the references were within an array of arrays. I corrected this by using a “For index items in” loop to go through the array of arrays and retrieve the the URLs and append them into a single array.

This allowed me to use the getData method without errors. I retrieved the image data and appended it to an array of images for showing in a tableview.

The problem I am having is that when I try to assign the images in the array to an imageview I get a message saying I am trying to assign a string to a UIIMage.

This tells me that my getData function didn’t work. What should the data look like after I get it?

Following is the array of URLs I created from the array of arrays, that I am using in my getData function. Note: there are only 3 URLs in the array. This looks correct to me.

https://firebasestorage.googleapis.com/v0/b/aim-for-safety.appspot.com/o/Airplane%20Inspection%20%26%20Maintenance%2Fmwvk4gUcwsOhJ3wiiNIuIOjc6AG2%2FPhotos%2F0CD3CFBA-571F-4874-9E86-51CBC06A078A.jpeg?alt=media&token=bc6a2a40-e271-4dcd-8e9e-8a640059df03

https://firebasestorage.googleapis.com/v0/b/aim-for-safety.appspot.com/o/Airplane%20Inspection%20%26%20Maintenance%2Fmwvk4gUcwsOhJ3wiiNIuIOjc6AG2%2FPhotos%2F7126CC2C-F1D7-493B-A3ED-03C5CBE87038.jpeg?alt=media&token=e21b4e25-899e-411f-8590-32f7ae36800e

https://firebasestorage.googleapis.com/v0/b/aim-for-safety.appspot.com/o/Airplane%20Inspection%20%26%20Maintenance%2Fmwvk4gUcwsOhJ3wiiNIuIOjc6AG2%2FPhotos%2F48FF46CB-2037-4E78-897A-4E92DDEBBBC4.jpeg?alt=media&token=d5bd27d4-a9dc-4b44-bd6d-551dd0bcfd04

But following is the data I get from the getData function. NOTE: For some reason there are 5 bits of data.

[<UIImage:0x60000149ec70 anonymous {3000, 2002}>, <UIImage:0x600001490120 anonymous {4288, 2848}>, <UIImage:0x600001498fc0 anonymous {3000, 2002}>, <UIImage:0x600001499200 anonymous {4288, 2848}>, <UIImage:0x600001490000 anonymous {3000, 2002}>]

As always, any help I receive in educating me on coding is greatly appreciated!

2

If I understand what you’re doing, after you download the URLs you need to make them into UIImages

UIImage(data: data)

You do this after you download the URLs, because a URL isn’t an image, it’s just a link, so you have to change it into a UIImage

After that you should be able to add it as an image to your array of images

ALSO can you please post a pic of your code??

3

This link may help!

4

Thanks mikaela, following is my code. As you can see I did convert the information into a UIImage.

In the first line document[“Photos”] is where the url string is referenced in the firestore cloud database.

Photos.urlArray = document[“Photos”] as! [String]

for photos in Photos.urlArray {
let imageRef = Storage.storage()
let storeRef = imageRef.reference(forURL: photos)
storeRef.getData(maxSize: 2 * 1024 * 1024, completion: { [weak self] (data, error) in

         if let error = error {
          print("****** Error Downloading Image: \(error)")
         
           }
           else {
                    if let imageData = data {
                                        
                      DispatchQueue.main.async {
                      let photoImage = UIImage(data: imageData)
                                        
                      Photos.imageArray.append(photoImage!)
                        }
                                    
                    }
                    }
                  })
                            
          }

Thanks for your help! I’ll also check out the link you sent me but I have ben googling a solution for over a week and can’t see what I am doing wrong. One of the things I did once my last post was remove the array of arrays and just created a single array of urls at the start.

5

Some more information, directly from the code:

This is one URL reference in the database from printing “photos”:

https://firebasestorage.googleapis.com/v0/b/aim-for-safety.appspot.com/o/Airplane%20Inspection%20%26%20Maintenance%2Fmwvk4gUcwsOhJ3wiiNIuIOjc6AG2%2FPhotos%2F0CD3CFBA-571F-4874-9E86-51CBC06A078A.jpeg?alt=media&token=bc6a2a40-e271-4dcd-8e9e-8a640059df03

This is the corresponding firebase storage reference from printing “storeRef”

gs://aim-for-safety.appspot.com/Airplane Inspection & Maintenance/mwvk4gUcwsOhJ3wiiNIuIOjc6AG2/Photos/0CD3CFBA-571F-4874-9E86-51CBC06A078A.jpeg

6

I have resolved my issue. The problem was with the cellForRowAt index path function:

I had the following command: photoCell.photoImage.image = UIIMage(named: Photos.imageArray[indexPath.row].

This command was giving me the error, cannot convert a type UIIMage to type string.

Once I changed it to: photoCell.photoImage.image = Photos.imageArray[indexPath.row]

The problem went way.