Flutter简化登录流程插件easy_sign_in的使用

Flutter简化登录流程插件easy_sign_in的使用

特性

它帮助简化设置Google登录及其他未来更多登录提供商。

使用

请参阅完整的设置步骤。

在example文件夹中，您可以找到以下示例代码：

import 'package:easy_sign_in/provider/google/auth_services.dart';
import 'package:flutter/material.dart';

// 按照设置步骤进行操作，非常重要

void main() {
  runApp(
    const MaterialApp(
      home: MyApp(),
    ),
  );
}

class MyApp extends StatefulWidget {
  const MyApp({super.key});

  [@override](/user/override)
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: ElevatedButton(
          onPressed: () {
            EasyAuthManager().signInWithGoogle();
          },
          child: const Text('登录'),
        ),
      ),
    );
  }
}

更多关于Flutter简化登录流程插件easy_sign_in的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter简化登录流程插件easy_sign_in的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


easy_sign_in 是一个简化 Flutter 登录流程的插件，支持多种第三方登录方式（如 Google、Facebook、Apple 等）。使用这个插件可以大大减少开发者处理登录逻辑的工作量。以下是如何使用 easy_sign_in 插件的步骤：

1. 添加依赖

首先，在 pubspec.yaml 文件中添加 easy_sign_in 依赖：

dependencies:
  flutter:
    sdk: flutter
  easy_sign_in: ^latest_version

然后，运行 flutter pub get 来安装依赖。

2. 配置平台

根据你使用的登录方式，可能需要配置不同的平台。

2.1 Google 登录

在 android/app/src/main/AndroidManifest.xml 中添加以下内容：

<meta-data
    android:name="com.google.android.gms.version"
    android:value="@integer/google_play_services_version" />

在 ios/Runner/Info.plist 中添加以下内容：

<key>CFBundleURLTypes</key>
<array>
    <dict>
        <key>CFBundleTypeRole</key>
        <string>Editor</string>
        <key>CFBundleURLSchemes</key>
        <array>
            <string>YOUR_REVERSED_CLIENT_ID</string>
        </array>
    </dict>
</array>

2.2 Facebook 登录

在 android/app/src/main/AndroidManifest.xml 中添加以下内容：

<meta-data
    android:name="com.facebook.sdk.ApplicationId"
    android:value="@string/facebook_app_id" />

在 ios/Runner/Info.plist 中添加以下内容：

<key>CFBundleURLTypes</key>
<array>
    <dict>
        <key>CFBundleURLSchemes</key>
        <array>
            <string>fbYOUR_FACEBOOK_APP_ID</string>
        </array>
    </dict>
</array>
<key>FacebookAppID</key>
<string>YOUR_FACEBOOK_APP_ID</string>
<key>FacebookDisplayName</key>
<string>YOUR_FACEBOOK_DISPLAY_NAME</string>

3. 初始化插件

在 main.dart 中初始化 easy_sign_in 插件：

import 'package:easy_sign_in/easy_sign_in.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await EasySignIn.initialize();
  runApp(MyApp());
}

4. 使用插件进行登录

在需要登录的地方，调用 EasySignIn 提供的登录方法。例如，使用 Google 登录：

import 'package:easy_sign_in/easy_sign_in.dart';

class LoginScreen extends StatelessWidget {
  Future<void> _signInWithGoogle() async {
    try {
      final user = await EasySignIn.signInWithGoogle();
      print('User: ${user.displayName}');
    } catch (e) {
      print('Error: $e');
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Login'),
      ),
      body: Center(
        child: ElevatedButton(
          onPressed: _signInWithGoogle,
          child: Text('Sign in with Google'),
        ),
      ),
    );
  }
}

5. 处理登录结果

EasySignIn.signInWithGoogle() 返回一个 User 对象，你可以从中获取用户的详细信息，如 displayName、email、photoUrl 等。

6. 登出

如果需要登出，可以调用 EasySignIn.signOut() 方法：

Future<void> _signOut() async {
  await EasySignIn.signOut();
}

7. 其他登录方式

easy_sign_in 还支持其他登录方式，如 Facebook、Apple 等。使用方法类似，只需调用相应的方法即可：

// Facebook 登录
final user = await EasySignIn.signInWithFacebook();

// Apple 登录
final user = await EasySignIn.signInWithApple();

8. 处理错误

在登录过程中可能会遇到各种错误，建议在调用登录方法时使用 try-catch 来捕获并处理这些错误。

try {
  final user = await EasySignIn.signInWithGoogle();
} catch (e) {
  print('Error: $e');
}

9. 自定义 UI

easy_sign_in 提供了默认的登录按钮，但你可以根据需要自定义 UI。例如，使用自定义按钮来触发登录：

ElevatedButton(
  onPressed: _signInWithGoogle,
  child: Text('Custom Sign in with Google'),
),
回到顶部