Firebase iOS Codelab Swift

1. Genel Bakış

Friendly Chat kod laboratuvarına hoş geldiniz. Bu codelab'de, iOS uygulamaları oluşturmak için Firebase platformunu nasıl kullanacağınızı öğreneceksiniz. Bir sohbet istemcisi uygulayacak ve Firebase'i kullanarak performansını izleyeceksiniz.

Neler öğreneceksiniz?

• Kullanıcıların oturum açmasına izin verin.
• Firebase Realtime Database'i kullanarak verileri senkronize edin.
• İkili dosyaları Firebase Storage'da depolama

Gerekenler

• Xcode
• CocoaPods
• iOS 8.0 veya sonraki sürümlerin yüklü olduğu bir test cihazı ya da simülatör

2. Örnek kodu alın

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

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

3. Başlangıç uygulamasını oluşturma

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

1. Terminal penceresinde, örnek kod indirme işleminizdeki ios-starter/swift-starter dizinine gidin
2. pod install --repo-update çalıştırma
3. Projeyi Xcode'da açmak için FriendlyChatSwift.xcworkspace dosyasını açın.
4. Çalıştır düğmesini tıklayın.

Birkaç saniye sonra Dost Sohbet ana ekranı gösterilir. Kullanıcı arayüzü görünür. Ancak bu aşamada oturum açamaz, mesaj gönderip alamazsınız. Sonraki adımı tamamlayana kadar uygulama bir istisnayla iptal edilir.

4. Firebase Konsolu projesi oluşturma

Proje oluşturma

Firebase konsolunda Proje Ekle'yi seçin.

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

Firebase fiyatlandırma planınızı yükseltme

Firebase için Cloud Storage'ı kullanmak istiyorsanız Firebase projenizin kullandıkça öde (Blaze) fiyatlandırma planında olması gerekir. Yani projeniz bir Cloud Faturalandırma hesabına bağlı olmalıdır.

• Cloud Billing hesabı için kredi kartı gibi bir ödeme yöntemi gerekir.
• Firebase ve Google Cloud'da yeniyseniz 300 ABD doları kredi ve Ücretsiz Deneme Cloud Faturalandırma hesabı almaya uygun olup olmadığınızı kontrol edin.
• Bu kod laboratuvarını bir etkinlik kapsamında yapıyorsanız düzenleyen kişiye Cloud kredisi olup olmadığını sorun.

Projenizi Blaze planına yükseltmek için aşağıdaki adımları uygulayın:

1. Firebase konsolunda planınızı yükseltmeyi seçin.
2. Blaze planını seçin. Projenize bir Cloud Faturalandırma hesabı bağlamak için ekrandaki talimatları uygulayın.
   Bu yükseltme kapsamında bir Cloud Faturalandırma hesabı oluşturmanız gerekiyorsa yükseltmeyi tamamlamak için Firebase Console'daki yükseltme akışına geri dönmeniz gerekebilir.

iOS uygulamanızı bağlama

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

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

Uygulamanız için gerekli tüm Firebase meta verilerini içeren bir yapılandırma dosyası indirmek üzere ikinci ekranda GoogleService-Info.plist dosyasını indir'i tıklayın. Bu dosyayı uygulamanıza kopyalayıp FriendlyChatSwift hedefine ekleyin.

Artık pop-up'ı kapatmak için sağ üst köşedeki "x"i tıklayabilirsiniz. 3. ve 4. adımları atlayabilirsiniz çünkü bu adımları burada gerçekleştireceksiniz.

Firebase modülünü içe aktarma

Firebase modülünün içe aktarıldığından emin olun.

AppDelegate.swift, FCViewController.swift

import Firebase

AppDelegate'de Firebase'i yapılandırma

Temel Firebase hizmetlerini .plist dosyanızdan yapılandırmak için application:didFinishLaunchingWithOptions işlevindeki FirebaseApp'te "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ımlama

Kimlik doğrulanmış kullanıcılarla kısıtlamak için kuralları kullanma

Artık herhangi bir ileti okumadan veya yazmadan önce kimlik doğrulama yapılmasını zorunlu kılacak bir kural ekleyeceğiz. Bunu yapmak için mesajlar veri nesnemize aşağıdaki kuralları ekleriz. Firebase Konsolu'nun Veritabanı bölümünden Gerçek Zamanlı Veritabanı'nı seçin ve ardından Kurallar sekmesini tıklayın. Ardından kuralları şu şekilde güncelleyin:

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

Bunun işleyiş şekli hakkında daha fazla bilgi (ör. "auth" değişkeniyle ilgili dokümanlar) için Firebase güvenlik dokümanlarını inceleyin.

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 bu API'yi etkinleştirmeniz gerekir.

1. Firebase Konsolu'na gidin ve projenizi seçin.
2. Kimlik doğrulama'yı seçin.
3. Oturum Açma Yöntemi sekmesini seçin.
4. Google anahtarını etkin (mavi) konuma getirin.
5. Açılan iletişim kutusunda Kaydet'e basın.

Bu kod laboratuvarının ilerleyen aşamalarında "CONFIGURATION_NOT_FOUND" mesajıyla birlikte hata alırsanız bu adıma geri dönüp çalışmanızı tekrar kontrol edin.

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

Podfile dosyasında Firebase Auth bağımlılıkları olduğunu doğrulayın.

Pod dosyası

pod 'Firebase/Auth'

Info.plist dosyanızı Google ile oturum açma için ayarlayın.

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

