前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >Flutter登录功能之Apple登录

Flutter登录功能之Apple登录

原创
作者头像
Luoyger
发布2024-08-05 17:22:25
2320
发布2024-08-05 17:22:25
举报
文章被收录于专栏:移动应用开发

远端配置

注册账号

注册Apple开发者账号,费用是99美元/年,可人民币支付。

https://developer.apple.com/account

创建应用

创建应用可以在Web端操作,也可以在Xcode操作,如下演示的是在Xcode中进行操作。

RunnerSigning & Capabilities中Team选择开发者账号,若没有,点加号进行登录。

点击+Capability搜索Sign inPush选择登录和消息推送能力。

(可选)如果使用Firebase进行Apple登录,则可以添加Apple登录方法。

如果是在Apple平台使用Apple登录,则不需要填写其它配置,直接启用即可。

Flutter项目开发配置

如果使用Firebase进行Apple登录,则不需要引用sign_in_with_apple插件,需要引用firebase_auth插件,关于Firebase的使用,参考Google登录

引用插件

插件的地址如下:

https://pub.dev/packages/sign_in_with_apple

pubspec.yaml中依赖配置如下:

代码语言:javascript
复制
sign_in_with_apple: ^6.1.1

# 非必需
auth_buttons: ^3.0.3 # 登录按钮样式

添加登录按钮

添加Apple登录按钮,可以自己定义样式,也可以使用auth_buttons插件提供的按钮AppleAuthButton,更多按钮可以参考该插件的介绍页面。

以下代码中Platform.isIOS判断了当前平台是否是iOS,如果是,才显示Apple登录按钮。

代码语言:javascript
复制
if (Platform.isIOS)
  AppleAuthButton(
    onPressed: () async {
      if (await signInWithApple()) {
        Navigator.pushAndRemoveUntil(
          context,
          MaterialPageRoute(builder: (context) => const MyHomePage()),
          (route) => false,
        );
      }
    },
  ),

登录的业务代码如下,注意调用登录的时候不要使用开发者账号,否则拿不到用户信息!!

代码语言:javascript
复制
// Apple 原生登录
Future<bool> signInWithApple() async {
  final credential = await SignInWithApple.getAppleIDCredential(
    scopes: [
      AppleIDAuthorizationScopes.email,
      AppleIDAuthorizationScopes.fullName,
    ],
  );
  return true;
}

如果使用Firebase进行登录,代码如下:

代码语言:javascript
复制
// Apple Firebase 登录
Future<bool> signInWithApple() async {
  final applerProvider = AppleAuthProvider();
  final auth = await FirebaseAuth.instance.signInWithProvider(applerProvider);
  if (auth.user == null) return false;
  print(auth.user);
  IdTokenResult? idTokenResult = await auth.user?.getIdTokenResult(true);
  return true;
}

// 退出 Apple Firebase 登录
Future<void> signOutApple() async {
  await FirebaseAuth.instance.signOut();
}

参考

  • Flutter快速实现苹果账号登录:https://juejin.cn/post/7055797008832921631

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 远端配置
    • 注册账号
      • 创建应用
      • Flutter项目开发配置
        • 引用插件
          • 添加登录按钮
          • 参考
          领券
          问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档