iOS Swift – Facebook ile Giriş

Merhaba Arkadaşlar,

mobilhanem.com üzerinden anlatmakta olduğumuz mobil uygulama geliştirme derslerimize iOS Swift – Facebook ile Giriş konusunu ele alarak devam ediyoruz.

---

Facebook SDK Entegrasyon:

Yazmış olduğumuz uygulama, kullanıcı odaklı bir uygulamaysa kullanıcılar sisteme giriş yapıyor ve kendi profillerini oluşturuyorlarsa Single Sign-On günümüzde bir çok uygulama tarafından tercih edilmektedir. Facebook bu desteği ile bir çok uygulama geliştiriciye destek vermektedir. Uygulamanıza kendi giriş sisteminizi yazabileceğiniz gibi bu sistemin yanına Facebook ile Giriş sistemini de entegre edebilirsiniz. Facebook ile Giriş sistemi size bir çok alanda kolaylık sağladığı gibi session yönetimini de tamamen kendi içinde hallettiğinden kolaylıkla kullanabilirsiniz. Projeyi oluşturmadan önce isterseniz Facebook tarafında yapmamız gereken bir kaç işlemi gerçekleştirelim. Bunun için developers.facebook.com üzerinde sisteme giriş yapmanız gerekmekte, bunun için isterseniz varolan hesabınızı kullabilir, isterseniz bu işlemler için yeni bir hesap oluşturabilirsiniz.

Sisteme giriş yaptıktan sonra, açılan sayfanın en üst kısmında ki menüden Belgeler -> iOS Developers -> Download the SDK yolunu izleyerek veya buradan kolayca Facebook SDK son versiyonu indirebilirsiniz. Size tavsiyem indirmiş olduğunuz SDK dosyasını Documents klasörü aldında “FacebookSDK” ismi ile tutmanız. Bu şekilde her güncel versiyon çıktığında SDK dosyasını güncelleyebilir ve uygulamanızda bir değişiklik yapmak zorunda kalmazsınız.

Facebook SDK dosyamız ile ilgili işlemleri tamamladıktan sonra developers.facebook.com adresine tekrar dönerek sayfanın sağ üst köşede resmimizin yanında bulunan Uygulamalarım linkine tıklayıp burada “Create a New App” butonuna tıklıyoruz. Açılan ekranda gerekli alanları dolduruyoruz.

Uygulama Kodu Oluştur butonuna tıklıyoruz ve uygulamamızı oluşturuyoruz. Burada dikkat edilmesi gereken konu, uygulama için istediği Ekran adı bölümünde face, facebook vb. isim hakkı alınmış parametreler giremiyoruz. Hali hazırda sistem de buna müsade etmiyor.

Uygulama kodu oluşturulduktan sonra artık XCode ile kendi uygulamamız oluşturmaya başlayabiliriz. XCode açılış ekranında “Create a new Xcode project” dedikten sonra,

ilgili alanları dilediğimiz gibi dolduruyoruz.

 

Bu adımda Facebook Framework kullanımı için gerekli bir kaç adımı gerçekleştireceğiz. İlk olarak uygulama adını üzerine sağ tıklayarak “New Group” diyoruz ve oluşturduğumuz grup ismine Frameworks diyoruz. Projemizin daha derli toplu olması ve büyüdükçe karmaşıklaşmasının önüne geçmek için framework dosyalarımızı ayrı bir grup altında tutuyoruz. Dilerseniz direk projenin içine ekleyebilirsiniz. ~/Documents/FacebookSDK klasörü altından FBSDKCoreKit.framework ve FBSDKLoginKit.framework dosyalarını sürükle bırak yaparak Xcode içerisinde oluşturduğumuz Frameworks grubunun içine atıyoruz.