1. Proje yapılandırmanızı açın: Soldaki ağaç görünümünde proje adını ç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ş istemci 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ı bulun. Bu anahtarın değerini kopyalayıp yapılandırma sayfasındaki URL Şemaları kutusuna yapıştırın. Diğer alanları boş bırakın.
3. Yapılandırmanız tamamlandığında aşağıdakine benzer bir şekilde görünmelidir (ancak uygulamaya özgü değerlerinizle):

Google ile oturum açma için clientID ayarlama

Firebase yapılandırıldıktan sonra, "didFinishLaunchingWithOptions:" yönteminde Google ile oturum açma özelliğini 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
}

Giriş işleyicisini ekleme

Google ile oturum açma işleminin sonucu başarılı olduğunda, Firebase ile kimlik doğrulamak 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ının oturumunu otomatik olarak açma Ardından, başarılı bir oturum açtıktan sonra kullanıcının uygulamaya girmesine izin vermek için Firebase Auth'a bir dinleyici ekleyin. Ayrıca, 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

Oturum kapatma yöntemini ekleme

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 Mesaj Okuma İşlemini Test Etme

1. Çalıştır düğmesini tıklayın.
2. Hemen oturum açma ekranına yönlendirilirsiniz. Google ile oturum açma düğmesine dokunun.
3. Her şey yolunda giderse mesajlaşma ekranına yönlendirilirsiniz.

6. Realtime Database'i etkinleştirme

Mesajlar'ı içe aktarma

Firebase konsolundaki projenizde, soldaki gezinme çubuğundan Veritabanı öğesini seçin. Veritabanının taşma menüsünde JSON'u içe aktar'ı seçin. friendlychat dizininde initial_messages.json dosyasına gidin, dosyayı seçin ve İçe aktar düğmesini tıklayın. Bu işlem, şu anda veritabanınızdaki tüm verileri değiştirir. Öğe eklemek ve kaldırmak için yeşil + ve kırmızı x simgesini kullanarak veritabanını doğrudan da düzenleyebilirsiniz.

İçe aktarma işleminden sonra veritabanınız şu şekilde görünecektir:

Firebase veritabanı bağımlılığını onaylama

Podfile dosyasının bağımlılıklar bloğunda Firebase/Database'un dahil edildiğinden emin olun.

Pod dosyası

pod 'Firebase/Database'

Mevcut iletileri senkronize etme

Yeni eklenen mesajları uygulama kullanıcı arayüzüyle senkronize eden kod ekleyin.

Bu bölüme eklediğ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 uygulamasını güncelleyin.

FCViewController'ınızın "deinit", "configureDatabase" ve "tableView:cellForRow indexPath:" yöntemlerini değiştirin; aşağıdaki kodla 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
  }

Mesaj senkronizasyonunu test etme

1. Çalıştır düğmesini tıklayın.
2. Mesajlar penceresine gitmek için Başlamak için oturum açın düğmesini tıklayın.
3. "mesajlar" girişinin yanındaki yeşil + simgesini tıklayıp aşağıdaki gibi bir nesne ekleyerek doğrudan Firebase konsoluna yeni mesajlar ekleyin:
4. Bu öğelerin, Dost Sohbet kullanıcı arayüzünde gösterildiğini onaylayın.

7. Mesajlar Gönderme

Mesaj gönderme özelliğini uygulama

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

FCViewController'ınızın "sendMessage:" yöntemini değiştirin ve aşağıda tanımlanan kodla 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önderme İşlemini Test Etme

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

8. Resim depolama ve alma

Firebase Storage Bağımlılığını Onaylama

Podfile öğesinin bağımlılıklar bloğunda Firebase/Storage öğesinin dahil edildiğinden emin olun.

Pod dosyası

pod 'Firebase/Storage'

Cloud Storage for Firebase'i ayarlama

Firebase projenizde Cloud Storage for Firebase'i ayarlamak için:

1. Firebase konsolunun sol panelinde Derleme'yi genişletin ve ardından Depolama'yı seçin.
2. Başlayın'ı tıklayın.
3. Varsayılan Storage paketiniz için bir konum seçin.
   US-WEST1, US-CENTRAL1 ve US-EAST1'deki paketler, Google Cloud Storage'ın "Daima Ücretsiz" katmanından yararlanabilir. Diğer tüm konumlardaki paketler için Google Cloud Storage fiyatlandırması ve kullanımı geçerlidir.
4. Test modunda başlat'ı tıklayın. Güvenlik kurallarıyla ilgili sorumluluk reddi beyanını okuyun.
   Bu kod laboratuvarının ilerleyen bölümlerinde, verilerinizin güvenliğini sağlamak için güvenlik kuralları ekleyeceksiniz. Depolama alanı paketiniz için Güvenlik Kuralları eklemedenbir uygulamayı dağıtmayın veya herkese açık olarak göstermeyin.
5. Oluştur'u tıklayın.

FirebaseStorage'ı yapılandırma

FCViewController.swift

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

Mevcut mesajlarda resim alma

Firebase Storage'dan resim indiren kod ekleyin.

FCViewController'ınızın "tableView: cellForRowAt indexPath:" yöntemini değiştirin ve aşağıda tanımlanan kodla 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. Resim mesajları gönderme

Resim Saklama ve Gönderme özelliğini uygulama

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

FCViewController'ınızın "imagePickerController: didFinishPickingMediaWithInfo:" yöntemini değiştirin; aşağıdaki kodla 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])
      }
    }
  }

Resimli Mesaj Gönderme ve Alma İşlemini Test Etme

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

10. Tebrikler!

Gerçek zamanlı sohbet uygulaması oluşturmak için Firebase'i kolayca kullandınız.

Ele aldığımız konular

• Realtime Database
• Birleşik Oturum Açma
• Depolama

Daha Fazla Bilgi

• Firebase.google.com