現在很多應用程式都會使用 Facebook SDK 來加入 Facebook 功能
這有幾大主要原因
其一是基本上有用智能手機的用家都有至少一個 Facebook 帳號, 因此不用特意再去註冊普通帳號, 直接拿 Facebook 的 fbid 來當帳號, 就可以省去了用家在註冊上的麻煩了
其二是使用分享邀請等功能, 在社交平台上作宣傳, 省去了一筆費用
要使用 Facebook 登入, 首先要下載 Facebook SDK 及建立申請 Facebook App
詳情請看【iOS/Facebook】Facebook SDK 在 iOS 上的設定及事前準備
然後把 FBSDKLoginKit.framework 拖入xcode project 裡
設定完成後, 就可以開始嵌入 Facebook Login 了!
在需要加入 Login Button 的 Class 裡, 都需要 import FBSDKCoreKit.h 及 FBSDKLoginKit.h
夜雪在這篇文章裡使用的 class 是 viewController
在 viewController.h 裡
Import FBSDKCoreKit.h 及 FBSDKLoginKit.h
#import <FBSDKCoreKit/FBSDKCoreKit.h>
#import <FBSDKLoginKit/FBSDKLoginKit.h>
宣告Button
@property (weak, nonatomic) IBOutlet FBSDKLoginButton *loginButton;
加入後 viewController.h 應該是這樣子的~
然後在 viewController.m 裡
加入@synthesize
@synthesize loginButton;
--------------------------------------
【預設 Facebook Login Button】
打開 viewController.m
在 viewDidLoad 裡加入 Facebook Login Button
loginButton = [[FBSDKLoginButton alloc] init];
// Optional: Place the button in the center of your view.
loginButton.center = self.view.center;
[self.view addSubview:loginButton];
然後要問取權限 (要用家確認了權限才能拿到用家的資料喔)
loginButton.readPermissions =
@[@"public_profile", @"email", @"user_friends"];
加入後 viewController.m 應該是這樣子的~
預設的 Facebook Login Button 就完成了!
我們來看看樣子~~
--------------------------------------
【自定義 Login Button (不使用Storyboard)】
很多開發者都不會用預設的 Facebook Login Button, 我想可能是因為設計或是美觀上的問題吧? 因為夜雪都不太喜歡使用預設的東東啊...呵呵~
接下來介紹一下自定義 Login Button , 先說說不使用 Storyboard 的做法吧~
打開 viewController.m
在 viewDidLoad 裡建立及自定義一個 Button , 然後把他設定成按下後會跳去 loginButtonClicked 這個 function
UIButton *myLoginButton=[UIButton buttonWithType:UIButtonTypeCustom];
myLoginButton.backgroundColor=[UIColor darkGrayColor];
myLoginButton.frame=CGRectMake(0,0,180,40);
myLoginButton.center = self.view.center;
[myLoginButton setTitle: @"My Login Button" forState: UIControlStateNormal];
// Handle clicks on the button
[myLoginButton
addTarget:self
action:@selector(loginButtonClicked) forControlEvents:UIControlEventTouchUpInside];
// Add the button to the view
[self.view addSubview:myLoginButton];
然後可以建立 loginButtonClicked function
我們在這個 function 裡使用 FBSDKLoginManager 處理 Facebook Login
-(void)loginButtonClicked
{
FBSDKLoginManager *login = [[FBSDKLoginManager alloc] init];
[login
logInWithReadPermissions: @[@"public_profile", @"email", @"user_friends"]
fromViewController:self
handler:^(FBSDKLoginManagerLoginResult *result, NSError *error) {
if (error) {
NSLog(@"Process error");
} else if (result.isCancelled) {
NSLog(@"Cancelled");
} else {
NSLog(@"Logged in");
}
}];
}
這就完成了!
--------------------------------------
【自定義 Login Button (使用Storyboard)】
使用 Storyboard 是更簡單, 方便, 快捷的!
我們只需要在 Storyboard 裡拖出一個 Button, 然後 Ctrl + drag 到空白地方再放手
之後在 Connection 選擇 Action, name 打 自定義的 function 名稱
facebookLogin 是 夜雪自定義的 function 名稱啊~
然後這個 function 的內容啊..就跟 【自定義 Login Button (不使用 Storyboard)】裡的 loginButtonClicked 內容相同的啊~很簡單對吧~呵呵~
--------------------------------------
【Access Token】
當用家成功登入後, Facebook 會回傳一個 Access Token 回來的~
沒有 Access Token, 就拿不到用家的資料, 什麼也做不了~
拿取 Access Token 的方法是:
Facebook SDK 版本是 4.1 之前
NSString *fbAccessToken = [[[FBSession activeSession] accessTokenData] accessToken];
4.1 或之後
NSString *fbAccessToken = [FBSDKAccessToken currentAccessToken].tokenString;
--------------------------------------
【登入後拿取用家基本資料】
拿取玩家資料, 剛剛也說過了, 首先要有 Access Token ~
找個 function 裝著而下一段, 又或是放在剛剛我們建立的 loginButtonClicked 的 NSLog(@"Logged in"); 下面
[[[FBSDKGraphRequest alloc] initWithGraphPath:@"me" parameters:@{@"fields": @"id, name, email"}] startWithCompletionHandler:^(FBSDKGraphRequestConnection *connection, id result, NSError *error1) {
if(!error1){
NSLog(@"user fbid:%@", [result objectForKey:@"id"]);
NSLog(@"user name:%@", [result objectForKey:@"name"]);
NSLog(@"accessToken:%@", [[FBSDKAccessToken currentAccessToken] tokenString]);
}else{
NSLog(@"error");
}
}];
這裡其實是使用了 Facebook 的 Graph API, 基本上要拿取資料就會用到 Graph API 的
至於拿取什麼資料, 就在 parameters:@{@"fields": @"id, name, email"} 這裡輸入, 現在這裡請求的就是用家的 fbid, name 及 email 了~
--------------------------------------
【Logout】
使用預設 Login Button 的朋友可以不用理會~因為預設的已經弄了 Logout 功能啊~
首先要先檢查用家有沒有登入~
有的使用 FBSDKMAnager 的 logOut function 就可以了
把 loginButtonClicked 改成
FBSDKLoginManager *login = [[FBSDKLoginManager alloc] init];
if([FBSDKAccessToken currentAccessToken]){
[login logOut];
NSLog(@"Logout");
}else{
[login
logInWithReadPermissions: @[@"public_profile", @"email", @"user_friends"]
fromViewController:self
handler:^(FBSDKLoginManagerLoginResult *result, NSError *error) {
if (error) {
NSLog(@"Process error");
} else if (result.isCancelled) {
NSLog(@"Cancelled");
} else {
NSLog(@"Logged in");
}
}];
}
就能成功登出了!
****************
注意:logOut function只是把 Access Token 清掉而已, 所以再按登入時是沒有地方讓你輸入帳號和密碼的
原因嘛...那是因為現在的 Facebook 是跟 Safari 用同一個 cookie 的, 所以如果要真正的 Logout 讓別的用家登入啊, 是需要去 Safari 那邊 Logout 的喔
****************
有時候可能會出現 canOpenURL: failed for URL: "fbauth2:/" - error: "(null)" 這個錯誤訊息的
但如果已經在 plist 設定了 LSApplicationQueriesSchemes, 那就不需要理會了~
****************