Firebase, iOS Auth설정 #Facebook
Firebase Auth Facebook 로그인 연동 알아보기.
* 이글은 Swift 3.0 , Firebase 3.12.0, FacebookLogin 0.2.0 를 기준으로 작성하였습니다.
Firebase 에서는 인증을 위한 방법으로 아래와 같은 로그인 방법을 지원한다.
이메일/비밀번호, Google, Facebook, Twitter, Github, 익명
이 포스트 에서는 facebook Auth 설정을 해보겠다.
Facebook app sdk 등의 환경 설정
기본 준비물로 facebook 앱을 만들어 두자. facebook 개발자 링크
구글은 활성화만 하면 되고, facebook 은 아래의 화면에 앱 ID 와 앱 비밀번호를 설정하자.
facebook 앱 대시보드에서 확인 가능하다.
설정을 완료하려면 이 OAuth 리디렉션 URI를 Facebook 앱 구성에 추가하세요.
아래 적힌 URI 를 설정하는 법은 아래 설명하겠다.
자 이제 이전 포스트에서 만든 iOS XCode 프로젝트로 돌아오자.
Podfile 을 아래와 같이 수정하자.
Firebase Auth 및 Facebook swift 용 sdk를 설정한다.
platform :ios, '10.0'
source 'https://github.com/CocoaPods/Specs.git'
target '(TargetName)' do
use_frameworks!
pod 'Firebase/Database'
pod 'Firebase/Auth'
pod 'FacebookCore'
pod 'FacebookLogin'
pod 'FacebookShare'
end
pod install로 설치하자.
facebook 앱 설정에서 facebook login 설정 단계는 아래와 같다.
https://developers.facebook.com/apps/앱아이디/dashboard/
위 링크에서 앱아이디에 자신의 facebook app id 를 넣고 접속하면 아래와 같은 화면이 보인다.
Add Product 를 누르고, Facebook 로그인 시작하기를 눌러 product 를 만들자.
그럼 아래와 같은 화면을 볼수 있다.
위쪽 Firebase Facebook Login 관련 설정쪽에서 "설정을 완료하려면 이 OAuth 리디렉션 URI를 Facebook 앱 구성에 추가하세요." 에서 적혀있는 URI 를 위 유효한 OAuth 리디렉션 URI 에 붙여넣고 저장하자.
Facebook SDK 의 설정은 https://developers.facebook.com/docs/ios/getting-started/ 를 참고하자.
info.plist 에 아래와 같이 구성되어있다면 된다.
자 이제 firebase facebook auth 를 테스트할 준비가 끝났다.
준비 작업
AppDelegate 에서 아래부분을 추가하자.
import Firebase
import FBSDKCoreKit
func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool {
// Override point for customization after application launch.
// 이전포스트에서 수행했으므로 있다면 무시.
FIRApp.configure()
return true
}
func application(_ app: UIApplication, open url: URL, options: [UIApplicationOpenURLOptionsKey : Any] = [:]) -> Bool {
return FBSDKApplicationDelegate.sharedInstance().application(
app,
open: url as URL!,
sourceApplication: options[UIApplicationOpenURLOptionsKey.sourceApplication] as! String,
annotation: options[UIApplicationOpenURLOptionsKey.annotation])
}
(iOS 10 이전 버전을 위해 아래도 구현해둔다.)
func application(_ application: UIApplication, open url: URL, sourceApplication: String?, annotation: Any) -> Bool {
return FBSDKApplicationDelegate.sharedInstance().application(
application,
open: url as URL!,
sourceApplication: sourceApplication,
annotation: annotation)
}
URL 처리는 로그인에서 유저가 앱을 승인하면 핸들링 하기 위함이다.
FBSDKLoginButton 을 사용한 로그인
자 이제 페이스북 로그인 버튼을 만들어서 테스트 해보자.
ViewController 에서 아래와 같이 추가한다.
import FBSDKCoreKit
import FacebookLogin
import Firebase
override func viewDidLoad() {
super.viewDidLoad()
let loginButton = FBSDKLoginButton()
loginButton.center = view.center
loginButton.delegate = self
view.addSubview(loginButton)
}
func loginButton(_ loginButton: FBSDKLoginButton!, didCompleteWith result: FBSDKLoginManagerLoginResult!, error: Error!) {
let credential = FIRFacebookAuthProvider.credential(withAccessToken: FBSDKAccessToken.current().tokenString)
FIRAuth.auth()?.signIn(with: credential) { (user, error) in
print("sign in")
}
}
func loginButtonDidLogOut(_ loginButton: FBSDKLoginButton!) {
}
위의 파란색 부분이 firebase 에서 페이스북 로그인 성공후 access token 을 가지고 인증을 하는 코드이다.
Custom UIButton 을 사용한 로그인
- (FBSDKLoginManager 사용)
FBSDKLoginButton 가 아닌 Custom UIButton 을 사용하고 싶다면 아래와 같이 로그인 처리를 하자.
UIButton 이 눌리면 facebookLogin 함수를 호출한다.
func facebookLogin() {
let fbLoginManager : FBSDKLoginManager = FBSDKLoginManager()
fbLoginManager.logIn(withReadPermissions: ["email"], from: self) { (result, error) -> Void in
if error != nil {
NSLog("Process error")
}
else if result?.isCancelled == true {
NSLog("Cancelled")
}
else {
NSLog("Logged in")
self.getFBUserData()
}
}
}
func getFBUserData(){
if((FBSDKAccessToken.current()) != nil){
FBSDKGraphRequest(graphPath: "me", parameters: ["fields": "id, name, first_name, last_name, picture.type(large), email"]).start(completionHandler: { (connection, result, error) -> Void in
if (error == nil){
//everything works print the user data
print(result)
}
})
}
}
인증 토큰을 사용해서 firebase 에 sign in 한다.
let credential = FIRFacebookAuthProvider.credential(withAccessToken: FBSDKAccessToken.current().tokenString)
FIRAuth.auth()?.signIn(with: credential, completion: { (user, error) in
})
로그아웃
로그아웃은 아래의 코드로 한다.
try! FIRAuth.auth()!.signOut()
자 이제 이전 포스트에서 인증때문에 실패했던 과정을 다시 진행해보자.
firebase database rule을 다시 "auth != null" 상태로 read write 를 설정하자.
{
"rules": {
"test": {
".read": "auth != null",
".write": "auth != null"
}
}
}
Fireabase Database 테스트
ViewController 에서 테스트 코드를 아래와 같이 작성하자
override func viewDidLoad() {
super.viewDidLoad()
try! FIRAuth.auth()!.signOut()
let loginButton = FBSDKLoginButton()
loginButton.center = view.center
loginButton.delegate = self
view.addSubview(loginButton)
firebaseWriteTest() // 첫번째 write 시도.
}
func firebaseWriteTest(){
let ref = FIRDatabase.database().reference()
let itemsRef = ref.child("test")
itemsRef.setValue(["Name":"Tilltue"])
}
func loginButton(_ loginButton: FBSDKLoginButton!, didCompleteWith result: FBSDKLoginManagerLoginResult!, error: Error!) {
let credential = FIRFacebookAuthProvider.credential(withAccessToken: FBSDKAccessToken.current().tokenString)
FIRAuth.auth()?.signIn(with: credential) { (user, error) in
print("sign in")
self?.firebaseWriteTest()
}
}
테스트를 위해 로그인 전에 이전 firebase 로그인 상태를 logout 으로 초기화 한다.
그리고 write 를 불러본다.
[FirebaseDatabase] setValue: or removeValue: at /test failed: permission_denied
결과는 위와 같이 권한 오류가 난다.
facebook login 버튼을 눌러 로그인 된뒤 firebase 로그인 코드에서 위와 같이 다시 write 를 시도하자.
Facebook 로그인으로 firebase Auth 가 연동되어 에러없이 잘써진다.
이제 facebook 으로 로그인한 유저는 firebase 에 read write 를 할수있게 설정되었다.
다음 포스트에서는 구글 로그인 firebase Auth 연동에 대해서 알아보자.
