Flutter集成Google、Facebook等第三方登陆完整流程
前言
国内的登陆一般可以通过极光、友盟等这些第三方平台提供的sdk,实现一键接入。国外的就比较杂了,比如常用的 GitHub、Twitter、apple、Microsoft等, Google 提供了 firebase 统一验证的机制,虽然不能统一登陆方式,但是通过 firebase 能使登陆流程更加规范化,减少后端开发的工作量,而且要使用 Google 登陆前,必须要集成 firebase,同时它也是国际型项目等首选方案,它等服务还包括推送,邮箱验证,统计、即时通讯等。文章只演示 Google 和 Facebook 登陆集成及配置。
账号配置
关于账号配置请参考上篇文章配置流程
Vue 接入firebase验证、Google登陆、Facebook登陆完整流程
集成及使用
在 pubspec.yaml 中新增依赖
firebase_auth: ^0.16.1google_sign_in: ^4.5.1
google_sign_in_web: ^0.9.1flutter_facebook_login: ^3.0.0
其它平台请参考对应的集成文档
android 配置
1.通过 keytools 工具获取 app 的 SHA 证书指纹
如果没有就去创建一个,否则无法使用firebase 登陆,(不知道怎么获取的也可以百度,网上很多教程)
官方文档(需科学上网)
keytool -list -v \
-alias androiddebugkey -keystore ~/.android/debug.keystore
2.将指纹添加到下面
3.下载 google-services.json 拷贝到 android/app 目录下
如果集成了 Facebook 还需要在 AndroidManifest.xml 中新增 FacebookActivity
<activity android:name="com.facebook.FacebookActivity"android:configChanges="keyboard|keyboardHidden|screenLayout|screenSize|orientation"android:label="@string/app_name" />
ios 配置
在 ios 选项中将 GoogleService-Info.plist 拷贝到 Xcode 项目的根目录中
使用
1.初始化
FirebaseAuth _auth = FirebaseAuth.instance;GoogleSignIn _googleSignIn = GoogleSignIn(scopes: <String>['email','https://www.googleapis.com/auth/contacts.readonly',],);static final FacebookLogin facebookSignIn = new FacebookLogin();
2.导入相关依赖
import 'package:firebase_auth/firebase_auth.dart';
import 'package:google_sign_in/google_sign_in.dart';
import 'package:flutter_facebook_login/flutter_facebook_login.dart';
3.google登陆
void signInWithGoogle() async {try{final GoogleSignInAccount googleUser = await _googleSignIn.signIn();final GoogleSignInAuthentication googleAuth = await googleUser.authentication;final AuthCredential credential = GoogleAuthProvider.getCredential(accessToken: googleAuth.accessToken,idToken: googleAuth.idToken,);final FirebaseUser user = (await _auth.signInWithCredential(credential)).user;assert(user.email != null);assert(user.displayName != null);assert(!user.isAnonymous);assert(await user.getIdToken() != null);IdTokenResult idTokenResult = await user.getIdToken(refresh: true);setState(() {idToken = idTokenResult.token;});}catch(e){SnackTool.showSnackText(context, "Auth error !");}}
Facebook登陆
Future<Null> signInFacebook() async {try{final FacebookLoginResult result = await facebookSignIn.logIn(['email']);switch (result.status) {case FacebookLoginStatus.loggedIn:final FacebookAccessToken accessToken = result.accessToken;final AuthCredential credential =FacebookAuthProvider.getCredential(accessToken: accessToken.token);final FirebaseUser user = (await _auth.signInWithCredential(credential)).user;IdTokenResult idTokenResult = await user.getIdToken(refresh: true);setState(() {idToken = idTokenResult.token;});break;case FacebookLoginStatus.cancelledByUser:print('Login cancelled by the user.');break;case FacebookLoginStatus.error:print('Something went wrong with the login process.\n''Here\'s the error Facebook gave us: ${result.errorMessage}');break;}}catch(e){SnackTool.showSnackText(context, "Auth error !");}}
⚠️ 最终结果是要获取到 idtoken,中间任何步骤都不能省略,如果是其它平台也同理,最后获取到对应平台都token之后都需要再通过 firebase 签名验证,生产 firebase 统一的 idtoken。
最后就是后端需要处理的事情了,获取 idtoken之后 后端就能获取用户信息了。
问题
集成中曾遇到 listenablefuture libs 冲突
解决方案是在 android/app/build.gradle 中的 android 里加上
configurations {all*.exclude group: 'com.google.guava', module: 'listenablefuture'}
其它
FlutterFire官方文档
firebase_auth
Flutter集成Google、Facebook等第三方登陆完整流程相关推荐
- Java前后端分离第三方登录_网站前后端分离情况下如何实现QQ微信等第三方登陆-Fun言...
前言 最近在弄第三方登录,实现起来很简单,就是调几个接口获取个人信息即可,详细了解:maven项目整合QQauth2.0第三方登录详细说明,然后因为本网站是前后端分离的,所以不能再回调接口那里直接跳转 ...
- 网站前后端分离情况下如何实现QQ微信等第三方登陆
本文转自Fun言网:https://funyan.cn/p/1705.html 前言 最近在弄第三方登录,实现起来很简单,就是调几个接口获取个人信息即可,详细了解:maven项目整合QQauth2.0 ...
- Android12新特性——google()maven()等第三方添加
Android12中第三方库的添加 添加第三方库错误提示: Caused by: org.gradle.api.InvalidUserCodeException: Build was configur ...
- php微信小程序登陆完整流程
小程序登陆流程: 1.使用wx.login 获取code, 2.使用wx.getUserInfo 获取用户信息,然后上传到服务端, 3.服务端在通过codee获取access_token,openid ...
- 手游游戏SDK开发,集成海外登陆google、facebook、taptap登陆
记录下来SDK的开发步骤以及参考文章 ![在这里插入图片描述](https://img-blog.csdnimg.cn/b59703431923454b81562a60b4895010.png 游戏S ...
- 方案系列--多个应用同时接入Google和Facebook三方登陆互联互通解决方案
目录 背景 多App之间用户互通场景分析 本文可以帮到你什么 国内三方登陆常见方案
- 微信会员中心模板html,响应式织梦会员中心模板+集成了微信+支付宝+财付通等第三方API支付接口...
演示地址: http://mb.siy.la/adaption/user.html 实站演示地址: http://www.siy.la/user/ 该套模板集成了微信.支付宝.财付通等第三方API支付 ...
- 如何无需开发集成易快报、招行CBS等第三方应用
客户简介 某公司是一家医疗类科技有限公司,位于成都高新区天华一路,致力于为广大慢病患者提供长期规范的专科慢病管理服务,用科技让慢病患者过上有品质的生活,并推出了医生实名制社交平台.以医生为切入点,建立 ...
- Android 集成google 和 facebook 登录
最近公司项目刚好集成了google 和 facebook 登录,中间遇到了一些问题,所以记录下来. 主要问题如下: 1)如何集成google 和 facebook 登录,主要参考官方文档. 2)应用上 ...
最新文章
- UE4 RHI与条件式编译
- 转:各种专题图实现的C#源代码
- 软考-信息系统项目管理师-战略管理
- 极光推送 api ios参数问题
- 相机模型之世界坐标、相机坐标、归一化坐标、图像坐标、像素坐标、内参、外参、转换关系总结
- MIDP应用程序的属性
- mysql数据库函数详解_MySQL数据库之字符函数详解
- Linq to sql(六):探究特性(四)
- 在Word中自定义多级列表样式
- GGB0/OB28/OKC7/GGB1/OBBH/OKC9FICO增强
- 基于Java毕业设计职业信息服务平台源码+系统+mysql+lw文档+部署软件
- linux进阶-网络安全系统网站服务
- 东软睿驰获本田加持的背后:传统车企与新势力的对垒升级
- 深度学习_07_2_随机梯度下降_激活函数及梯度损失函数及梯度
- 1051 复数乘法 分数 15
- EasyConnect一登录就自动注销问题
- 上网行为安全之深信服用户认证技术和用户、组管理
- printf打印字符串的时候可以printf(“%s“,buf);buf可以是字符串名或者指针
- Python编程简介
- 移动WebApp开发-phoneGap+android入门(http://blog.csdn.net/cwb1128/article/details/18004505)
热门文章
- Prism:Uber 的 Presto 查询网关服务
- 豌豆淘谈护肤:豌豆淘讲解肤质分类,不了解肤质谈何护肤?
- c语言15除以2得到8,C语言程序设计100例之(15):除法算式
- 初学者学习web前端用什么软件
- 什么是jason?jason应该如何使用和解读?jason的语法格式
- Dockerfile实践指南之COPY vs ADD
- linux系统之网络防火墙(firewalld服务和iptables服务)
- 7.13日 ksjsb抓salt详细图文教程(看了谁都会)
- springboot vue uniapp校园报修系统源码
- 电信主机托管费用_电信托管服务器需要如何计费?