Flutter Google认证插件djangoflow_auth_google的使用

🔑 DjangoFlow Auth Google Package 🔑
djangoflow_auth_google 是 djangoflow_auth 的 Google 身份验证提供程序。它允许您的 Flutter 应用程序无缝集成 Google 登录功能。使用 Google 签入功能安全地管理用户身份验证。简单有效! 🔒
🚀 特性 🚀
- 与 djangoflow_auth 集成 Google 签入。
- 为您的 Flutter 应用程序提供易于使用的 Google 身份验证 API。
- 注销功能以安全断开 Google 签入。
📦 安装 📦
注意:请遵循 google_sign_in 包进行平台相关的配置。
🔧 使用 🔧
要使用 `djangoflow_auth_google` 执行 Google 身份验证,可以使用 `GoogleSocialLogin` 类: ```dart import 'package:djangoflow_auth/djangoflow_auth.dart'; import 'package:djangoflow_auth_google/djangoflow_auth_google.dart'; import 'package:google_sign_in/google_sign_in.dart';void main() async { final googleSignIn = GoogleSignIn(scopes: [‘email’]); // 设置 Google 签入范围 final googleSocialLogin = GoogleSocialLogin(googleSignIn: googleSignIn);
// 执行 Google 签入
final googleAccount = await googleSocialLogin.login();
// 处理 Google 账户或执行进一步操作
if (googleAccount != null) {
// 成功使用 Google 登录
// 处理用户账户或继续您的应用程序
} else {
// Google 签入失败
// 处理错误
}
// 断开 Google 签入
await googleSocialLogin.logout();
}
<p>有关如何使用 <code>djangoflow_auth</code> 的详细示例,请参阅: <a href="https://pub.dev/packages/djangoflow_auth#setting-up-authcubit">https://pub.dev/packages/djangoflow_auth#setting-up-authcubit</a></p>
<h2>🌐 Google 签入按钮变体 🌐</h2>
`djangoflow_auth_google` 包提供了基于平台的不同按钮实现:
<ul>
<li><strong>Web</strong>: <strong>GoogleSignInWebButton</strong> - 自动处理 Web 平台上的 Google 签入,遵循 GSI API。(底层使用 <code>GoogleSignInButton</code>)</li>
<li><strong>移动(iOS/Android)</strong>: <strong>GoogleSignInButton</strong> - 一个可自定义的 Flutter 按钮,用于在移动平台上进行 Google 签入。</li>
</ul>
<h2>🛠️ 配置和自定义 🛠️</h2>
要在 **Web** 上自定义 Google 签入按钮的外观,您可以使用提供的 `GSIButtonConfigWrapper` 类:
```dart
import 'package:djangoflow_auth_google/djangoflow_auth_google.dart';
final config = GSIButtonConfigWrapper(
type: GSIWrapperButtonType.standard,
theme: GSIWrapperButtonTheme.filledBlue,
size: GSIWrapperButtonSize.large,
text: GSIWrapperButtonText.signinWith,
);
// 将配置传递给 Google 签入按钮
final googleSignInButton = GoogleSignInButton(
configurationWrapper: config,
onPressed: () {
// 处理按钮按下事件
},
);
您可以自定义按钮类型、主题、大小、文本、形状、徽标对齐方式、区域设置和最小宽度。
🌐 Web 上的 Google 签入按钮 🌐
对于 Web 平台,您可以使用 `GoogleSignInWebButton` 组件,该组件会检测当前用户的授权状态,并有条件地显示 Google 签入按钮或占位符。`enableSilentLogin` 参数可用于启用 Web 上的静默登录。 ```dart import 'package:djangoflow_auth_google/djangoflow_auth_google.dart'; // 使用 BlocProvider 可以这样写 final googleSignIn = (context .read<AuthCubit>() .socialLogins .getSocialLoginByProvider( ProviderEnum.googleOauth2, ) as GoogleSocialLogin) .googleSignIn;GoogleSignInWebButton( googleSignIn: googleSignIn, enableSilentLogin: true, onSignIn: (GoogleSignInAccount? googleSignInAccount) { // 处理成功的 Google 签入 }, )
<h2>🌟 示例 🌟</h2>
[示例](https://github.com/djangoflow/djangoflow-examples/tree/main/simple_auth)
<h2>👏 贡献和问题 👏</h2>
欢迎贡献、报告错误和提出功能请求!请随时提交拉取请求或在 <a href="https://github.com/djangoflow/flutter-djangoflow" rel="ugc">GitHub仓库</a> 上打开一个问题。
</section>
更多关于Flutter Google认证插件djangoflow_auth_google的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html
更多关于Flutter Google认证插件djangoflow_auth_google的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html
djangoflow_auth_google
是一个用于在 Flutter 应用中集成 Google 认证的插件。它简化了与 Google 认证的集成过程,并提供了便捷的 API 来处理用户登录和认证。
安装
首先,你需要在 pubspec.yaml
文件中添加 djangoflow_auth_google
依赖:
dependencies:
flutter:
sdk: flutter
djangoflow_auth_google: ^1.0.0 # 请使用最新版本
然后运行 flutter pub get
来安装依赖。
配置
1. 配置 Google Cloud 项目
- 前往 Google Cloud Console.
- 创建一个新的项目或选择一个现有的项目。
- 在左侧菜单中选择
API & Services
>Credentials
. - 点击
Create Credentials
并选择OAuth client ID
. - 选择应用类型为
Android
或iOS
,并填写相应的包名和 SHA-1 指纹(对于 Android)。 - 记下生成的
Client ID
和Client Secret
,稍后会在 Flutter 应用中使用。
2. 配置 Flutter 项目
Android
- 在
android/app/build.gradle
文件中,确保minSdkVersion
至少为 21。 - 在
android/app/src/main/AndroidManifest.xml
文件中,添加以下内容:
<application
android:label="YourAppName"
android:icon="@mipmap/ic_launcher">
<meta-data
android:name="com.google.android.gms.auth.api.signin.GoogleSignInOptions"
android:value="@string/default_web_client_id" />
<activity
android:name="com.google.android.gms.auth.api.signin.GoogleSignInActivity"
android:exported="true" />
</application>
iOS
- 在
ios/Runner/Info.plist
文件中,添加以下内容:
<key>CFBundleURLTypes</key>
<array>
<dict>
<key>CFBundleTypeRole</key>
<string>Editor</string>
<key>CFBundleURLSchemes</key>
<array>
<string>com.googleusercontent.apps.YOUR_CLIENT_ID</string>
</array>
</dict>
</array>
<key>LSApplicationQueriesSchemes</key>
<array>
<string>googlechrome</string>
<string>comgooglechrome</string>
</array>
使用
初始化
在 main.dart
文件中初始化 djangoflow_auth_google
:
import 'package:djangoflow_auth_google/djangoflow_auth_google.dart';
void main() async {
WidgetsFlutterBinding.ensureInitialized();
await DjangoflowAuthGoogle().initialize(
webClientId: 'YOUR_WEB_CLIENT_ID',
iosClientId: 'YOUR_IOS_CLIENT_ID',
androidClientId: 'YOUR_ANDROID_CLIENT_ID',
);
runApp(MyApp());
}
登录
使用 DjangoflowAuthGoogle().signIn()
来启动 Google 登录流程:
import 'package:djangoflow_auth_google/djangoflow_auth_google.dart';
void signIn() async {
try {
final googleUser = await DjangoflowAuthGoogle().signIn();
print('User: ${googleUser.displayName}');
print('Email: ${googleUser.email}');
print('Id: ${googleUser.id}');
} catch (e) {
print('Error: $e');
}
}
登出
使用 DjangoflowAuthGoogle().signOut()
来登出用户:
void signOut() async {
await DjangoflowAuthGoogle().signOut();
print('User signed out');
}
获取当前用户
你可以通过 DjangoflowAuthGoogle().currentUser
获取当前登录的用户:
void checkUser() {
final currentUser = DjangoflowAuthGoogle().currentUser;
if (currentUser != null) {
print('User is signed in: ${currentUser.displayName}');
} else {
print('No user is signed in');
}
}
处理认证状态
你可以使用 DjangoflowAuthGoogle().authStateChanges()
来监听用户的认证状态变化:
void listenAuthState() {
DjangoflowAuthGoogle().authStateChanges().listen((user) {
if (user != null) {
print('User is signed in: ${user.displayName}');
} else {
print('No user is signed in');
}
});
}