ابدأ باستخدام Firebase Storage لنظام التشغيل iOS

Arabic (العربية/عربي) translation by ansgaradh (you can also view the original English article)

المقدمة

بالإضافة إلى تمكين مطوري iOS من تخزين البيانات بسهولة على السحابة ، بالإضافة إلى مصادقة المستخدمين من خلال حزم SDK القوية الخاصة بهم ، يوفر Firebase أيضًا حل تخزين مناسب للوسائط. يتيح Firebase Storage للمطورين تخزين واسترداد ملفات الصوت والصور والفيديو على السحابة. ويعني ذلك أن Firebase Storage يعرض مجموعة من حزم SDK لإعطاء المطورين القدرة على إدارة أصول المحتوى التي ينشئها المستخدمون جنبًا إلى جنب مع المنتج التابع لها ، وهو قاعدة Firebase Realtime Database ، التي تخزّن محتوى نص المستخدم.

ومع ذلك ، يعد Firebase Storage أكثر من مجرد حاوية تخزين لمواد وسائط غنية.فهي تساعد المطورين من خلال تقديم المزامنة بدون اتصال للمستخدمين والأجهزة الخاصة بهم ، وتصطف الصفوف واستئناف الصور ومقاطع الفيديو عند خروج المستخدم والعودة عبر الإنترنت. يعمل هذا بطريقة مشابهة لكيفية قيام قاعدة بيانات Firebase Realtimeبتنسيق تزامن بيانات المستخدم مع النهاية الخلفية.

يستمر هذا البرنامج التعليمي من خلال برنامجنا التعليمي السابق حول كيفية البدء باستخدام مصادقة Firebase لنظام التشغيل iOS ، حيث نظرنا في كيفية إدارة المستخدمين في Firebase وتخزينهم والعمل معهم.

Firebase

البدء باستخدام مصادقة Firebase لنظام التشغيل iOS

دورون كاتز

أهداف هذا البرنامج التعليمي

إعداد تطبيقك لتخزين Firebase
إنشاء والعمل مع مراجع التخزين
تحميل الوسائط إلى Firebase Storage
تنزيل الوسائط من Firebase Storage

المعرفة المفترضة

يفترض هذا البرنامج التعليمي أن لديك بعض التعرض لـ Firebase ، وأن هناك خلفية تتطور مع Swift و Xcode. من المهم أيضًا أن تكون قد انتهيت من البرنامج التعليمي " البدء مع Firebase Authentication for iOS" أولاً حيث ستحتاج إلى مصادقة المستخدمين قبل الوصول إلى الكثير من وظائف Firebase Storage ، بما في ذلك مسارات الأصول.

ما هو تخزين Firebase؟

بصفتك مطورًا ، يمكنك استخدام قاعدة Firebase Realtime Database للدخول إلى مجموعة تخزين Firebase والتفاعل معها بطريقة غير خادمة ، دون الحاجة إلى إنشاء خوادمك واستضافتها. يستخدم Firebase Storage التخزين المؤقت المحلي على الجهاز لتخزين الأصول في وضع عدم الاتصال وعرض الأصول عند استعادة المستخدم للاتصال بالإنترنت ، مع مزامنة البيانات المحلية تلقائيًا.

لم يعد المطورون مضطرين للتعامل مع تعقيدات مزامنة البيانات والمحتوى من خلال مكتبات Apple القياسية للشبكات ، والاضطرار إلى التعامل مع سيناريوهات متعددة قد تتسبب في توقف النقل.

في الواقع ، تدرك منتجات Firebase أن مستخدمي الجوّال في العالم الحقيقي يواجهون احتمال حالات التوقف أو الإشارة المنخفضة. إن القدرة على مزامنة البيانات على الجهاز للنقل في وقت لاحق تجعل تجربة مستخدم أفضل بكثير ، بينما يوفر المطورون الكثير من العمل.

أخيرًا ، تستفيد التطبيقات المستضافة على Firebase Storage من بنية Google الأساسية التي تتنامى مع نمو قاعدة المستخدمين. سنستكشف بعضًا من هذه المفاهيم في وقت لاحق من البرنامج التعليمي ، ولكن لنبدأ ، لننتقل إلى إعداد تطبيقك للعمل مع Firebase. ثم سنلقي نظرة على مؤشرات مرجع التخزين.

انشاء المشروع

إذا كنت قد عملت مع Firebase من قبل ، فإن الكثير من هذا يجب أن يكون مألوفًا لك.بخلاف ذلك ، ستحتاج إلى إنشاء حساب في Firebase ، واتباع التعليمات في قسم Set Up the Project في المقالة Get Geted With Firebase Authentication for iOS .

يمكنك تنزيل شفرة المصدر الكاملة لهذا المشروع عن طريق إدخال ما يلي في الجهاز الطرفي:

$ git clone git@github.com:tutsplus/get-started-with-firebase-storage-for-ios.git

بالنسبة للتخزين ، سنحتاج إلى إضافة Firebase / Storage إلى Podfile ، كما هو موضح أدناه:

pod 'Firebase/Core'
pod 'Firebase/Storage'

احفظ ثم أدخل ما يلي في الجهاز الخاص بك لبناء القرون:

pod install

ضمن تطبيق AppDelegate : didFinishLaunchingWithOptions: method ، السطر التالي موجود:

FirebaseApp.configure()

تأكد من أنك قمت أيضًا بتهيئة مشروعك عبر Firebase Console بشكل صحيح ، كما هو موضح في قسم Set Up the Project في برنامج Start for With Firebase Authentication for iOS التعليمي.

بعد أن تصبح البيئة جاهزة ، يمكننا الانتقال إلى إلقاء نظرة على مراجع التخزين ، بدءًا من كيفية إنشاء مؤشر مرجعي.

خلق والعمل مع المراجع التخزين

يسمح لك وجود مؤشر إلى مسار أو ملف داخل المسار بتحميل هذا المسار أو تنزيله أو تحديثه أو حذفه. لإنشاء مرجع ، يمكنك ببساطة إنشاء مثيل Storage.storage () ، كما يلي:

let store = Storage.storage()
let storeRef = store.reference()

لديك الآن مرجع إلى جذر التسلسل الهرمي لنظام الملفات الخاص بك ، ويمكنك تعيين بنية دلوك كما تشاء ، على سبيل المثال عن طريق إنشاء بنية مجلد.

للوصول إلى الملفات والمسارات في مجموعة البيانات ، اتصل بالطريقة child () ، كما يلي:

let userProfilesRef = storeRef.child("images/profiles")
...
let logoRef = storeRef.child("images/logo.png")

تُعد المراجع اختصارًا لملف Firebase الكامل إلى ملفك عبر مجموعة البيانات ، بدلاً من إدخال مسار URL الخاص بك في دلو Firebase بالكامل. إلى جانب طريقة child () ، يمكنك أيضًا التنقل في التسلسل الهرمي باستخدام أساليب root () و parent () ، ويمكنك ربط هذه الطرق ، كما سترى أدناه:

let userProfilesRef = logoRef.parent()?.child("profiles")

كما ترى ، سنحصل على نفس النتائج لـ userProfilesRef كما كان لدينا في كتلة الشفرة السابقة. الأمر الرائع في المراجع هو أنها خفيفة الوزن للغاية ، لذا يمكنك الحصول على أكبر عدد ممكن من المراجع داخل تطبيقك كما تريد ، دون التأثير على أداء تطبيقك.

الآن بعد أن فهمت الجوانب الأساسية للعمل مع مراجع Firebase Storage ، دعنا ننتقل إلى تحميل وتنزيل الملفات من مجموعة البيانات الخاصة بك.

تحميل الوسائط إلى Firebase Storage

إن أبسط طريقة لتحميل الملف هي تمرير تمثيل NSData لمحتوياته في الذاكرة:

let uploadUserProfileTask = userProfilesRef.child("\(userID).png").putData(data, metadata: nil) { (metadata, error) in
  guard let metadata = metadata else {
    print("Error occurred: \(error)")
    return
  }
    print("download url for profile is \(metadata.downloadURL)")
}

يمكنك إدارة تحميلاتك قيد التقدم ، من خلال التحكم في موعد بدء التحميلات وإيقافها مؤقتًا واستئنافها وإلغاؤها. يمكنك أيضًا الاستماع للأحداث التالية التي يتم تشغيلها ، وهي:

وقفة
استئنف
إلغاء

بالرجوع إلى uploadUserProfileTask الذي استخدمناه سابقًا ، يمكنك التحكم في تحميلاتك باستخدام الطرق التالية:

uploadUserProfileTask.pause()
uploadUserProfileTask.resume()
uploadUserProfileTask.cancel()

let progressObserver = uploadUserProfileTask.observe(.progress) { snapshot in
  let percentComplete = 100.0 * Double(snapshot.progress!.completedUnitCount)
    / Double(snapshot.progress!.totalUnitCount)
    print(percentComplete)
}

لنرى كيف ستقترب من تنزيل الصور أو مقاطع الفيديو من مجموعة التخزين.

تنزيل الوسائط من مخزن Firebase

لتتمكن من تنزيل صورك وعرضها ، ستبدأ كما فعلت عند التحميل ، وتعلن عن مؤشر مرجع إلى المسار المحدد. ثم البدء في التنزيل باستخدام وظيفة الإغلاق dataWithMaxSize: completion ::

logoRef.getData(maxSize: 1 * 1024 * 1024) { data, error in
  if let error = error {
    print("Error \(error)")
  } else {
    let logoImage = UIImage(data: data!)
  }
}

إذا كنت تستخدم FirebaseUI ، فيمكنك ببساطة تشغيل FirebaseUI لتنزيل الصور وتخزينها مؤقتًا وعرضها بطريقة أكثر بساطة:

...
self.imageView.sd_setImage(with: logoRef, placeholderImage: placeholderImage)

للحصول على معلومات حول تنفيذ FirebaseUI ، راجع وثائق FirebaseUI .

تعمل ميزة إدارة التنزيلات بطريقة مماثلة لإدارة التحميلات والتحكم فيها. إليك مثال على ذلك:

let downloadTask = storageRef.child("images/logo.jpg").write(toFile: localFile)

// Pause the download
downloadTask.pause()

// Resume the download
downloadTask.resume()

// Cancel the download
downloadTask.cancel()

let progressObserverDownload = downloadTask.observe(.progress) { snapshot in
  let percentComplete = 100.0 * Double(snapshot.progress!.completedUnitCount)
    / Double(snapshot.progress!.totalUnitCount)
    print(percentComplete)
}

مسلحًا بنظرة عامة حول كيفية العمل مع المراجع وكيفية تحميل الأصول وتنزيلها من مجموعة البيانات ، فأنت الآن مستعد لإلقاء نظرة على كيفية تنفيذ Firebase Storage لمشروع العينة: FirebaseDo .

l

يجب أن تكون قد استنسخت تطبيق FirebaseDo الآن ، لذا انطلق وابني المشروع وقم بتشغيله. سترى أن كل ما يفعله هو مصادقة المستخدمين ، إما باستخدام الهاتف أو البريد الإلكتروني:

App screen with sign in options by phone or email

يتمثل هدفنا في تحسين وظائف التطبيق بشكل تدريجي ، بحيث يصبح المستخدمون قادرين على تحميل صورة الملف الشخصي بمجرد مصادقة مستخدمينا بنجاح. سيكون معظم عملنا فيHomeViewController ولوحة العمل المرتبطة به. دعونا معالجة الملفHomeViewController الأولى.

HomeViewController

class HomeViewController: UIViewController, FUIAuthDelegate, UIImagePickerControllerDelegate, UINavigationControllerDelegate  {
    
    @IBOutlet weak var myImageView: UIImageView!
    let picker = UIImagePickerController()

    ...
    fileprivate(set) var auth:Auth?
    fileprivate(set) var authUI: FUIAuth? //only set internally but get externally
    fileprivate(set) var authStateListenerHandle: AuthStateDidChangeListenerHandle?

أضف التالي نحو نهاية طريقة viewDidLoad () :

self.picker.delegate = self
self.refreshProfileImage()

سنقوم بتنفيذ طريقة refreshProfileImage () ، والتي سيتم استدعائها لتنزيل الصورة التي قمنا بعرضها في ViewController الخاص بنا. سنؤكد أولاً أن المستخدم قد تمت مصادقته بالفعل ، قبل إنشاء مرجع يسترد صورة الملف الشخصي للمستخدم من مسار/images/user_id/profile_photo.jpg داخل مجموعة البيانات الخاصة بنا. أخيرًا ، سنقوم بتحديث عرض الصورة الخاص بنا مع الصورة التي تم استردادها.

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) { data, error in
                if let error = error {
                    print("error: \(error.localizedDescription)")
                } else {
                    let image = UIImage(data: data!)
                    self.myImageView.image = image
                }
            }
        }else{
            print("You should be logged in")
            self.loginAction(sender: self)
            return
        }

    }

بعد ذلك ، قمنا بإنشاء طريقة IBAction لزر مكتبة الصور التي سنقوم بالاتصال بها قريبًا من لوحة العمل لدينا:

@IBAction func libraryAction(_ sender: Any) {
        self.picker.allowsEditing = false
        self.picker.sourceType = .photoLibrary
        self.picker.mediaTypes = UIImagePickerController.availableMediaTypes(for: .photoLibrary)!
        self.present(picker, animated: true, completion: {
            print("handle saving")
        })
    }

