iOS三方登录 - Facebook登录

引言

在出海APP的开发中，集成主流社交平台的三方登录已成为必不可少的一环。Facebook 作为全球最大的社交网络平台之一，其提供的 Facebook 登录功能能够大大简化用户注册和登录流程，提高用户体验，减少流失率。对于开发者而言，接入 Facebook 登录不仅能提升用户的便捷性，还能为产品带来更广泛的用户群体。在本篇博客中，我们将介绍如何在 iOS 项目中集成 Facebook 三方登录，帮助你快速实现这一功能。

准备工作

首先，需要前往 Facebook 开发者平台注册开发者账号，并创建一个新的应用。在创建应用时，您需要填写相关的应用信息。完成应用创建后，获取用于 Facebook 登录的必要信息，包括APP ID 和 CLIENT-TOKEN。

可以在 Facebook 开发者平台完成这些步骤。

集成Facebook SDK

官方推荐使用Swift Package Manager集成，但查看

CocoaPods的方案仍然也可以安装Facebook SDK。

添加facebook-ios-sdk

需要先设置开发环境，可以选择使用Swift软件包管理工具（SPM）

在 Xcode 中，点击 File（文件）> Swift Packages（Swift 软件包）> Add Package Dependency（添加软件包依赖项）。
在出现的对话框中，输入存储库网址：GitHub - facebook/facebook-ios-sdk: Used to integrate the Facebook Platform with your iOS & tvOS apps.。
选择合适版本号。
完成提示，选择要在项目中使用的库。

配置项目Info.plist文件

在Info.plist文件中配置项目信息，可以直接采用源码的形式。

右键点击Info.plist，然后选择Open as（打开方式）-> Source Code（源代码）
将下俩的XML代码复制并粘贴到文件正文中。
在 $CFBunldeURLSchemes$ 键内的 <array><string> 中，将 APP-ID 替换为您的应用编号。
在 FacebookAppID 键内的 <string> 中，将 APP-ID 替换为您的应用编号。
在 FacebookClientToken 键内的 <string> 中，将 CLIENT-TOKEN 替换为您在应用面板设置 > 高级 > 客户端口令中找到的值。
在 FacebookDisplayName 键内的 <string> 中，将 APP-NAME 替换为您的应用名称。
如要使用任何 Facebook 对话框（如登录、分享、应用邀请等），实现将应用切换至 Facebook 应用的功能，则应用程序的 Info.plist 还需包含以下代码：

XML 复制代码

<key>CFBundleURLTypes</key>
<array>
  <dict>
  <key>CFBundleURLSchemes</key>
  <array>
    <string>fbAPP-ID</string>
  </array>
  </dict>
</array>
<key>FacebookAppID</key>
<string>APP-ID</string>
<key>FacebookClientToken</key>
<string>CLIENT-TOKEN</string>
<key>FacebookDisplayName</key>
<string>APP-NAME</string>

XML 复制代码

<key>LSApplicationQueriesSchemes</key>
<array>
  <string>fbapi</string>
  <string>fb-messenger-share-api</string>
</array>

初始化Facebook SDK

将 AppDelegate.swift 方法中的代码更换为以下代码。此代码会在启动应用时初始化 SDK，并在您执行登录或分享操作时，允许 SDK 处理原生 Facebook 应用的登录及分享。否则，用户便须登录 Facebook 才能使用应用内浏览器进行登录。

Swift 复制代码

// AppDelegate.swift
import UIKit
import FacebookCore

@UIApplicationMain
class AppDelegate: UIResponder, UIApplicationDelegate {    
    func application(
        _ application: UIApplication,
        didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?
    ) -> Bool {          
        ApplicationDelegate.shared.application(
            application,
            didFinishLaunchingWithOptions: launchOptions
        )

        return true
    }

 func application(
        _ app: UIApplication,
        open url: URL,
        options: [UIApplication.OpenURLOptionsKey : Any] = [:]
    ) -> Bool {
        ApplicationDelegate.shared.application(
            app,
            open: url,
            sourceApplication: options[UIApplication.OpenURLOptionsKey.sourceApplication] as? String,
            annotation: options[UIApplication.OpenURLOptionsKey.annotation]
        )
    }  
}

iOS 13 将打开网址的功能移到了 SceneDelegate 中。如果您使用的是 iOS 13，请将以下方法添加到 SceneDelegate 中，以便相关操作（如登录或分享等功能）可按照预期运作：

Swift 复制代码

// SceneDelegate.swift
import FacebookCore
  ...
func scene(_ scene: UIScene, openURLContexts URLContexts: Set<UIOpenURLContext>) {
    guard let url = URLContexts.first?.url else {
        return
    }

    ApplicationDelegate.shared.application(
        UIApplication.shared,
        open: url,
        sourceApplication: nil,
        annotation: [UIApplication.OpenURLOptionsKey.annotation]
    )
}

实现Facebook登录

Facebook为我们提供了一个预先设计好的Facebook登录按钮FBLoginButton，它封装了登录所需的所有流程，可以简化登录操作。但是通常情况下为了使按钮更符合自己APP的风格都会进行自定义，那么我们可以使用LoginManager类来进行登录操作。

FBLoginButton方案

要向应用添加具有 Facebook 品牌标识"登录"按钮，请将下列代码片段添加至视图控制器。

Swift 复制代码

// Add this to the header of your file, e.g. in ViewController.swift 
import FacebookLogin

// Add this to the body
class ViewController: UIViewController {
    override func viewDidLoad() {
        super.viewDidLoad()
	
        let loginButton = FBLoginButton()
        loginButton.permissions = ["public_profile", "email"]
        loginButton.center = view.center
        view.addSubview(loginButton)
    }
}

此时，应该能运行应用并使用 Facebook"登录"按钮登录。

LoginManager方案

在定义的点击事件中使用LoginManager的实例进行登录。

Swift 复制代码

import FBSDKLoginKit

let loginManager = LoginManager()

// 自定义按钮点击事件
@objc func customLoginButtonTapped() {
    loginManager.logIn(permissions: [.publicProfile, .email], from: self) { (result, error) in
        if let error = error {
            print("Error during login: \(error.localizedDescription)")
            return
        }
        
        guard let result = result, !result.isCancelled else {
            print("User cancelled login")
            return
        }

        print("Login successful, permissions: \(result.grantedPermissions)")
        // 你可以在这里处理登录成功后的逻辑
    }
}

检查当前登录状态

您的应用一次只能允许一位用户登录。我们使用 AccessToken.current 代表登录应用的每位用户。

LoginManager 会为您设置此口令，而且在设置 AccessToken.current 时，也会将其写入 Keychain 存储。

AccessToken 包含的 userID 可用于识别用户。

您应该更新视图控制器，在加载时便检查当前口令。这有助于在用户已经向您的应用授予权限后，避免不必要地重复显示登录流程：

Swift 复制代码

override func viewDidLoad() {
    super.viewDidLoad()

    if let token = AccessToken.current,
        !token.isExpired {
        // User is logged in, do work such as go to next view controller.
    }
}

结语

通过以上步骤，我们成功地在 iOS 项目中集成了 Facebook 三方登录功能。借助 Facebook 登录，用户可以更加便捷地注册和登录应用，同时也能提升用户体验。希望这篇博客能帮助你在项目中顺利实现 Facebook 登录，带来更好的用户增长与留存。