NOT: Bu dersi hazırladığım esnada Facebook’un Swift API’si halen geliştirme aşamasında olduğundan Objective-C için hazırlanmış frameworklerden faydalanıyorum. Bu sebeple ilerki adımlarda bu frameworklerden faydalanabilmek için bir kaç ekstra adım gerçekleştirmemiz gerekmektedir. Framework dosyalarını ilgili grup içerisine atarken “Copy items if needed” kısmını işaretlememenizde fayda var, daha önce bahsettiğim gibi çıkan güncel versiyonlarda her seferinde ~/Documents/FacebookSDK adresindeki verileri çekeceği için attığınız dosyaların referanslarının burada bulunması yeterli olacaktır.

XCode içerisinde proje üzerinde tıkladıktan sonra gelen ekranda General sekmesi altında “Bundle Identifier” olarak belirtilen adresi kopyalayarak

developers.facebook.com adresinde sol taraftaki menüden Ayarlar kısmına tıkladıktan sonra gelen ekranda “Platform Ekle” -> “iOS” dedikten sonra Bundle ID kısmına kopyaladığımız adresi yapıştırabiliriz.

Bundle ID değerini girdikten sonra Single Sign On seçeneğini açık hale getiriyoruz ve alt taraftan Değişiklikleri Kaydet butonuna tıklıyoruz.

Xcode içerisinde Build Setting -> Search Paths -> Framework Search Paths değerini ~/Documents/FacebookSDK olarak tanımlıyoruz.

Facebook SDK entegre işlemini gerçekleştirmek için aşağıdaki iki yöntemden birini kullanabilirsiniz.

1. Projemize yeni bir Objective-C File ekliyoruz ve ismini verdikten sonra oluştur diyoruz.

Bu adımda bize Bridging Header olarak oluşturup oluşturmayacağını soruyor ve Bridging Header oluşturmasını söylüyoruz. (Create Bridging Header)

2. Dilerseniz bu adımda direk bir Header File oluşturup ardından Build Settings -> Swift Compiler – Code Generation -> Objective-C Bridging Header alanına oluşturduğunuz Header dosyasının yolunu ve adını vererekte işlemi tamamlayabilirsiniz. (Örnek: <ProjeAdı/HeaderAdı.h)

Dosyayı oluşturduktan sonra MobilhanemGirisTest-Bridging-Header.h veya Bridging-Header.h dosyasını açıyoruz ve aşağıdaki satırları ekliyoruz.

#import <FBSDKCoreKit/FBSDKCoreKit.h>
#import <FBSDKLoginKit/FBSDKLoginKit.h>

---

Facebook ile Giriş Kodları

Yukarıda ki işlemleri problemsiz tamamladığınız takdirde AppDelegate.swift içerisinden Facebook SDK’sına ulaşabiliyor olmanız gerekmekte. Şimdi Facebook ile Giriş işlemi için gerekli kod parçalarını eklemeye başlayalım.

func application(application: UIApplication, didFinishLaunchingWithOptions launchOptions: [NSObject: AnyObject]?) -> Bool {
        return FBSDKApplicationDelegate.sharedInstance().application(application, didFinishLaunchingWithOptions: launchOptions)
}

Varolan application fonksiyonunu true döndürmek yerine yukarıdaki şekilde düzenliyoruz. Daha sonra aşağıdaki fonksiyonu ekliyoruz.

func application(application: UIApplication, openURL url: NSURL, sourceApplication: String?, annotation: AnyObject) -> Bool {
        return FBSDKApplicationDelegate.sharedInstance().application(application, openURL: url, sourceApplication: sourceApplication, annotation: annotation)
}

AppDelegate.swift içerisinde son olarak aşağıdaki kodu yazarak işlemi tamamlayabiliriz.

func applicationDidBecomeActive(application: UIApplication) {
        // Restart any tasks that were paused (or not yet started) while the application was inactive. If the application was previously in the background, optionally refresh the user interface.
        FBSDKAppEvents.activateApp()
}

AppDelegate.swift içerisinde gerekli değişiklikleri yaptıktan sonra ViewController.swift içerisinde fiziksel butonu ekleme işlemini gerçekleştiriyoruz. Bunun için aşağıdaki kodları eklememiz gerekiyor.

//
//  ViewController.swift
//  MobilhanemGirisTest
//
//  Created by Eren Başaran on 09/08/16.
//  Copyright © 2016 Mobilhanem. All rights reserved.
//

