How to Upload an Image to Firebase Ios

Firebase and iOS

Cloud Storage for Firebase is a bully place for us to store users' files. Uploading and downloading files to and from Cloud Storage is very simple and straightforward: Firebase provides a fix of SDK for iOS, Android, Web, C++ and Unity developers to manage Cloud Storage for Firebase in an easy mode. And it is easy for developers to restrict the admission right to each file with Firebase Security Rules.

Below is a simple illustration of what nosotros are going to build in this tutorial:

Getting Started

Delight follow the official documentation to set up your Firebase projection and enable Cloud Storage for Firebase using the Firebase panel. Brand sure you upgrade to the Bonfire plan if your storage requirements exceed the 5GB free quota.

Building the UI

UIImagePickerController is a special kind of UIViewController which allows users to select photos or video clips from camera or album source. For sit-in purposes, I prepare the sourceType to photoLibrary and mediaTypes to image file just. Yous tin alter them to other values for your own purpose, eastward.thou. recording a video clip from a camera source.

UIImagePickerController for selecting images from the user's album

We then need to implement both the UIImagePickerControllerDelegate and UINavigationControllerDelegate to handle the selected file information (file URL). We can so initiate uploading the file to Cloud Storage for Firebase on line 24.

To learn more almostUIImagePickerViewController, bank check out the following article:

Uploading Files to Deject Storage for Firebase

We tin divide the above codes into the below sessions:

  1. Line vi–7: Construct a unique file name to the file stored in Cloud Storage for Firebase. Please notation that new files will overwrite the original file if the file names are the same.
  2. Line nine: Create a Storage reference with the filename. We can besides store it within a "folder" if you similar. "Folder" is only a human-readable term, as there are no directory in Deject Storage. Files have no hierarchical human relationship.
    Reference: Deject Storage Object Proper noun Documentation
  3. Line x–26: Upload the file information along with its metadata. After a successful upload, nosotros can fetch the download URL of the uploaded image and and then fetch it with any epitome loader, e.g. Kingfisher.

Handling errors

In that location could be errors during uploading files to Cloud Storage for Firebase at both server and client sides. Nosotros tin handle the errors with the observe function. Here are some common errors:

  1. Violation of Deject Storage Security Rules
    Firebase server can refuse whatsoever read and write operations based on the security rules. For example, the only logged-in user may upload files:

2. Network connexion error
Network stability is sometimes an issue on the client-side. For example, during underground transportation or inside a lift.

3. Free quota is exceeded
According to the Firebase pricing, there is a 5GB free quota for projects on the Spark Plan. The project owner has to upgrade to Blaze Plan in order to have larger storage.

4. Cancelled by user

Singleton Nature —✖️ UIViewController Lifecycle

Uploading a file to the Cloud server can be a long-running functioning depending on the user's network condition (and the file size). Sometimes, users probably similar to navigate to another screen during the uploading task.

🤔 Practise you retrieve users must stay on the upload screen until the upload has finished?

The answer is "no".

SDK has taken care of this situation by using a singleton pattern. The Storage instance returned from Storage.storage() is a singleton, which lives as long as the app lives. Therefore, the uploading chore is still running in the groundwork even the user has exited the page for uploading files.

Your 2nd question probably is "How can nosotros handle the issue (completion or error) of the uploading job when the user has navigate to a different screen?"

Ane way to exercise this is to use the Notification center:

At the callback of the putData, we can enclose the storageMetaData and error into a dictionary, and then laissez passer information technology to Notification observers through userInfo field.

Finally, we can add a Notification observer at the base UIViewController such that all UIViewControllers in the app can share the aforementioned logic. storageMetaData and mistake tin be retrieved dorsum from the userInfo of the Notification object, see line eleven–12.

App Lifecycle — Auto pause and resume

Afterwards discussing the UIViewController lifecycle topic, allow's focus on the app lifecycle. What volition happen when users send the app to the background during uploading files? Will the job be resumed automatically afterward the app is active in the foreground? The respond is "the SDK will have intendance of this, besides!"

In iOS, in that location are three application states:

  1. active — the app is in the foreground
  2. inactive — the app is as well in the foreground but cannot receive whatsoever events from the user. This is the case when yous receive a phone call or an SMS, for case.
  3. background — the app totally disappears from the screen

Co-ordinate to Apple'southward documentation, each app can accept around 30s to carry out its operations when information technology is sent to the background. The length of fourth dimension tin can be shorter depending on the device state of affairs. In other words, the Firebase SDK can still go on the uploading task at this 30s stage but it is forced to stop by the system after that. Any incomplete upload tasks volition be resumed when the app becomes active again. See the above graph for a better illustration.

What most caching?

If you have used Cloud Firestore before, you lot were probably amazed by the local enshroud arrangement. Even when the device is offline Firestore tin save the user's new information at the local database start and reupload them to the server automatically one time connectivity resumes.

Withal, Cloud Storage for Firebase does not have a like feature. Once the file cannot be uploaded due to a network issue, we have to upload it later on again manually.

Summary

Deject Storage for Firebase is a cloud tool for developers to store files and fetch them at the client-side with the help of a convenient SDK.

The SDK uses a singleton pattern to tackle the UIViewController lifecycle issue. The uploading chore tin continue fifty-fifty when the UIViewController is dismissed.

SDK has handled the app lifecycle issue for developers. It can resume the paused uploading task correct after the app becomes active in the foreground.

However, SDK does not have a local cache organisation and users accept to execute the uploading job manually.

Reference

  1. Introduction to Deject Storage for Firebase

2. Pricing about Deject Storage for Firebase and other groovy tools

3. Background tasks framework

4. UIImagePickerController introduction

bradleywhatche39.blogspot.com

Source: https://medium.com/firebase-developers/how-to-upload-image-from-uiimagepickercontroller-to-cloud-storage-for-firebase-bad90f80d6a7

0 Response to "How to Upload an Image to Firebase Ios"

Publicar un comentario

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel