Flutter使用google賬號登錄

最近學習Flutter，項目針對海外，所以需要google登錄和Facebook等三方登錄。

今天先來看看 google 登錄的實現，網上資料略少，主要是看的官方文檔，不得不說，google的官方文檔真是詳細，還有視頻講解。(google firebase官方示例)

• 第一步 firebase中建立對應項目並開啓需要的登錄方式

1.首先在firebase的首頁點擊添加項目，創建一個新的項目

2. 輸入項目名稱

3. 開啓google analytics（分析）默認是開啓的，我們本次只講google登錄所以先不開啓。點擊創建項目

4.等待創建完成，點擊android 圖標（其他應用點擊對應圖標）

5.註冊應用（填寫對應的包名，應用別名，如果需要google登錄 需要SHA-1簽名指紋（我們就是要用google登錄，所以這個必須），獲取SHA-1的方法，我放到另外一個文章中《獲取簽名文件的SHA-1》）。

之後，下載google配置信息（google-services.json）放到對應的文件夾中

按圖片放到對應的文件夾中，我們的項目信息google的SDK會直接從這裏讀取，還是很方便的。如果修改配置，還需要從新下載替換即可。

6.給項目設置登錄方式

點擊Authentication按鈕，之後在右邊點擊開始

firebase支持多種登錄方式，我們用google 登錄舉例，點擊Google按鈕

先點右上角啓用，之後選擇一個電子郵件地址，最後點保存

如果需要添加其他登錄方式，點擊添加新提供方按鈕，添加其他登錄方式即可

至此，firebase的準備工作已經完成，下面開始本地工程的配置。

• 第二步 配置flutter 和 android 的依賴庫

1.在 android/build.gradle 文件中添加“classpath 'com.google.gms:google-services:4.3.5'”

dependencies {
        classpath 'com.android.tools.build:gradle:4.1.0'
        classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"
        classpath 'com.google.gms:google-services:4.3.5'  // new
}

2.在android/app/build.gradle文件中添加“apply plugin: 'com.google.gms.google-services'”

apply plugin: 'com.android.application'
apply plugin: 'kotlin-android'
apply from: "$flutterRoot/packages/flutter_tools/gradle/flutter.gradle"
apply plugin: 'com.google.gms.google-services'  // new

3.由於firebaseSDK的方法數過多，需要開啓Multidex，所以把minSdkVersion 提高到21以上，在android/app/build.gradle中

defaultConfig {
    applicationId "com.example.gtk_flutter"
    minSdkVersion 21  // Updated
    targetSdkVersion 30
    versionCode flutterVersionCode.toInteger()
    versionName flutterVersionName
}

4.在Flutter的pubspec.yaml的依賴中增加firebase核心SDK，驗證SDK和google登錄SDK

dependencies:
  flutter:
    sdk: flutter

firebase_core: ^1.7.0
firebase_auth: ^3.1.3
google_sign_in: ^5.2.0

點擊Pub get，獲取SDK

 

• 第三步 初始化firebase

修改main函數

void main() async {
  WidgetsFlutterBinding.ensureInitialized();//是綁定widget 框架和Flutter 引擎的橋樑 firebase需要使用到裏面的api所以先初始化一下這個
  await Firebase.initializeApp();//firebase初始化需要異步。

  runApp(const MyApp());
}

之後就可以在需要的地方使用firebase的API了

下面是個使用 google登錄的流程例子：

Future<UserCredential> signInWithGoogle() async {
    FirebaseAuth _auth = FirebaseAuth.instance;

    final GoogleSignInAccount? googleUser = await GoogleSignIn().signIn();
    print("googleUser = ${googleUser.toString()}");

    // Obtain the auth details from the request
    final GoogleSignInAuthentication googleAuth =
    await googleUser!.authentication;

    // Create a new credential
    final OAuthCredential credential = GoogleAuthProvider.credential(
      accessToken: googleAuth.accessToken,
      idToken: googleAuth.idToken,
    );
    print("credential = ${credential.toString()}");

    final UserCredential authResult = await _auth.signInWithCredential(credential);
    final User? user = authResult.user;
    print("user = ${user.toString()}");

    return await FirebaseAuth.instance.signInWithCredential(credential);
  }
}