Upload and retrieve photo from Firebase

Question

I have built and application which shows in UITableView data of books. All works perfectly, the only thing I need is the book's photo. To upload and retrieve photo I use Firebase but I don't have idea how do it with photos.

This is what I have implemented:

@IBAction func ButtonScatta(_ sender: UIButton) {

    if UIImagePickerController.isSourceTypeAvailable(UIImagePickerControllerSourceType.camera) {
        let imagePicker = UIImagePickerController()
        imagePicker.delegate = self
        imagePicker.sourceType = UIImagePickerControllerSourceType.camera;
        imagePicker.allowsEditing = false
        self.present(imagePicker, animated: true, completion: nil)
    }

}

@IBAction func ButtonScegli(_ sender: UIButton) {

    if UIImagePickerController.isSourceTypeAvailable(UIImagePickerControllerSourceType.photoLibrary) {
        let imagePicker = UIImagePickerController()
        imagePicker.delegate = self
        imagePicker.sourceType = UIImagePickerControllerSourceType.photoLibrary;
        imagePicker.allowsEditing = true
        self.present(imagePicker, animated: true, completion: nil)
    }

}

func imagePickerController(_ picker: UIImagePickerController, didFinishPickingImage image: UIImage!, editingInfo: [AnyHashable: Any]!) {
    ImageView.image = image
    self.dismiss(animated: true, completion: nil);
}

And this is the function of the button "Vendi":

if let user = FIRAuth.auth()?.currentUser{

        self.emailUser.text = user.email
        let userID: String = user.uid
        let x = libriArray.count
        let y = String(x+1)
        //let imageLibro: UIImage = self.ImageView.image!
        let emailVenditore: String = self.emailUser.text!
        let titoloLibro: String = self.TitoloText.text!
        let codiceLibro: String = self.ISBNText.text!
        let prezzoLibro: String = self.PrezzoText.text!
        let edizioneLibro: String = self.EdizioneText.text!
        let statoLibro: Bool = false

        let Libro = ["titolo": titoloLibro, "codice": codiceLibro, "prezzo": prezzoLibro, "autore": edizioneLibro, "emailUser": emailVenditore, "userID": userID, "stato": statoLibro] as [String : Any]

        let libriRef = ref.child(byAppendingPath: "Libri")

        var libri = [y: Libro]
        libriRef.childByAutoId().setValue(Libro)

        self.dismiss(animated: true, completion: nil)

    }  else {

    }

Can someone write and explain how to do the upload and retrieve of this photos?

Answer 1

I have a hard time tracing what you're doing exactly with those var names. However, I'm assuming you got the UIImage from the imagePickerController.

You will need Firebase Storage (pod 'Firebase/Storage') and import FirebaseStorage in the respective file.

Here's what you can do to upload the UIImage to Firebase Storage:

func uploadPhoto(_ image: UIImage, completionBlock: @escaping () -> Void) {
    let ref = FIRStorage.storage().reference().child("myCustomPath").child("myFileName.jpg")    // you may want to use UUID().uuidString + ".jpg" instead of "myFileName.jpg" if you want to upload multiple files with unique names

    let meta = FIRStorageMetadata()
    meta.contentType = "image/jpg"

    // 0.8 here is the compression quality percentage
    ref.put(UIImageJPEGRepresentation(image, 0.8)!, metadata: meta, completion: { (imageMeta, error) in
        if error != nil {
            // handle the error
            return
        }

        // most likely required data
        let downloadURL = imageMeta?.downloadURL()?.absoluteString      // needed to later download the image
        let imagePath = imageMeta?.path     // needed if you want to be able to delete the image later

        // optional data
        let timeStamp = imageMeta?.timeCreated
        let size = imageMeta?.size

        // ----- should save these data in your database at this point -----

        completionBlock()
    })

}

This is a simple function that can upload a UIImage to Firebase Storage. Note that you should keep track of the downloadURL and the path of every image you upload. You can save them in the database after any upload.

To download an image you uploaded, you can do something like this:

func retrieveImage(_ URL: String, completionBlock: @escaping (UIImage) -> Void) {
    let ref = FIRStorage.storage().reference(forURL: URL)

    // max download size limit is 10Mb in this case
    ref.data(withMaxSize: 10 * 1024 * 1024, completion: { retrievedData, error in
        if error != nil {
            // handle the error
            return
        }

        let image = UIImage(data: retrievedData!)!

        completionBlock(image)

    })
}