Firebase iOS Codelab Swift

1. Genel Bakış

Dostça Sohbet kod laboratuvarına hoş geldiniz. Bu kod laboratuvarında, iOS uygulamaları oluşturmak için Firebase platformunu nasıl kullanacağınızı öğreneceksiniz. Firebase kullanarak bir sohbet istemcisi uygulayacak ve performansını izleyeceksiniz.

Bu codelab, Objective-C'de de mevcuttur.

ne öğreneceksin

• Kullanıcıların oturum açmasına izin verin.
• Firebase Gerçek Zamanlı Veritabanını kullanarak verileri senkronize edin.
• İkili dosyaları Firebase Storage'da depolayın.

Neye ihtiyacın olacak

• xcode
• CocoaPod'lar
• iOS 8.0+ veya simülatörü olan bir test cihazı

2. Örnek kodu alın

GitHub deposunu komut satırından klonlayın.

$ git clone https://github.com/firebase/codelab-friendlychat-ios

3. Başlangıç ​​uygulamasını oluşturun

Başlangıç ​​uygulamasını oluşturmak için:

1. Bir terminal penceresinde şuraya gidin: örnek kod indirmenizden ios-starter/swift-starter dizini
2. pod install --repo-update çalıştırın
3. Projeyi Xcode'da açmak için FriendlyChatSwift.xcworkspace dosyasını açın.
4. Tıkla Çalıştır düğmesi.

Birkaç saniye sonra Dostça Sohbet ana ekranının göründüğünü görmelisiniz. Kullanıcı arayüzü görünmelidir. Ancak, bu noktada oturum açamaz, mesaj gönderemez veya alamazsınız. Bir sonraki adımı tamamlayana kadar uygulama bir istisna dışında duracaktır.

4. Firebase konsol Projesi oluşturun

proje oluştur

Firebase konsolundan Proje Ekle'yi seçin.

Projeyi FriendlyChat olarak adlandırın ve ardından Proje Oluştur'a tıklayın.

iOS uygulamanızı bağlayın

1. Yeni projenizin Projeye Genel Bakış ekranında, Firebase'i iOS uygulamanıza ekleyin 'i tıklayın.
2. Paket kimliğini " com.google.firebase.codelab.FriendlyChatSwift " olarak girin.
3. App Store kimliğini " 123456 " olarak girin.
4. Uygulamayı Kaydet'i tıklayın.

GoogleService-Info.plist dosyasını uygulamanıza ekleyin

İkinci ekranda, uygulamanız için gerekli tüm Firebase meta verilerini içeren bir yapılandırma dosyası indirmek için GoogleService-Info.plist'i İndir'i tıklayın. Bu dosyayı uygulamanıza kopyalayın ve FriendlyChatSwift hedefine ekleyin.

Artık açılır pencerenin sağ üst köşesindeki "x" işaretini tıklayarak kapatabilirsiniz - 3. ve 4. adımları atlayarak - buradaki adımları uygulayacaksınız.

Firebase modülünü içe aktar

Firebase modülünün içe aktarıldığından emin olarak başlayın.

AppDelegate.swift , FCViewController.swift

import Firebase

AppDelegate'te Firebase'i yapılandırın

.plist dosyanızdan temel Firebase hizmetlerini yapılandırmak için application:didFinishLaunchingWithOptions işlevi içindeki FirebaseApp'teki "configure" yöntemini kullanın.

AppDelegate.swift

  func application(_ application: UIApplication, didFinishLaunchingWithOptions
      launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool {
  FirebaseApp.configure()
  GIDSignIn.sharedInstance().delegate = self
  return true
}

5. Kullanıcıları Tanımlayın

Kimliği Doğrulanmış Kullanıcılarla Kısıtlamak İçin Kuralları Kullanın

Şimdi herhangi bir mesajı okumadan veya yazmadan önce kimlik doğrulaması gerektirecek bir kural ekleyeceğiz. Bunu yapmak için, mesaj veri nesnemize aşağıdaki kuralları ekliyoruz. Firebase konsolunun Veritabanı bölümünden Gerçek Zamanlı Veritabanı'nı seçin, ardından Kurallar sekmesine tıklayın. Ardından kuralları şu şekilde görünecek şekilde güncelleyin:

{
  "rules": {
    "messages": {
      ".read": "auth != null",
      ".write": "auth != null"
    }
  }
}

Bunun nasıl çalıştığı hakkında daha fazla bilgi için ("auth" değişkeniyle ilgili belgeler dahil) Firebase güvenlik belgelerine bakın.

Kimlik Doğrulama API'lerini Yapılandırma

Uygulamanızın, kullanıcılarınız adına Firebase Authentication API'lerine erişebilmesi için önce etkinleştirmeniz gerekir

1. Firebase konsoluna gidin ve projenizi seçin
2. Kimlik Doğrulamayı Seçin
3. Oturum Açma Yöntemi sekmesini seçin
4. Google anahtarını etkinleştirin (mavi)
5. Ortaya çıkan iletişim kutusunda Kaydet'e basın

Daha sonra bu kod laboratuvarında "CONFIGURATION_NOT_FOUND" mesajı içeren hatalar alırsanız, bu adıma geri dönün ve çalışmanızı iki kez kontrol edin.

Firebase Auth bağımlılığını onaylayın

Podfile dosyasında Firebase Auth bağımlılıklarının bulunduğunu onaylayın.

Pod dosyası

pod 'Firebase/Auth'

Google Sign In için Info.plist'inizi kurun.

XCode projenize özel bir URL şeması eklemeniz gerekecek.

1. Proje yapılandırmanızı açın: sol ağaç görünümünde proje adına çift tıklayın. HEDEFLER bölümünden uygulamanızı seçin, ardından Bilgi sekmesini seçin ve URL Türleri bölümünü genişletin.
2. + düğmesini tıklayın ve tersine çevrilmiş müşteri kimliğiniz için bir URL şeması ekleyin. Bu değeri bulmak için GoogleService-Info.plist yapılandırma dosyasını açın ve REVERSED_CLIENT_ID anahtarını arayın. Bu anahtarın değerini kopyalayın ve yapılandırma sayfasındaki URL Şemaları kutusuna yapıştırın. Diğer alanları boş bırakın.
3. Tamamlandığında, yapılandırmanız aşağıdakine benzer görünmelidir (ancak uygulamanıza özel değerlerle):

Google ile Oturum Açmak için clientID'yi ayarlayın

Firebase yapılandırıldıktan sonra, "didFinishLaunchingWithOptions:" yöntemi içinde Google Oturum Açmayı ayarlamak için clientID'yi kullanabiliriz.

AppDelegate.swift

  func application(_ application: UIApplication, didFinishLaunchingWithOptions
      launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool {
  FirebaseApp.configure()
  GIDSignIn.sharedInstance().clientID = FirebaseApp.app()?.options.clientID
  GIDSignIn.sharedInstance().delegate = self
  return true
}

Oturum açma işleyicisini ekleyin

Google Oturum Açma işleminin sonucu başarılı olduğunda, Firebase ile kimlik doğrulaması yapmak için hesabı kullanın.

AppDelegate.swift

  func sign(_ signIn: GIDSignIn!, didSignInFor user: GIDGoogleUser!, withError error: Error?) {
    if let error = error {
      print("Error \(error)")
      return
    }

    guard let authentication = user.authentication else { return }
    let credential = GoogleAuthProvider.credential(withIDToken: authentication.idToken,
                                                      accessToken: authentication.accessToken)
    Auth.auth().signIn(with: credential) { (user, error) in
      if let error = error {
        print("Error \(error)")
        return
      }
    }
  }

Kullanıcıda otomatik olarak oturum açın. Ardından, başarıyla oturum açtıktan sonra kullanıcının uygulamaya girmesine izin vermek için Firebase Auth'a bir dinleyici ekleyin. Ve deinit'te dinleyiciyi kaldırın.

SignInViewController.swift

  override func viewDidLoad() {
    super.viewDidLoad()
    GIDSignIn.sharedInstance().uiDelegate = self
    GIDSignIn.sharedInstance().signInSilently()
    handle = Auth.auth().addStateDidChangeListener() { (auth, user) in
      if user != nil {
        MeasurementHelper.sendLoginEvent()
        self.performSegue(withIdentifier: Constants.Segues.SignInToFp, sender: nil)
      }
    }
  }

  deinit {
    if let handle = handle {
      Auth.auth().removeStateDidChangeListener(handle)
    }
  }

Oturumu Kapat

Çıkış yöntemini ekleyin

FCViewController.swift

  @IBAction func signOut(_ sender: UIButton) {
    let firebaseAuth = Auth.auth()
    do {
      try firebaseAuth.signOut()
      dismiss(animated: true, completion: nil)
    } catch let signOutError as NSError {
      print ("Error signing out: \(signOutError.localizedDescription)")
    }
  }

Oturum Açmış Kullanıcı Olarak Mesajları Okumayı Test Et

1. Tıkla Çalıştır düğmesi.
2. Hemen oturum açma ekranına yönlendirilmelisiniz. Google ile Oturum Aç düğmesine dokunun.
3. Her şey yolunda giderse, mesajlaşma ekranına yönlendirilmelisiniz.

6. Gerçek Zamanlı Veritabanını Etkinleştirin

Mesajları İçe Aktar

Firebase konsolundaki projenizde, sol gezinme çubuğundaki Veritabanı öğesini seçin. Veritabanının taşma menüsünde JSON'u İçe Aktar'ı seçin. friendchat dizininde initial_messages.json dosyasına göz atın, onu seçin ve ardından İçe Aktar düğmesini tıklayın. Bu, şu anda veritabanınızda bulunan tüm verilerin yerini alacaktır. Öğe eklemek ve kaldırmak için yeşil + ve kırmızı x'i kullanarak veritabanını doğrudan da düzenleyebilirsiniz.

Veritabanınızı içe aktardıktan sonra şöyle görünmelidir:

Firebase Veritabanı Bağımlılığını Onaylayın

Podfile dosyasının bağımlılıklar bloğunda, Firebase/Database dahil edildiğini doğrulayın.

Pod dosyası

pod 'Firebase/Database'

Mevcut Mesajları Senkronize Et

Yeni eklenen mesajları uygulama arayüzüne senkronize eden kod ekleyin.

Bu bölüme ekleyeceğiniz kod:

• Firebase veritabanını başlatın ve veritabanında yapılan değişiklikleri işlemek için bir dinleyici ekleyin.
• Yeni mesajların gösterilmesi için DataSnapshot güncelleyin.

FCViewController'ınızın "deinit", "configureDatabase" ve "tableView:cellForRow indexPath:" yöntemlerini değiştirin; aşağıda tanımlanan kod ile değiştirin:

FCViewController.swift

  deinit {
    if let refHandle = _refHandle {
      self.ref.child("messages").removeObserver(withHandle: _refHandle)
    }
  }


  func configureDatabase() {
    ref = Database.database().reference()
    // Listen for new messages in the Firebase database
    _refHandle = self.ref.child("messages").observe(.childAdded, with: { [weak self] (snapshot) -> Void in
      guard let strongSelf = self else { return }
      strongSelf.messages.append(snapshot)
      strongSelf.clientTable.insertRows(at: [IndexPath(row: strongSelf.messages.count-1, section: 0)], with: .automatic)
    })
  }


  func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    // Dequeue cell
    let cell = self.clientTable.dequeueReusableCell(withIdentifier: "tableViewCell", for: indexPath)
    // Unpack message from Firebase DataSnapshot
    let messageSnapshot = self.messages[indexPath.row]
    guard let message = messageSnapshot.value as? [String: String] else { return cell }
    let name = message[Constants.MessageFields.name] ?? ""
    let text = message[Constants.MessageFields.text] ?? ""
    cell.textLabel?.text = name + ": " + text
    cell.imageView?.image = UIImage(named: "ic_account_circle")
    if let photoURL = message[Constants.MessageFields.photoURL], let URL = URL(string: photoURL),
        let data = try? Data(contentsOf: URL) {
      cell.imageView?.image = UIImage(data: data)
    }
    return cell
  }

Test Mesajı Senkronizasyonu

1. Tıkla Çalıştır düğmesi.
2. İletiler penceresine gitmek için Başlamak için oturum aç düğmesini tıklayın.
3. "Mesajlar" girişinin yanındaki yeşil + sembolüne tıklayarak ve aşağıdakine benzer bir nesne ekleyerek doğrudan Firebase konsolunda yeni mesajlar ekleyin:
4. Arkadaşça Sohbet Kullanıcı Arayüzünde göründüklerini onaylayın.

7. Mesaj Gönder

Mesaj Gönder'i uygula

Değerleri veritabanına aktarın. Firebase Realtime Database'e veri eklemek için push yöntemini kullandığınızda, otomatik bir kimlik eklenecektir. Otomatik olarak oluşturulan bu kimlikler sıralıdır, bu da yeni mesajların doğru sırayla eklenmesini sağlar.

FCViewController'ınızın "sendMessage:" yöntemini değiştirin; aşağıda tanımlanan kod ile değiştirin:

FCViewController.swift

  func sendMessage(withData data: [String: String]) {
    var mdata = data
    mdata[Constants.MessageFields.name] = Auth.auth().currentUser?.displayName
    if let photoURL = Auth.auth().currentUser?.photoURL {
      mdata[Constants.MessageFields.photoURL] = photoURL.absoluteString
    }

    // Push data to Firebase Database
    self.ref.child("messages").childByAutoId().setValue(mdata)
  }

Mesaj Göndermeyi Test Etme

1. Tıkla Çalıştır düğmesi.
2. Mesajlar penceresine gitmek için Oturum Aç'a tıklayın.
3. Bir mesaj yazın ve gönder düğmesine basın. Yeni mesaj, uygulama kullanıcı arayüzünde ve Firebase konsolunda görünür olmalıdır.

8. Görüntüleri Saklayın ve Alın

Firebase Depolama Bağımlılığını Onaylayın

Podfile bağımlılıklar bloğunda, Firebase/Storage dahil edildiğini onaylayın.

Pod dosyası

pod 'Firebase/Storage'

Kontrol panelinde Firebase Storage'ı etkinleştirin

Firebase konsoluna gidin ve Depolamanın "gs://PROJECTID.appspot.com" alan adıyla etkinleştirildiğini onaylayın

Bunun yerine aktivasyon penceresini görüyorsanız, varsayılan kurallarla etkinleştirmek için "BAŞLA"ya tıklayın.

FirebaseStorage'ı yapılandırın

FCViewController.swift

  func configureStorage() {
    storageRef = Storage.storage().reference()
  }

Mevcut mesajlarda resim al

Firebase Storage'dan görüntüleri indiren kod ekleyin.

FCViewController'ınızın "tableView: cellForRowAt indexPath:" yöntemini değiştirin; aşağıda tanımlanan kod ile değiştirin:

FCViewController.swift

  func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    // Dequeue cell
    let cell = self.clientTable .dequeueReusableCell(withIdentifier: "tableViewCell", for: indexPath)
    // Unpack message from Firebase DataSnapshot
    let messageSnapshot: DataSnapshot! = self.messages[indexPath.row]
    guard let message = messageSnapshot.value as? [String:String] else { return cell }
    let name = message[Constants.MessageFields.name] ?? ""
    if let imageURL = message[Constants.MessageFields.imageURL] {
      if imageURL.hasPrefix("gs://") {
        Storage.storage().reference(forURL: imageURL).getData(maxSize: INT64_MAX) {(data, error) in
          if let error = error {
            print("Error downloading: \(error)")
            return
          }
          DispatchQueue.main.async {
            cell.imageView?.image = UIImage.init(data: data!)
            cell.setNeedsLayout()
          }
        }
      } else if let URL = URL(string: imageURL), let data = try? Data(contentsOf: URL) {
        cell.imageView?.image = UIImage.init(data: data)
      }
      cell.textLabel?.text = "sent by: \(name)"
    } else {
      let text = message[Constants.MessageFields.text] ?? ""
      cell.textLabel?.text = name + ": " + text
      cell.imageView?.image = UIImage(named: "ic_account_circle")
      if let photoURL = message[Constants.MessageFields.photoURL], let URL = URL(string: photoURL),
          let data = try? Data(contentsOf: URL) {
        cell.imageView?.image = UIImage(data: data)
      }
    }
    return cell
  }

9. Görüntülü Mesajlar Gönderin

Mağazayı Uygulayın ve Görüntüleri Gönderin

Kullanıcıdan bir resim yükleyin, ardından bu resmin depolama URL'sini veritabanıyla senkronize edin, böylece bu resim mesajın içinde gönderilir.

FCViewController'ınızın "imagePickerController: didFinishPickingMediaWithInfo:" yöntemini değiştirin; aşağıda tanımlanan kod ile değiştirin:

FCViewController.swift

  func imagePickerController(_ picker: UIImagePickerController,
    didFinishPickingMediaWithInfo info: [String : Any]) {
      picker.dismiss(animated: true, completion:nil)
    guard let uid = Auth.auth().currentUser?.uid else { return }

    // if it's a photo from the library, not an image from the camera
    if #available(iOS 8.0, *), let referenceURL = info[UIImagePickerControllerReferenceURL] as? URL {
      let assets = PHAsset.fetchAssets(withALAssetURLs: [referenceURL], options: nil)
      let asset = assets.firstObject
      asset?.requestContentEditingInput(with: nil, completionHandler: { [weak self] (contentEditingInput, info) in
        let imageFile = contentEditingInput?.fullSizeImageURL
        let filePath = "\(uid)/\(Int(Date.timeIntervalSinceReferenceDate * 1000))/\((referenceURL as AnyObject).lastPathComponent!)"
        guard let strongSelf = self else { return }
        strongSelf.storageRef.child(filePath)
          .putFile(from: imageFile!, metadata: nil) { (metadata, error) in
            if let error = error {
              let nsError = error as NSError
              print("Error uploading: \(nsError.localizedDescription)")
              return
            }
            strongSelf.sendMessage(withData: [Constants.MessageFields.imageURL: strongSelf.storageRef.child((metadata?.path)!).description])
          }
      })
    } else {
      guard let image = info[UIImagePickerControllerOriginalImage] as? UIImage else { return }
      let imageData = UIImageJPEGRepresentation(image, 0.8)
      let imagePath = "\(uid)/\(Int(Date.timeIntervalSinceReferenceDate * 1000)).jpg"
      let metadata = StorageMetadata()
      metadata.contentType = "image/jpeg"
      self.storageRef.child(imagePath)
        .putData(imageData!, metadata: metadata) { [weak self] (metadata, error) in
          if let error = error {
            print("Error uploading: \(error)")
            return
          }
          guard let strongSelf = self else { return }
          strongSelf.sendMessage(withData: [Constants.MessageFields.imageURL: strongSelf.storageRef.child((metadata?.path)!).description])
      }
    }
  }

Görüntülü Mesaj Göndermeyi ve Almayı Test Etme

1. Tıkla Çalıştır düğmesi.
2. Mesajlar penceresine gitmek için Oturum Aç'a tıklayın.
3. Bir fotoğraf seçmek için "fotoğraf ekle" simgesini tıklayın. Fotoğraflı yeni mesaj, uygulama kullanıcı arayüzünde ve Firebase konsolunda görünür olmalıdır.

10. Tebrikler!

Kolayca gerçek zamanlı bir sohbet uygulaması oluşturmak için Firebase'i kullandınız.

Neleri ele aldık

• Gerçek Zamanlı Veritabanı
• Birleşik Oturum Açma
• Depolamak

Daha fazla bilgi edin

• Firebase.google.com.tr