En plus de permettre aux développeurs iOS de stocker facilement des données sur le cloud, ainsi qu’à l’authentification des utilisateurs grâce à leurs SDK robustes, Firebase fournit également une solution de stockage pratique pour les médias. Firebase Storage permet aux développeurs de stocker et de récupérer des fichiers audio, image et vidéo sur le cloud. Cela signifie que Firebase Storage expose un ensemble de kits de développement logiciel (SDK) pour donner aux développeurs la possibilité de gérer leurs ressources de contenu générées par les utilisateurs aux côtés de son produit frère, la base de données en temps réel Firebase, qui stocke le contenu en texte de l'utilisateur..
Cependant, Firebase Storage est plus qu'un simple conteneur de stockage pour les actifs de média enrichi. Il aide les développeurs en offrant une synchronisation hors ligne pour les utilisateurs et leurs appareils, en mettant en file d'attente et en reprenant des images et des vidéos lorsque l'utilisateur se déconnecte et se reconnecte. Cela fonctionne de la même manière que la base de données Firebase Realtime orchestre la synchronisation des données utilisateur vers le back-end..
Ce didacticiel reprend celui de notre précédent didacticiel intitulé Prise en main de l’authentification Firebase pour iOS, dans lequel nous avons examiné la gestion, le stockage et le travail des utilisateurs dans Firebase..
Ce didacticiel vous familiarisera avec les kits de développement de Firebase Storage pour vous aider à gérer les ressources multimédias de votre application, telles que les fichiers image, audio et vidéo, en les stockant à distance sur le cloud et en les récupérant dans l'ensemble de votre application. Dans ce tutoriel, vous allez apprendre à:
Ce tutoriel suppose que vous ayez eu une certaine exposition à Firebase et à un arrière-plan en développement avec Swift et Xcode. Il est également important que vous ayez déjà suivi notre didacticiel Premiers pas avec Firebase Authentification pour iOS, car vous devrez authentifier vos utilisateurs avant d'accéder à une grande partie des fonctionnalités de Firebase Storage, y compris les chemins d'accès aux ressources..
En tant que développeur, vous pouvez utiliser la base de données en temps réel Firebase pour accéder à votre compartiment de stockage Firebase et interagir sans passer par le serveur, sans qu'il soit nécessaire de créer et d'héberger vos propres serveurs. Firebase Storage utilise la mise en cache locale sur le périphérique pour stocker les actifs en mode hors connexion et en servir lors du retour en ligne de l'utilisateur, les données locales étant automatiquement synchronisées..
Les développeurs n'ont plus à composer avec la complexité de la synchronisation des données et du contenu via les bibliothèques de réseaux iOS standard d'Apple, ni à gérer plusieurs scénarios susceptibles de provoquer des interruptions de transfert..
En fait, les produits Firebase reconnaissent que les utilisateurs mobiles du monde réel sont confrontés à la perspective de situations d'interruption ou de faible signal. Etre capable de synchroniser les données sur l'appareil pour un transfert ultérieur améliore l'expérience utilisateur, tout en épargnant beaucoup de travail aux développeurs..
La sécurité est également primordiale avec Firebase Storage, comme avec le reste de la gamme de produits Firebase. Cela signifie que les développeurs peuvent restreindre l'accès aux éléments de stockage en authentifiant les utilisateurs à l'aide de l'authentification Firebase, qui repose sur un modèle de sécurité impératif permettant de contrôler l'accès aux chemins, fichiers et métadonnées, rôle par rôle..
Enfin, les applications hébergées sur Firebase Storage bénéficient d'une infrastructure Google évolutive à mesure que le nombre d'utilisateurs augmente. Nous allons explorer certains de ces concepts plus tard dans le didacticiel, mais pour commencer, voyons comment configurer votre application pour qu'elle fonctionne avec Firebase. Ensuite, nous allons jeter un oeil sur les pointeurs de référence de stockage.
Si vous avez déjà travaillé avec Firebase, cela devrait vous être familier. Sinon, vous devrez créer un compte dans Firebase et suivre les instructions du Configurer le projet section de l'article Premiers pas avec l'authentification Firebase pour iOS.
Vous pouvez télécharger le code source complet pour ce projet en entrant les informations suivantes dans le terminal:
$ git clone [email protected]: tutsplus / démarrer-avec-firebase-storage-for-ios.git
Pour le stockage, nous devrons ajouter Base de feu / stockage
à notre Podfile, comme indiqué ci-dessous:
pod 'Firebase / Core' pod 'Firebase / Storage'
Enregistrez puis entrez les informations suivantes dans votre terminal pour créer les modules:
installation de pod
Au sein de l'AppDelegate application: didFinishLaunchingWithOptions:
méthode, la ligne suivante est présente:
FirebaseApp.configure ()
Assurez-vous également que vous avez correctement configuré votre projet via la console Firebase, comme décrit dans la section Configurer le projet section du didacticiel Premiers pas avec Authentification Firebase pour iOS.
Une fois que votre environnement est prêt, nous pouvons passer à l'examen des références de stockage, en commençant par la création d'un pointeur de référence..
En utilisant Firebase Storage, vous pouvez interagir avec votre propre compartiment cloud, qui représente un système de fichiers de vos images et vidéos stockées. Vous utilisez ce que l'on appelle une référence de stockage pour un chemin ou un fichier particulier dans un chemin, au sein du système de fichiers auquel vous donnez ensuite accès à votre application, afin de pouvoir interagir avec elle en transférant des données..
Avoir un pointeur sur un chemin ou un fichier dans le chemin vous permet de télécharger, télécharger, mettre à jour ou supprimer ce chemin. Pour créer une référence, vous créez simplement une instance de Storage.storage ()
, comme suit:
let store = Storage.storage () let storeRef = store.reference ()
Vous avez maintenant une référence à la racine de la hiérarchie de votre système de fichiers et vous pouvez définir la structure de votre compartiment à votre guise, par exemple en créant une structure de dossiers..
Pour accéder aux fichiers et aux chemins de votre compartiment, appelez le enfant()
méthode, comme suit:
let userProfilesRef = storeRef.child ("images / profiles")… let logoRef = storeRef.child ("images / logo.png")
Les références sont un raccourci pour le chemin d'accès Firebase complet à votre fichier via votre compartiment, au lieu d'entrer votre chemin d'URL de compartiment Firebase complet. Outre le enfant()
méthode, vous pouvez également naviguer dans votre hiérarchie à l'aide du racine()
et parent()
méthodes, et vous pouvez enchaîner ces méthodes, comme vous le verrez ci-dessous:
let userProfilesRef = logoRef.parent () ?. child ("profils")
Comme vous pouvez le constater, nous obtiendrions les mêmes résultats pour userProfilesRef
comme nous l'avions dans le bloc de code précédent. L'avantage des références est qu'elles sont extrêmement légères, vous pouvez donc avoir autant de références que vous le souhaitez dans votre instance d'application, sans affecter les performances de votre application..
Maintenant que vous comprenez les aspects fondamentaux du travail avec les références de Firebase Storage, passons maintenant au téléchargement de fichiers depuis votre compartiment..
Le moyen le plus simple de télécharger un fichier est de passer un NSData
représentation de son contenu en mémoire:
let uploadUserProfileTask = userProfilesRef.child ("\ (userID) .png"). putData (données, métadonnées: nil) (métadonnées, erreur) in guard laissez métadonnées = métadonnées else print ("Une erreur est survenue: \ (erreur)" ) return print ("l'URL de téléchargement du profil est \ (metadata.downloadURL)")
Vous pouvez gérer vos téléchargements en cours en contrôlant le début, la mise en pause, la reprise et l'annulation de vos téléchargements. Vous pouvez également écouter les événements ultérieurs déclenchés, à savoir:
Référençant le uploadUserProfileTask
nous avons utilisé plus tôt, vous pouvez contrôler vos téléchargements en utilisant les méthodes suivantes:
uploadUserProfileTask.pause () uploadUserProfileTask.resume () uploadUserProfileTask.cancel ()
Vous pouvez également surveiller un transfert en cours en définissant simplement un observateur sur l'objet d'instance de tâche:
let progressObserver = uploadUserProfileTask.observe (.progress) instantané dans let percentComplete = 100.0 * Double (snapshot.progress! .completedUnitCount) / Double (instantané.progress! .totalUnitCount) print (percentComplete)
Voyons comment vous envisagez de télécharger des images ou des vidéos à partir du compartiment de stockage..
Pour pouvoir télécharger et présenter vos images, commencez comme pour le téléchargement et déclarez un pointeur de référence sur le chemin que vous avez désigné. Puis commencez le téléchargement en utilisant la fonction de fermeture dataWithMaxSize: complétion:
:
logoRef.getData (maxSize: 1 * 1024 * 1024) données, erreur dans if let erreur = erreur print ("Erreur \ (erreur)") else let logoImage = UIImage (data: data!)
Si vous utilisez FirebaseUI, vous pouvez simplement demander à FirebaseUI de gérer le téléchargement, la mise en cache et l'affichage des images pour vous d'une manière encore plus simple:
… Self.imageView.sd_setImage (avec: logoRef, placeholderImage: placeholderImage)
Pour plus d'informations sur l'implémentation de FirebaseUI, reportez-vous à la documentation de FirebaseUI..
La gestion des téléchargements fonctionne de la même manière que la gestion et le contrôle des téléchargements. Voici un exemple:
let downloadTask = storageRef.child ("images / logo.jpg"). write (toFile: localFile) // Suspend le téléchargement downloadTask.pause () // Reprend le téléchargement downloadTask.resume () // Annule le téléchargement downloadTask.cancel ()
Vous pouvez également désigner un observateur, comme nous l'avons fait pour les téléchargements, pour suivre en temps réel la progression du transfert de téléchargement:
let progressObserverDownload = downloadTask.observe (.progress) instantané de let percentComplete = 100.0 * Double (snapshot.progress! .completedUnitCount) / Double (instantané.progress! .totalUnitCount) print (percentComplete)
Armé d'une vue d'ensemble sur la façon de travailler avec des références et de télécharger des ressources de votre compartiment, vous êtes maintenant prêt à jeter un œil à la façon d'implémenter Firebase Storage pour notre exemple de projet: FirebaseDo..
Vous devriez déjà avoir cloné l'application FirebaseDo, alors allez-y, construisez et exécutez le projet. Vous constaterez qu'il ne fait qu'authentifier les utilisateurs, par téléphone ou par courrier électronique:
Notre objectif est d'améliorer progressivement les fonctionnalités de l'application, afin qu'une fois les utilisateurs authentifiés avec succès, ils puissent télécharger une photo de profil. La plupart de notre travail se fera dans le HomeViewController
et son storyboard associé. Parlons du HomeViewController
déposer en premier.
Avant de nous lancer dans les méthodes de ce contrôleur, nous devrons ajouter le UIImagePickerControllerDelegate
protocole à notre classe afin que nous puissions travailler avec ses méthodes déléguées. Nous devrons également ajouter une instance de sélecteur afin que nos utilisateurs puissent choisir une photo dans leur bibliothèque..
classe HomeViewController: UIViewController, FUIAuthDelegate, UIImagePickerControllerDelegate, UINavigationControllerDelegate @IBOutlet faible var myImageView: UIImageView! let picker = UIImagePickerController ()… fileprivate (set) var auth: Auth? fileprivate (set) var authUI: FUIAuth? // défini uniquement en interne mais en externe fileprivate (set) var authStateListenerHandle: AuthStateDidChangeListenerHandle?
Ajouter ce qui suit vers la fin de la viewDidLoad ()
méthode:
self.picker.delegate = self self.refreshProfileImage ()
Nous allons mettre en œuvre le refreshProfileImage ()
méthode, qui sera appelée pour télécharger l’image affichée dans notre ViewController. Nous allons d’abord affirmer que l’utilisateur est bien authentifié, avant de créer une référence qui récupérera l’image de profil de l’utilisateur à partir du /images/user_id/profile_photo.jpg chemin dans notre seau. Enfin, nous mettrons à jour notre vue d’image avec l’image récupérée..
func refreshProfileImage () if let user = Auth.auth (). currentUser let store = Storage.storage () let storeRef = store.reference (). child ("images / \ (user.uid) /profile_photo.jpg" ) storeRef.getData (maxSize: 1 * 1024 * 1024) données, erreur dans if let error = erreur print ("erreur: \ (error.localizedDescription)") else let image = UIImage (data: data!) self.myImageView.image = image else print ("Vous devez être connecté") self.loginAction (sender: self) return
Ensuite, nous créons un @IBAction
méthode pour le bouton de photothèque auquel nous allons bientôt nous connecter à partir de notre storyboard:
@IBAction func libraryAction (_ expéditeur: N'importe qui) self.picker.allowsEditing = false self.picker.sourceType = .photoLibrary self.picker.mediaTypes = UIImagePickerController.availableMediaTypes (pour: .photoLibrary)! self.present (sélecteur, animée: true, complétion: print ("sauvegarde du dossier"))
Enfin, nous ajoutons deux méthodes de délégation pour notre UIImagePickerController
, à gérer lorsque l'utilisateur annule la UIImagePicker
, ainsi que la manipulation de l'image sélectionnée:
func imagePickerControllerDidCancel (_ picker: UIImagePickerController) licencier (animé: true, complétion: nil) func imagePickerController (_ picker: UIImagePickerController, didFinishPickingMediaWithWithInfo: let profileImageFromPicker = info [UIImagePickerControllerOriginalImage] en tant que! UIImage laisse metadata = StorageMetadata () metadata.contentType = "image / jpeg" laisse imageData: Data = UIImageJPEGRepresentation (profileImageFromPicker, 0.5)! let store = Storage.storage () let user = Auth.auth (). currentUser if let utilisateur = utilisateur let storeRef = store.reference (). child ("images / \ (user.uid) /profile_photo.jpg") ASProgressHud.showHUDAddedTo (self.view, animé: true, type: .default) let _ = storeRef.putData (imageData, metadata: metadata) (métadonnées, erreur) dans ASProgressHud.hideHUDForView (self.view, animé: true) let _ = metadata else print ("une erreur s'est produite: \ (error.debugDescription)") return self.myImageView.image = profileImageFromPicker
Une fois que l'utilisateur sélectionne une image, nous laissons le sélecteur tout en conservant une référence à l'image sélectionnée. Ensuite, nous créons un StorageMetadata ()
exemple pour que nous puissions dire à Firebase que nous allons télécharger un fichier JPEG.
Comme nous l'avons fait dans le refreshProfileImage ()
méthode, nous allons affirmer que l'utilisateur est authentifié, puis créer une référence au chemin des images où nous souhaitons stocker le profil de l'utilisateur. En utilisant le putData ()
méthode, nous téléchargeons ensuite notre image de manière asynchrone vers l'emplacement de compartiment désigné, avant de définir notre vue d'image sur la nouvelle image sélectionnée.
Avant de pouvoir créer et exécuter notre application, nous devrons ajouter les contrôles appropriés à notre scénarimage..
Dans notre scénarimage principal, ajoutez une vue d'image avec une image d'espace réservé qui représentera le profil actuel de l'utilisateur, puis faites glisser pour associer la vue d'image à celle que nous avons déclarée comme @IBOutlet
dans notre HomeViewController
classe. Ensuite, ajoutez une barre d’outils avec un bouton que vous utiliserez comme @IBAction
appeler le libraryAction ()
méthode que nous avons créée plus tôt dans la HomeViewController
.
Votre Storyboard devrait maintenant ressembler à ceci:
En l'absence d'erreurs, vous pouvez créer et exécuter à nouveau votre application, puis vous authentifier en créant un nouvel utilisateur ou en utilisant l'ensemble des informations d'identification d'un utilisateur existant..
Vous serez alors présenté avec le HomeViewController
, où vous sélectionnerez le + bouton pour ajouter une image de votre appareil ou de la photothèque du simulateur. Une fois que vous avez choisi une photo, elle sera téléchargée dans le compartiment Firebase. Vous pouvez confirmer qu’il a été téléchargé avec succès en allant sur le Espace de rangement onglet de votre console Firebase, comme indiqué ci-dessous:
Si vous arrêtez et relancez l'application dans Xcode, vous devriez également voir la dernière image téléchargée réapparaître, ce qui confirme que nous avons correctement chargé et téléchargé via Firebase Storage..
Ce didacticiel a montré combien il était facile d’ajouter du stockage et de la gestion d’actifs asynchrones à une application Firebase existante avec seulement quelques lignes de code. Cela vous offre un moyen pratique de gérer les actifs de votre application, tout en vous permettant de gérer la synchronisation hors ligne de manière élégante et pratique..
Le stockage Firebase est un choix évident pour les développeurs iOS qui font déjà partie de l'écosystème Firebase. Il fournit aux développeurs la sécurité d'un modèle de sécurité impératif fourni par l'authentification Firebase, ainsi que les fonctionnalités fournies par la base de données en temps réel Firebase..
Pendant que vous êtes ici, consultez certains de nos autres articles sur le développement d'applications iOS.!