Google登录及获取Calendar信息

firebase方案(实际是一个三方登录集成,由于是google的所以使用Google账户登录以后可以使用google api)

firebase官网
使用firebase Auth集成并登录
firebase创建项目后会在google cloud中创建并关联项目,登录成功后接着就可以按照下述方法使用google api获取相应信息。

flutter中用到的插件:
firebase_auth
firebase_core
参考firebase flutter网站

在google开发者平台构建项目(单独集成)

进入Google Cloud登录并注册,之后按照提示构建项目。

进入Apis&Services->Credentials下点击CREATE CREDENTIALS创建OAuth 2.0 Client IDs。(ios和android需分别创建)。

创建过程中根据提示android需要配置sha-1签名证书,ios需要配置url scheme。

android需要配置签名:

Android 怎么创建签名文件和解析签名文件

将生成好的签名文件放到工程app文件夹下,与app的build.gradle平行,之后再app的build.gradle中做如下配置:

...
android{...buildTypes {release {signingConfig signingConfigs.debug}debug {signingConfig signingConfigs.debug}}signingConfigs {debug {storeFile file("nearhubone.keystore")//签名文件名storePassword "123456"//密码keyAlias "nearhubone"//别名keyPassword "123456"//密码}release {storeFile file("nearhubone.keystore")storePassword "123456"keyAlias "nearhubone"keyPassword "123456"}}...
}

申请需要使用的api

点击Google Cloud-APIs&Services下的Enabled APIs&services,enable需要使用的api,如Google Calendar API。需要创建api key的则创建api key(非所有api都需要创建api key)。

集成到对于项目

Flutter中集成

需要使用的插件有:

google_sign_in//用于登录

extension_google_sign_in_as_googleapis_auth//配合拓展google_sign_in用于提供api初始化需要的Client

googleapis//提供丰富的google api

Flutter使用 Google API
Flutter使用 Google API 英文

流程如下:

使用google_sign_in插件实现登录

  • serverClientId参数填写OAuth 2.0 Client IDs里相对应的ClientId。
  • 注意初始化配置中的scopes,这个scopes用于用户授权范围,只有填入的scopes才会显示在用户授权页上并得到授权,否则api将会调用失败。这个scopes的字段在api文档里可得。如CalendarList get这个api在其文档里的Authorization就可看到scope列表。

登录的示例代码如下:

import 'package:flutter/material.dart';
import 'package:google_sign_in/google_sign_in.dart';//登录所需插件
import 'package:http/http.dart' as http;
import 'dart:convert' show json;//配置google登录
GoogleSignIn _googleSignIn = GoogleSignIn(// Optional clientIdserverClientId: '781114075503-2qscj6a0ahsqedt6cellol0ur7qij645.apps.googleusercontent.com',//授权范围(用户授权页会提示用户授权)scopes: <String>['email','https://www.googleapis.com/auth/contacts.readonly','https://www.googleapis.com/auth/calendar',//获取日历信息授权],
);class SignInDemo extends StatefulWidget {const SignInDemo({Key? key}) : super(key: key);@overrideState createState() => SignInDemoState();
}class SignInDemoState extends State<SignInDemo> {GoogleSignInAccount? _currentUser;String _contactText = '';@overridevoid initState() {super.initState();//注册登录回调_googleSignIn.onCurrentUserChanged.listen((GoogleSignInAccount? account) {setState(() {_currentUser = account;});if (_currentUser != null) {_handleGetContact(_currentUser!);}});_googleSignIn.signInSilently();}//【非登录必须流程】登录后获取用户个人信息用于显示    Future<void> _handleGetContact(GoogleSignInAccount user) async {setState(() {_contactText = 'Loading contact info...';});//通过http请求获取用户个人信息final http.Response response = await http.get(Uri.parse('https://people.googleapis.com/v1/people/me/connections''?requestMask.includeField=person.names'),headers: await user.authHeaders,//请求头置入登录成功信息);if (response.statusCode != 200) {setState(() {_contactText = 'People API gave a ${response.statusCode} ''response. Check logs for details.';});print('People API ${response.statusCode} response: ${response.body}');return;}//解析用户信息final Map<String, dynamic> data =json.decode(response.body) as Map<String, dynamic>;final String? namedContact = _pickFirstNamedContact(data);setState(() {if (namedContact != null) {_contactText = 'I see you know $namedContact!';} else {_contactText = 'No contacts to display.';}});}String? _pickFirstNamedContact(Map<String, dynamic> data) {final List<dynamic>? connections = data['connections'] as List<dynamic>?;final Map<String, dynamic>? contact = connections?.firstWhere((dynamic contact) => contact['names'] != null,orElse: () => null,) as Map<String, dynamic>?;if (contact != null) {final Map<String, dynamic>? name = contact['names'].firstWhere((dynamic name) => name['displayName'] != null,orElse: () => null,) as Map<String, dynamic>?;if (name != null) {return name['displayName'] as String?;}}return null;}//登录Future<void> _handleSignIn() async {try {await _googleSignIn.signIn();} catch (error) {print(error);}}//登出Future<void> _handleSignOut() => _googleSignIn.disconnect();//界面展示Widget _buildBody() {final GoogleSignInAccount? user = _currentUser;if (user != null) {return Column(mainAxisAlignment: MainAxisAlignment.spaceAround,children: <Widget>[ListTile(leading: GoogleUserCircleAvatar(identity: user,),title: Text(user.displayName ?? ''),subtitle: Text(user.email),),const Text('Signed in successfully.'),Text(_contactText),ElevatedButton(onPressed: _handleSignOut,child: const Text('SIGN OUT'),),ElevatedButton(child: const Text('REFRESH'),onPressed: () => _handleGetContact(user),),],);} else {return Column(mainAxisAlignment: MainAxisAlignment.spaceAround,children: <Widget>[const Text('You are not currently signed in.'),ElevatedButton(onPressed: _handleSignIn,child: const Text('SIGN IN'),),],);}}@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: const Text('Google Sign In'),),body: ConstrainedBox(constraints: const BoxConstraints.expand(),child: _buildBody(),));}
}

参考:
官方示例

获取日历信息

获取日历信息可使用两种方式:

  • 一种方式直接使用http请求,无需其他插件,只需在请求头中添加登录信息
    api查看官方文档
import 'package:google_sign_in/google_sign_in.dart';...
class SignInDemo extends State<SignInDemo> {   ...GoogleSignInAccount? _currentUser;@overridevoid initState() {super.initState();//注册登录回调_googleSignIn.onCurrentUserChanged.listen((GoogleSignInAccount? account) {setState(() {_currentUser = account;});...});}...onGetCalendarClick(){handleGetCalendar(_currentUser);}...//获取谷歌日历列表信息(http方式)handleGetCalendar(GoogleSignInAccount user) async {final http.Response response = await http.get(Uri.parse('https://www.googleapis.com/calendar/v3/calendars/primary/events'),//api查看官方文档headers: await user.authHeaders,//在请求头中添加登录信息);if (response.statusCode != 200) {print('Calendar API ${response.statusCode} response: ${response.body}');} else {final Map<String, dynamic> data =json.decode(response.body) as Map<String, dynamic>;debugPrint(data.toString());}}}
  • 【推荐】另一种方式使用googleapis插件配合google登录拓展插件extension_google_sign_in_as_googleapis_auth使用

由于googleapis初始化对应api时需要提供client,extension_google_sign_in_as_googleapis_auth插件可以配合google_sign_in提供client。

代码如下:

import 'package:google_sign_in/google_sign_in.dart';
import 'package:extension_google_sign_in_as_googleapis_auth/extension_google_sign_in_as_googleapis_auth.dart';
import 'package:googleapis/calendar/v3.dart';
//获取谷歌日历列表信息(sdk方式)getCalendarEvent() async {var httpClient = (await _googleSignIn.authenticatedClient())!;var calendar = CalendarApi(httpClient);var calEvents = calendar.events.list("primary");calEvents.then((events) => {events.items?.forEach((event) => print("EVENT ${event.summary}"))});}

参考:
如何在flutter中使用google日历api获取一个月内的所有活动 (仅参考使用googleapis-CalendarApi部分)

获取身份验证后的 HTTP 客户端

完整代码参考:

google_sign_in_get_calendar_demo.dart

import 'package:flutter/material.dart';
import 'package:google_sign_in/google_sign_in.dart';
import 'package:extension_google_sign_in_as_googleapis_auth/extension_google_sign_in_as_googleapis_auth.dart';
import 'package:googleapis/calendar/v3.dart';
import 'package:http/http.dart' as http;
import 'dart:convert' show json;//配置google登录
GoogleSignIn _googleSignIn = GoogleSignIn(// Optional clientIdserverClientId: '781114075503-2qscj6a0ahsqedt6cellol0ur7qij645.apps.googleusercontent.com',//授权范围(用户授权页会提示用户授权)scopes: <String>['email','https://www.googleapis.com/auth/contacts.readonly','https://www.googleapis.com/auth/calendar',],
);class SignInDemo extends StatefulWidget {const SignInDemo({Key? key}) : super(key: key);@overrideState createState() => SignInDemoState();
}class SignInDemoState extends State<SignInDemo> {GoogleSignInAccount? _currentUser;String _contactText = '';@overridevoid initState() {super.initState();//注册登录回调_googleSignIn.onCurrentUserChanged.listen((GoogleSignInAccount? account) {setState(() {_currentUser = account;});if (_currentUser != null) {_handleGetContact(_currentUser!);}});_googleSignIn.signInSilently();}//【非登录必须流程】登录后获取用户个人信息用于显示Future<void> _handleGetContact(GoogleSignInAccount user) async {setState(() {_contactText = 'Loading contact info...';});//通过http请求获取用户个人信息final http.Response response = await http.get(Uri.parse('https://people.googleapis.com/v1/people/me/connections''?requestMask.includeField=person.names'),headers: await user.authHeaders,//请求头置入登录成功信息);if (response.statusCode != 200) {setState(() {_contactText = 'People API gave a ${response.statusCode} ''response. Check logs for details.';});print('People API ${response.statusCode} response: ${response.body}');return;}//解析用户信息final Map<String, dynamic> data =json.decode(response.body) as Map<String, dynamic>;final String? namedContact = _pickFirstNamedContact(data);setState(() {if (namedContact != null) {_contactText = 'I see you know $namedContact!';} else {_contactText = 'No contacts to display.';}});}String? _pickFirstNamedContact(Map<String, dynamic> data) {final List<dynamic>? connections = data['connections'] as List<dynamic>?;final Map<String, dynamic>? contact = connections?.firstWhere((dynamic contact) => contact['names'] != null,orElse: () => null,) as Map<String, dynamic>?;if (contact != null) {final Map<String, dynamic>? name = contact['names'].firstWhere((dynamic name) => name['displayName'] != null,orElse: () => null,) as Map<String, dynamic>?;if (name != null) {return name['displayName'] as String?;}}return null;}//登录Future<void> _handleSignIn() async {try {await _googleSignIn.signIn();} catch (error) {print(error);}}//登出Future<void> _handleSignOut() => _googleSignIn.disconnect();//获取谷歌日历列表信息(sdk方式)getCalendarEvent() async {var httpClient = (await _googleSignIn.authenticatedClient())!;var calendar = CalendarApi(httpClient);var calEvents = calendar.events.list("primary");calEvents.then((events) => {events.items?.forEach((event) => print("EVENT ${event.summary}"))});}//获取谷歌日历列表信息(http方式)handleGetCalendar(GoogleSignInAccount user) async {final http.Response response = await http.get(Uri.parse('https://www.googleapis.com/calendar/v3/users/me/calendarList/primary'),//api查看官方文档headers: await user.authHeaders,//在请求头中添加登录信息);if (response.statusCode != 200) {print('Calendar API ${response.statusCode} response: ${response.body}');} else {}}//界面展示Widget _buildBody() {final GoogleSignInAccount? user = _currentUser;if (user != null) {return Column(mainAxisAlignment: MainAxisAlignment.spaceAround,children: <Widget>[ListTile(leading: GoogleUserCircleAvatar(identity: user,),title: Text(user.displayName ?? ''),subtitle: Text(user.email),),const Text('Signed in successfully.'),Text(_contactText),ElevatedButton(onPressed: ()=>handleGetCalendar(user),child: const Text('getCalendarEvent http'),),ElevatedButton(onPressed: getCalendarEvent,child: const Text('getCalendarEvent'),),ElevatedButton(onPressed: _handleSignOut,child: const Text('SIGN OUT'),),ElevatedButton(child: const Text('REFRESH'),onPressed: () => _handleGetContact(user),),],);} else {return Column(mainAxisAlignment: MainAxisAlignment.spaceAround,children: <Widget>[const Text('You are not currently signed in.'),ElevatedButton(onPressed: _handleSignIn,child: const Text('SIGN IN'),),],);}}@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: const Text('Google Sign In'),),body: ConstrainedBox(constraints: const BoxConstraints.expand(),child: _buildBody(),));}
}

pubspec.yaml

dependencies:flutter:sdk: flutterflutter_signin_button: ^2.0.0google_sign_in: ^5.1.0extension_google_sign_in_as_googleapis_auth: ^2.0.7googleapis: ^9.2.0googleapis_auth: ^1.3.1url_launcher: ^6.1.5dev_dependencies:flutter_test:sdk: flutterdrive: 1.0.0-1.0.nullsafety.1flutter_driver:sdk: flutterhttp: ^0.13.3flutter_lints: ^2.0.0

其他参考

Flutter: Use Google Calendar API — Adding the events to Calendar

将dart和flutter与Google Calendar API结合使用以获取用户日历上的事件列表

Google登录及获取Calendar信息相关推荐

  1. 集成Google登录并获取个人性别等信息

    集成Google登录并获取个人性别等信息 前言: 最近海外产品更新需求要求获取到Google登录的用户的性别信息,于是开始了新一轮的踩坑之旅.不得不说在集成Firebase或者其他Google的SDK ...

  2. 微信公众号网页OAuth2.0授权登录并获取用户信息(SpringBoot实现)

    微信公众号网页OAuth2.0授权登录并获取用户信息(SpringBoot实现) 文章目录 微信公众号网页OAuth2.0授权登录并获取用户信息(SpringBoot实现) 准备工作 开发思路 具体代 ...

  3. Android第三方QQ登录、获取个人信息、分享实现

    昨天调试了一下午终于成功 第三方QQ登录.获取个人信息,分享 QQ官方API文档写的太乱 并且很多地方没有更新 这里总结一下 方便记录和回看 实现结果图 首先进入腾讯开放平台 下载QQ的SDK 地址 ...

  4. php把微信一键登录,PHP微信第三方实现一键登录及获取用户信息的方法(实例详解)...

    这篇文章主要介绍了PHP版微信第三方实现一键登录及获取用户信息的方法,较为详细的分析了微信第三方登陆的相关注意事项与实现技巧,需要的朋友可以参考下 注意,要使用微信在第三方网页登录是需要"服 ...

  5. 小程序:登录页获取用户信息并传递用户数据到个人中心页

    步骤一:个人中心页添加"立即登录"按钮跳转至登录页 一.个人中心页的me.wxml代码 <view class="userinfo"><but ...

  6. Android 集成 google 登录并获取 性别等隐私信息

    前言 公司做海外产品的,集成的是 google 账号登录,账号信息.邮箱等这些不涉及隐私的按 google 的正常登录流程可以轻松实现 .但是一旦需要获取涉及隐私的信息就比较麻烦,文档也不是十分清晰, ...

  7. iOS第三方登录之Twitter(登录,获取用户信息)含demo

    一.  登录twitter和创建应用 1.打开twitter的官网https://dev.twitter.com,如果还没有注册账号的,需要先注册账号,已经注册账号的,请先登录. 2.选择,My ap ...

  8. 小程序登录授权获取用户信息

    一  登录 时序图如下: wx.login() 获取js_code 示例代码: App({ onLaunch: function() { wx.login({ success: function(re ...

  9. java支付宝网页授权登录界面_支付宝开发平台之第三方授权登录与获取用户信息...

    对于第三方登录,我们常见了,很多应用可以进行第三方登录,我常用的有:QQ.微信.新浪.支付宝等等,今天我们就一起来简单学习一下支付宝第三方授权登录. 打开支付宝开发平台,注册成为开发者,点击开发者中心 ...

最新文章

  1. CUDA Samples: image normalize(mean/standard deviation)
  2. 局域网怎样自动安装FLASH插件(浏览器不安装flashplayer都可以浏览.swf文件)
  3. R删除数据列基于dplyr包
  4. 百联全渠道联手神策数据 致力给消费者最优体验
  5. Android简单实现Socket通信,客户端连接服务器后,服务器向客户端发送文字数据
  6. 静态编译和动态编译区别
  7. Android doc译文|Building Apps with Content Sharing|Sharing Simple Data
  8. SAP Basis常用事务代码
  9. python学习笔记(python发展介绍)
  10. 怎么查电脑系统版本_台式机电脑系统雨林木风、深度技术、番茄花园、罗卜家园,哪个最稳定最好用?...
  11. 网络电视接口 php,【小白教程】智能电视背后这些接口怎么用?
  12. 安装拼音加加时出现问题
  13. 企业微信集成自建应用——踩坑记录
  14. JMeter工具:场景设计,场景设置,场景运行,性能参数配置,测试监控
  15. 电脑使用哪个录制视频软件比较好
  16. Spring Boot 之---什么是热部署?---怎么使用?
  17. Termux基础教程(无编程基础动图展示版)
  18. Hair-Gan论文翻译
  19. 风控概要和内容安全,反欺诈(营销风控)
  20. 豆瓣的开发语言:无所不能的python

热门文章

  1. matlab 功率计算,基于Matlab矩阵运算的潮流计算支路功率计算方法与流程
  2. Educational Codeforces Round 98 -B - Toy Blocks (思维)
  3. TEX编写论文转WORD,及WORD打开失败的可能解决方案
  4. PySpark SQL 相关知识介绍
  5. C语言复习之判断Armstrong数(阿姆斯壮数)
  6. vue.js搭建个人博客
  7. 从IT时代转入DT时代 安防应该注意什么?
  8. C语言多任务,多进程,多线程
  9. 泛域名https证书简介
  10. 不同进制的类型与转换