【原创 附源码】Flutter安卓及iOS海外登录--Apple登录最详细流程

最近接触了几个海外登录的平台,踩了很多坑,也总结了很多东西,决定记录下来给路过的兄弟坐个参考,也留着以后留着回顾。更新时间为2024年2月12日,后续集成方式可能会有变动,所以目前的集成流程仅供参考,但是绝对详细且经过真机验证。

整个记录会包含源码。

dart环境:sdk: '>=2.7.0 <3.0.0'

集成海外登录需要科学上网,一共涉及四个平台,Tiktok,Facebook,Google以及Apple登录。我会分别一一整理记录,所以我的项目就命名为fgta_login (Facebook,Google,Tiktok,Apple登录),奇怪的命名+1。

这篇文章只记录Apple账户登录的详细流程,其他几个平台的集成流程如下:

【原创 附源码】Flutter安卓及iOS海外登录--Google登录最详细流程

【原创 附源码】Flutter安卓及iOS海外登录--Tiktok登录最详细流程

【原创 附源码】Flutter安卓及iOS海外登录--Facebook登录最详细流程

一 Xcode项目配置

Apple登录可谓是海外第三方登录里最简单,最容易实现的一个了,打开iOS项目,点击添加Capability:

然后选择苹果登录,(如果这里没有的话需要去苹果开发者中心,在bundle id的配置里增加 Sign in with Apple的功能,记住账户必须是公司账户才有该选项) :

增加完如下所示:

ios项目就配置完了

二 Flutter 项目配置

苹果登录使用的第三方插件是

复制代码
sign_in_with_apple: ^4.0.0 

插件地址为:sign_in_with_apple | Flutter package

在ymal文件增加插件,然后执行flutter pub get

执行完了记得去ios项目里执行pod install同步第三方插件。

然后开始调用apple登录:

Dart 复制代码
 final credential = await SignInWithApple.getAppleIDCredential(
      scopes: [
        AppleIDAuthorizationScopes.email,
        AppleIDAuthorizationScopes.fullName,
      ],
    );
    if (credential != null) {
      print("苹果登录信息");
      print(credential.toString());
      print(credential.email);
      print(credential.givenName);
      print(credential.userIdentifier);
    }

调用结果如下:

授权完成后,输出用户信息为

但是注意,这里有一个坑点,苹果用户只有第一次授权登录的时候才可以获取到用户的姓名、邮箱这些信息,在第二次登录的时候,这些信息会返回空值,只会返回用户的identfier,第二次多冷结果如下:

可以发现,用户的邮箱和姓名都返回为空了

源码地址:

源码地址:https://github.com/TheRuningAnt/FGTALogin.git

注:这个项目使用的是个人账户,所以未开启apple sign登录功能,但是登录的逻辑和代码是有的且经过完整的测试,兄弟们下载完成之后将bundle id改为自己的,然后在这里增加上苹果登录的授权就可以了,如何增加上文有介绍

相关推荐
天桥吴彦祖2 天前
判断iOS如何监听手机屏幕是否锁屏
ios
恋猫de小郭2 天前
Amper 正式转正 Kotlin Toolchain ,Gradle 未来何去何从
android·前端·flutter
张风捷特烈2 天前
Flutter 类库大揭秘#02 | path_provider 各平台实现
前端·flutter
敲代码的鱼3 天前
PDF 预览与签名批注写回 支持安卓 iOS 鸿蒙 UTS插件
android·前端·ios
时光足迹3 天前
uni-app 视频通话实战:康复师与患者视频问诊的 6 个致命 Bug 与解决方案
android·ios·uni-app
时光足迹3 天前
JPush UniApp UTS 插件完全参考手册:API、事件与厂商通道一网打尽
vue.js·ios·uni-app
时光足迹3 天前
极光推送全攻略(下):uni-app 代码实现与 iOS 排查实战
vue.js·ios·uni-app
时光足迹3 天前
极光推送全攻略(上):被iOS证书折磨了三天,我写了一份前端也能看懂的避坑指南
前端·ios·uni-app
TT_Close3 天前
别劝退了!5秒搞定 Flutter 鸿蒙 FVM 起跑线
flutter·harmonyos·visual studio code
你听得到113 天前
用户说 App 卡,但说不清在哪?我把 Flutter 监控 SDK 升级成了链路观测工作台
前端·flutter·性能优化