Swift 4 ile Firebase Storage Kullanımı
Firebase Kütüphanesinin sunmuş olduğu Storage kullanımı sayesinde istediğimiz resmi depolama ve uygulamamızda gösterme olanağı sağlamaktadır. Bizde bu makalemizde basit bir uygulama yaparak nasıl yapabileceğimize bakalım. Öncelikle kullanacağımız Firebase Kütüphanesinin kurulumunun anlatıldığı bu makaleme ve Firebase Authentication anlatımının yapıldığı bu makaleme göz atmanızı tavsiye ederim.
Kurulum videosunun anlatıldığı videoya göre ayarlamalarımızı yapalım sadece proje oluşuturuken Single View App yerine Tabbed App seçeneğini seçerek projemizi oluşturmaya dikkat edelim.
Firebase Authentication işlemlerini yapabilmemiz için aşağıdaki gibi aktif etmemiz gerekiyor.
Firebase Storage işlemini gerçekleştirebilmemiz için “media” adlı klasör oluşturuyoruz medyalarımızı bu klasör altında depolayacağız. Aşağıdaki şekilde oluşturuyoruz.
Projemizin genel şeması aşağıdaki gibi olacaktır.
Uygulamaya giriş yapan kişi öncelikle kayıt olacak kayıtlı ise giriş yapıp FirstViewController sayfasında resim yükleme işlemini gerçekleştirecek SecondViewController sayfasında resimler görüntülenecek uygulamanan genel işleyiş mantığı bu şekilde olacak. Öncelikle Authentication işlemini nasıl yapabileceğimize bakalım.
GirisVC.swift
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 |
// // GirisVC.swift // firebaseStorageIslemleri // // Created by Esat Gözcü on 26.11.2017. // Copyright © 2017 Esat Gözcü. All rights reserved. // import UIKit import Firebase import FirebaseAuth class GirisVC: UIViewController { @IBOutlet weak var passText: UITextField! @IBOutlet weak var mailText: UITextField! override func viewDidLoad() { super.viewDidLoad() } @IBAction func signInButton(_ sender: Any) { if mailText.text != "" && passText.text != ""{ //Kullanıcı ve şifre boş değil ise.. //signIn() ile kullanıcıyı kayıt ediyoruz Auth.auth().signIn(withEmail: mailText.text!, password: passText.text!, completion: { (user, error) in if error != nil { let alert = UIAlertController(title: "Error", message: error?.localizedDescription, preferredStyle: UIAlertControllerStyle.alert) let okButton = UIAlertAction(title: "OK", style: UIAlertActionStyle.cancel, handler: nil) alert.addAction(okButton) self.present(alert, animated: true, completion: nil) } else{ //Herhangi bir hata olmazsa kayıt yapıldı demektir //Segue çalışacak ve diğer sayfaya geçiş yapılacak self.performSegue(withIdentifier: "signSegue", sender: nil) } }) } else{ //Kullanıcı ve Şifre Boş Bırakılırsa //AlertDialog oluşturuyoruz let alert = UIAlertController(title: "Dikkat!", message: "Kullanıcı Adı ve Şifre Gerekli", preferredStyle: UIAlertControllerStyle.alert) let okButton = UIAlertAction(title: "OK", style: UIAlertActionStyle.cancel, handler: nil) alert.addAction(okButton) self.present(alert, animated: true, completion: nil) } } @IBAction func signUpButton(_ sender: Any) { if mailText.text != "" && passText.text != ""{ //Kullanıcı ve şifre boş değil ise.. //createUser() ile kullanıcıyı kayıt ediyoruz Auth.auth().createUser(withEmail: mailText.text!, password: passText.text!, completion: { (user, error) in if error != nil{ //Sistemsel bir hata olursa AlertDialog oluşturuyoruz //Örneğin şifre 6 haneden azsa Firebase otomatik hatayı bastıracaktır let alert = UIAlertController(title: "Error", message: error?.localizedDescription, preferredStyle: UIAlertControllerStyle.alert) let okButton = UIAlertAction(title: "OK", style: UIAlertActionStyle.cancel, handler: nil) alert.addAction(okButton) self.present(alert, animated: true, completion: nil) } else{ //Herhangi bir hata olmazsa kayıt yapıldı demektir //Segue çalışacak ve diğer sayfaya geçiş yapılacak self.performSegue(withIdentifier: "signSegue", sender: nil) } }) } else{ //Kullanıcı ve Şifre Boş Bırakılırsa //AlertDialog oluşturuyoruz let alert = UIAlertController(title: "Dikkat!!", message: "Kullanıcı Adı ve Şifre Gerekli", preferredStyle: UIAlertControllerStyle.alert) let okButton = UIAlertAction(title: "OK", style: UIAlertActionStyle.cancel, handler: nil) alert.addAction(okButton) self.present(alert, animated: true, completion: nil) } } } |
Kullanıcımız giriş yaptıktan sonra resimleri nasıl yükleyebileceğine bakalım.
SecondViewController.swift
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 |
// // SecondViewController.swift // firebaseStorageIslemleri // // Created by Esat Gözcü on 26.11.2017. // Copyright © 2017 Esat Gözcü. All rights reserved. // import UIKit import Firebase import FirebaseStorage import FirebaseDatabase class SecondViewController: UIViewController ,UIImagePickerControllerDelegate, UINavigationControllerDelegate{ var uuid = NSUUID().uuidString @IBOutlet weak var resimView: UIImageView! override func viewDidLoad() { super.viewDidLoad() //Tıklanabilirliği aktif hale getiriyoruz resimView.isUserInteractionEnabled = true let recognizer = UITapGestureRecognizer(target: self, action: #selector(SecondViewController.choosePhoto)) resimView.addGestureRecognizer(recognizer) } @objc func choosePhoto() { let picker = UIImagePickerController() picker.delegate = self //Kamerayıda seçebiliriz picker.sourceType = .camera //Resim galerisine gidiyoruz picker.sourceType = .photoLibrary //Fotoğrafı düzenlemeyi aktif hale getiriyoruz picker.allowsEditing = true present(picker,animated: true,completion: nil) } func imagePickerController(_ picker: UIImagePickerController, didFinishPickingMediaWithInfo info: [String : Any]) { //Resimi seçtikten sonra.. resimView.image = info[UIImagePickerControllerEditedImage] as? UIImage self.dismiss(animated: true, completion: nil) } @IBAction func postButton(_ sender: Any) { //Klasörümüzü tanımlıyoruz let mediaFolder = Storage.storage().reference().child("media") //Resmimizi dataya çeviriyoruz if let data = UIImageJPEGRepresentation(resimView.image!, 0.5) { mediaFolder.child("\(uuid).jpg").putData(data, metadata: nil, completion: { (metadata, error) in if error != nil{ //Eğer datayı kayıt ederken hata oluşursa //AlertDialog oluşturup hatayı bastırıyoruz let alert = UIAlertController(title: "error", message: error?.localizedDescription, preferredStyle: UIAlertControllerStyle.alert) let okButton = UIAlertAction(title: "OK", style: UIAlertActionStyle.cancel, handler: nil) alert.addAction(okButton) self.present(alert,animated: true, completion: nil) } else{ //Hata yoksa datayı kayıt ediyoruz(Storage) let imageURL = metadata?.downloadURL()?.absoluteString //Database kayıt ediyoruz(Database) let post = ["image": imageURL!] as [String : Any] Database.database().reference().child("resimler").childByAutoId().setValue(post) //Resim yüklendikten sonra resimView'i eski haline döndürüyoruz self.resimView.image = UIImage(named: "resimyukle.jpg") //Resimlerin gösterileceği yere geçiş yapıyoruz self.tabBarController?.selectedIndex = 0 } }) } } } |
Resim yükleme işlemi tamamlandıktan sonra bizi otomatik bir şekilde resimlerin gösterildiği FirstViewController sayfasına yönlendirecek. Database yüklediğimiz resimleri nasıl görüntüleyebileceğimize bakalım.
FirstViewController.swift
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 |
// // FirstViewController.swift // firebaseStorageIslemleri // // Created by Esat Gözcü on 26.11.2017. // Copyright © 2017 Esat Gözcü. All rights reserved. // import UIKit import Firebase import FirebaseDatabase //Resimlerin url olarak indirip sayfamızda gözümeksini sağlayan framework'ü dahil ediyoruz import SDWebImage class FirstViewController: UIViewController ,UITableViewDelegate , UITableViewDataSource{ @IBOutlet weak var tableView: UITableView! var resimArray = [String]() override func viewDidLoad() { super.viewDidLoad() tableView.delegate = self tableView.dataSource = self resimdata() } func resimdata(){ //Veritabanından resimlerin linkine çekiyoruz Database.database().reference().child("resimler").observe(DataEventType.childAdded) { (snapchat) in let values = snapchat.value! as! NSDictionary for _ in values { let resim = values["image"] //resimArraye resimlerin linkleri tek tek ekliyoruz self.resimArray.append(resim as! String) } self.tableView.reloadData() } } func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int { //tableView satır sayısını döndürüyoruz return resimArray.count } func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { //Satırlarda ne olacağını belirliyoruz let cell = tableView.dequeueReusableCell(withIdentifier: "Cell", for: indexPath) as! feedCell //resimArray'deki resimleri cell'lere aktarıyoruz //Url biçimindeki resimleri sayfada göstermemize olanak sağlıyor cell.postImage.sd_setImage(with: URL(string: self.resimArray[indexPath.row])) return cell } } |
İmport kısmında SDWebImage adlı bir freamwork kullandığımızı fark etmişsinizdir. Bu freamwork link şeklinde olan resimleri indirip otomatik bir şekilde uygulamamızda gösterme olanağı sağlamaktadır. Kullanımı çok kolay olan bu freamwork’ün kurulumuda oldukça kolaydır. Öncelikle kurulumunun ve kullanımının anlatıldığı siteye buraya tıklayarak göz atabilirsiniz. Kurulum aşamasında yaptığımız gibi Podfile klasörünü açıp aşağıdaki satırı Firebase satırlarının altına yapıştırıyoruz.
|
1 |
pod 'SDWebImage/WebP' |
Terminalde dosyanın konumunu açıp “pod install” komutunu çalıştırdığımız zaman SDWebImage adlı freamwork’ün yüklendiğini göreceksiniz. Son olarak info.plist adlı dosyamızda sağ tıklayıp “Add Row” diyerek “Privacy – Photo Library Usage Description” fotoğraf galerisine ulaşma iznini ekliyoruz.Böylelikle Firebase Kütüphanesini kullanara Storage işlemlerin nasıl yapabileceğimizi görmüş olduk.
Projenin kaynak kodunu buraya tıklayarak indirebilirsiniz.
