Flutter阿里巴巴认证插件flutter_ali_auth的使用
Flutter阿里巴巴认证插件flutter_ali_auth的使用
插件简介
flutter_ali_auth
是一个基于阿里云一键登录的Flutter集成SDK插件,支持Android和iOS平台的一键登录功能。
更新历史 🌄
- 已更新到与官方同步的SDK V2.12.11 版本;
- 授权页适配夜间/暗色模式(仅全屏,弹窗模式需自定义);
目录
效果图 📷
IOS
全屏 | 底部弹窗 | 中间弹窗 |
---|---|---|
Android
全屏 | 底部弹窗 | 中间弹窗 |
---|---|---|
准备工作 🔧
请登录阿里云控制台号码认证服务分别添加IOS和Android的认证方案,从而获取到SDK的秘钥。
原生SDK代码调用顺序 🔗
// 1. 初始化获取Token实例
TokenResultListener mTokenListener = new TokenResultListener();
// 2. 初始化SDK实例
mAlicomAuthHelper = PhoneNumberAuthHelper.getInstance(context, mTokenListener);
// 3. 设置SDK密钥
mAlicomAuthHelper.setAuthSDKInfo();
// 4. 检测终端网络环境是否支持一键登录或者号码认证,根据回调结果确定是否可以使用一键登录功能
mAlicomAuthHelper.checkEnvAvailable(PhoneNumberAuthHelper#SERVICE_TYPE_LOGIN);
// 5. 若步骤4返回true,则根据业务情况,调用预取号或者一键登录接口
mAlicomAuthHelper.getLoginToken(context, 5000);
插件使用 ☄️
1. 添加监听
/// 传入回调函数 onEvent
AliAuthClient.handleEvent(onEvent: _onEvent);
/// 移除回调事件
AliAuthClient.removeHandler();
在onEvent
中监听回调并且自行进行判断:
void _onEvent(AuthResponseModel event) async {
// print(event);
}
2. 初始化SDK (initSdk)
await AliAuthClient.initSdk(
authConfig: const AuthConfig(
iosSdk: 'your-ios-sdk-key',
androidSdk: 'your-android-sdk-key',
enableLog: true,
authUIStyle: AuthUIStyle.fullScreen,
authUIConfig: FullScreenUIConfig(
backgroundColor: "#ffffff",
logoConfig: LogoConfig(),
sloganConfig: SloganConfig(),
phoneNumberConfig: PhoneNumberConfig(),
loginButtonConfig: LoginButtonConfig(),
changeButtonConfig: ChangeButtonConfig(),
checkBoxConfig: CheckBoxConfig(),
privacyConfig: PrivacyConfig(),
),
),
);
3. 一键登录获取Token (login)
try {
await AliAuthClient.login(timeout: 5.0);
} catch (e) {
// 处理异常
}
4. 其他方法
/// 关闭授权页loading
await AliAuthClient.hideLoginLoading();
/// 退出授权认证页
await AliAuthClient.quitLoginPage();
示例Demo
以下是一个完整的示例应用,展示了如何使用 flutter_ali_auth
插件:
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:flutter_ali_auth/flutter_ali_auth.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatefulWidget {
[@override](/user/override)
_MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
String _aliAuthVersion = '获取阿里云插件版本中';
[@override](/user/override)
void initState() {
super.initState();
initPlatformState();
}
Future<void> initPlatformState() async {
String aliAuthVersion;
try {
aliAuthVersion = (await AliAuthClient.version) as String? ?? '未知阿里云插件版本';
} on PlatformException {
aliAuthVersion = 'Failed to get ali auth plugin version.';
}
if (!mounted) return;
setState(() {
_aliAuthVersion = aliAuthVersion;
});
}
[@override](/user/override)
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text('flutter_ali_auth Demo'),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text('阿里云插件版本: $_aliAuthVersion'),
ElevatedButton(
onPressed: () async {
try {
await AliAuthClient.initSdk(
authConfig: const AuthConfig(
iosSdk: 'your-ios-sdk-key',
androidSdk: 'your-android-sdk-key',
enableLog: true,
authUIStyle: AuthUIStyle.fullScreen,
authUIConfig: FullScreenUIConfig(
backgroundColor: "#ffffff",
logoConfig: LogoConfig(),
sloganConfig: SloganConfig(),
phoneNumberConfig: PhoneNumberConfig(),
loginButtonConfig: LoginButtonConfig(),
changeButtonConfig: ChangeButtonConfig(),
checkBoxConfig: CheckBoxConfig(),
privacyConfig: PrivacyConfig(),
),
),
);
await AliAuthClient.login(timeout: 5.0);
} catch (e) {
// 处理异常
}
},
child: Text('一键登录'),
),
],
),
),
),
);
}
}
更多关于Flutter阿里巴巴认证插件flutter_ali_auth的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html
更多关于Flutter阿里巴巴认证插件flutter_ali_auth的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html
当然,关于Flutter阿里巴巴认证插件flutter_ali_auth
的使用,以下是一个基本的代码示例,展示了如何集成和使用这个插件进行身份验证。请注意,实际使用时需要替换一些参数(如AppKey、AppSecret等)为你自己的值。
首先,确保你已经在pubspec.yaml
文件中添加了flutter_ali_auth
依赖:
dependencies:
flutter:
sdk: flutter
flutter_ali_auth: ^最新版本号 # 替换为实际最新版本号
然后,运行flutter pub get
来安装依赖。
接下来,在你的Flutter项目中,你可以按照以下步骤使用flutter_ali_auth
插件:
- 初始化插件:
在你的Dart文件中(比如main.dart
),首先导入插件:
import 'package:flutter_ali_auth/flutter_ali_auth.dart';
- 配置插件:
在应用的初始化阶段(比如void main()
函数或者某个State的initState
方法中),配置插件的AppKey和AppSecret等信息。这里假设你已经从阿里巴巴开放平台获取了这些信息。
void main() async {
WidgetsFlutterBinding.ensureInitialized();
// 配置插件(替换为你的AppKey和AppSecret)
await FlutterAliAuth.init(
appKey: '你的AppKey',
appSecret: '你的AppSecret',
// 其他可能的配置参数(如果有的话)
);
runApp(MyApp());
}
- 调用认证功能:
在你的应用中,当需要触发阿里巴巴认证时,可以调用插件提供的认证方法。例如,这里展示一个按钮点击后触发认证的简单示例:
import 'package:flutter/material.dart';
import 'package:flutter_ali_auth/flutter_ali_auth.dart';
void main() async {
WidgetsFlutterBinding.ensureInitialized();
await FlutterAliAuth.init(
appKey: '你的AppKey',
appSecret: '你的AppSecret',
);
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text('Flutter Alibaba Auth Example'),
),
body: Center(
child: AuthButton(),
),
),
);
}
}
class AuthButton extends StatefulWidget {
@override
_AuthButtonState createState() => _AuthButtonState();
}
class _AuthButtonState extends State<AuthButton> {
void _handleAuth() async {
try {
// 调用认证方法(根据插件提供的API文档,这里可能需要传递更多参数)
var result = await FlutterAliAuth.auth();
print('认证结果: $result');
// 处理认证结果
} catch (e) {
print('认证失败: $e');
// 处理认证失败的情况
}
}
@override
Widget build(BuildContext context) {
return ElevatedButton(
onPressed: _handleAuth,
child: Text('触发阿里巴巴认证'),
);
}
}
注意:
- 上面的代码示例是基于假设的API调用,实际使用时请参考
flutter_ali_auth
插件的官方文档,因为API的具体调用方式和参数可能会有所不同。 FlutterAliAuth.auth()
方法是一个假设的调用,实际使用时应该替换为插件提供的具体认证方法。- 确保你已经按照阿里巴巴开放平台的要求配置了必要的回调URL等信息。
由于flutter_ali_auth
插件的具体API和实现可能会随时间变化,因此强烈建议查阅最新的官方文档和示例代码来获取最准确的信息。