import UIKit

class ViewController: UIViewController, FBSDKLoginButtonDelegate {

    override func viewDidLoad() {
        super.viewDidLoad()

        let loginView: FBSDKLoginButton = FBSDKLoginButton()
        self.view.addSubview(loginView)
        loginView.center = self.view.center
        loginView.readPermissions = ["public_profile", "email"]
        loginView.delegate = self
    }

    func loginButton(loginButton: FBSDKLoginButton!, didCompleteWithResult result: FBSDKLoginManagerLoginResult!, error: NSError!) {
        print("User logged in")
        
        if error == nil {
            
            if result.grantedPermissions.contains("email") {
                print("Kullanıcı Bilgileri: \(result)")
                let kullaniciAd: String = result.valueForKey("name") as! String
                print("Kullanıcı Adı: \(kullaniciAd)")
            }
            
        } else {
            
        }
    }
    
    func loginButtonDidLogOut(loginButton: FBSDKLoginButton!) {
        print("User logged out!")
    }
    
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }
}

ViewController.swift üzerinde değişiklikleri tamamladıktan sonra Info.plist dosyası üzerinde aşağıdaki eklemeleri yapmamız gerekiyor. FacebookAppID değerine developers.facebook.com sayfasında Uygulama  Kodu bölümünden ulaşabilirsiniz.

<key>FacebookAppID</key>
	<string>(Uygulama Kodu)</string>
	<key>FacebookDisplayName</key>
	<string>MobilhanemGirisTest</string>
	<key>LSApplicationQueriesSchemes</key>
	<array>
		<string>fbapi</string>
		<string>fbauth2</string>
	</array>
	<key>CFBundleURLTypes</key>
	<array>
		<dict>
			<key>CFBundleURLSchemes</key>
			<array>
				<string>fb(Uygulama Kodu)</string>
			</array>
		</dict>
	</array>

İşlemleri gerçekleştirdikten sonra uygulamamızı çalıştırıyoruz, varsayılan Facebook Login butonu uygulamamız içerisinde gözüküyor.

 

Ekrandaki butona tıkladığımızda bizi eğer Facebook yüklü ise uygulamaya eğer yüklü değilse Safari tarayıcısından Facebook web sayfasına yönlendiriyor. İlk kez giriş yapılan uygulamalarda giriş izni vermek ve uygulamayı yetkilendirmek gerekmekte

sonraki giriş işlemlerinde sadece onay verilerek giriş sağlanabiliyor.

Facebook ile Giriş işlemi tamamlandıktan sonra ekranda Facebook Çıkış butonu görünmektedir.

---

 

Karşılaşılabilecek muhtemel hatalar:

1.Uygulama Ayarlanamadı (App not setup)

Eğer kodu yazıp çalıştırdıktan sonra facebook tarafından bu tarz bir hata ile karşılaşırsanız aşağıdaki adımları uygulamanız gerekmektedir.

developers.facebook.com sayfasını açtıktan sonra soldaki menüden;

Ayarlar -> İletişim E-Posta Adresi 

kısmına geçerli bir mail adresi girdikten sonra,

Uygulama İncelemesi -> Herkese Açık Yap: 1 konumuna getirmelisiniz.

2.Kullanıcının uygulamayı görmeye izni yok (The user is not allowed to see this application…)

Eğer bu şekilde bir hata alırsanız, simülatörden veya test ettiğiniz cihazdan bu uygulamada yetkilendirilmemiş bir kullanıcı ile facebook hesabı açılmış demektir. Bu hatayı önlemek için facebook uygulamına giriş çıkış yapmak veya safari ile m.facebook.com adresine bağlanarak bağlı hesaptan çıkış yapmak gerekmektedir.

Örnek kodun tamamına GitHub üzerinden ulaşabilirsiniz.

Konu ile ilgili sorularınızı konu altından sorabilirsiniz. Konu dışı sorularınızı ise http://sorucevap.mobilhanem.com sitemiz üzerinden bizlere iletebilirsiniz.

0