وأخيرًا ، نضيف طريقتين مفوضتين إلى UIImagePickerController ، للتعامل مع المستخدم عندما يلغي UIImagePicker ، وكذلك التعامل مع الصورة المحددة:

 func imagePickerControllerDidCancel(_ picker: UIImagePickerController) {
     dismiss(animated: true, completion: nil)
 }

func imagePickerController(_ picker: UIImagePickerController, didFinishPickingMediaWithInfo info: [String : Any]) {
        self.dismiss(animated: true, completion: nil)

        let profileImageFromPicker = info[UIImagePickerControllerOriginalImage] as! UIImage
        
        let metadata = StorageMetadata()
        metadata.contentType = "image/jpeg"
        
        let imageData: Data = UIImageJPEGRepresentation(profileImageFromPicker, 0.5)!
        
        let store = Storage.storage()
        let user = Auth.auth().currentUser
        if let user = user{
            let storeRef = store.reference().child("images/\(user.uid)/profile_photo.jpg")
            ASProgressHud.showHUDAddedTo(self.view, animated: true, type: .default)
            let _ = storeRef.putData(imageData, metadata: metadata) { (metadata, error) in
                ASProgressHud.hideHUDForView(self.view, animated: true)
                guard let _ = metadata else {
                    print("error occurred: \(error.debugDescription)")
                    return
                }

                self.myImageView.image = profileImageFromPicker
            }
            
        }
        
    }

كما فعلنا في طريقة refreshProfileImage () ، سنؤكد على أن المستخدم قد تمت مصادقته ، ثم إنشاء مرجع لمسار الصور حيث نريد تخزين ملف تعريف المستخدم الخاص بنا. باستخدام طريقة putData () ، نقوم بعد ذلك بتحميل صورتنا إلى موقع الجرافة المحدد بشكل غير متزامن ، قبل تعيين عرض الصورة على الصورة المحددة حديثًا.

قبل أن نتمكن من إنشاء تطبيقنا وتشغيله ، سنحتاج إلى إضافة عناصر التحكم المناسبة إلى لوحة العمل.

القصة المصورة

ضمن لوحة العمل الرئيسية الخاصة بنا ، قم بإضافة طريقة عرض صورة مع صورة عنصر نائب تمثل التشكيل الجانبي الحالي للمستخدم ، ثم اسحب لربط عرض الصورة مع العرض الذي قمنا بالإعلان عنه على أنه IBOutlet في فئة HomeViewController الخاصة بنا . بعد ذلك ، قم بإضافة شريط أدوات باستخدام زر سوف تستخدمه كـIBAction لاستدعاء طريقة LibraryAction () التي أنشأناها مسبقًا فيHomeViewController .

يجب أن تشبه لوحة العمل الآن ما يلي:

في غياب أي أخطاء ، يمكنك المضي قدمًا وإنشاء تطبيقك وتشغيله مرة أخرى والمصادقة من خلال إنشاء مستخدم جديد أو استخدام مجموعة من بيانات الاعتماد للمستخدم الحالي.

سوف يتم تقديمك مع HomeViewController ، حيث ستقوم بتحديد الزر + لإضافة صورة من جهازك أو من مكتبة صور جهاز محاكاة. بمجرد اختيار صورة ، سيتم تحميلها إلى مجموعة Firebase. يمكنك التأكيد على أنه تم تحميله بنجاح عن طريق الانتقال إلى علامة التبويب التخزين في وحدة تحكم Firebase ، كما هو موضح أدناه:

The Storage tab of your Firebase Console

إذا توقفت عن تشغيل التطبيق وإعادة تشغيله في Xcode ، فيجب أن تشاهد أيضًا الصورة التي تم تحميلها آخر مرة ، مما يؤكد مجددًا أننا قمنا بتحميل وتحميل بنجاح باستخدام Firebase Storage.

الاستنتاج

أظهر هذا البرنامج التعليمي كيفية تسهيل إضافة إدارة الأصول غير المتزامنة وإدارتها إلى تطبيق Firebase حاليًا باستخدام بضعة أسطر من الشفرة فقط. يوفر لك هذا طريقة ملائمة لإدارة أصول تطبيقك ، مع السماح لك بالتعامل مع المزامنة بلا اتصال بشكل أنيق ومريح.

يعد Firebase Storage خيارًا واضحًا لمطوري iOS الذين هم بالفعل ضمن النظام الأساسي لـ Firebase. ويوفر للمطورين أمان نموذج الأمان الضروري المقدم من قِبل مصادقة Firebase ، بالإضافة إلى القدرة التي توفرها قاعدة Firebase Realtime.

أثناء وجودك هنا ، تحقق من بعض مشاركاتنا الأخرى على تطوير تطبيقات iOS!