Flutter 应用实现 google 登录应用
开通 google cloud api
配置 flutter
flutter pub add google_sign_in
web
修改 web/index.html,在 head 添加 web 端的 clientid
1
2
| <meta name="google-signin-client_id"
content="xxxx.apps.googleusercontent.com">
|
Android
./android/build.gradle add:
1
2
3
4
5
6
| buildscript {
dependencies {
// Add this line
classpath 'com.google.gms:google-services:4.3.10'
}
}
|
./android/app/build.gradle :
1
2
3
4
5
6
7
8
9
10
11
|
plugins {
//添加
id "com.google.gms.google-services"
}
//添加:
dependencies {
// Add this dependency
implementation 'com.google.android.gms:play-services-auth:19.2.0'
}
|
./android/app/src/main/AndroidManifext.xml
1
2
3
4
5
6
7
| <application
android:usesCleartextTraffic="true">
<meta-data
android:name="com.google.android.gms.auth.api.signin.v2.API_KEY"
android:value="xxxxxb.apps.googleusercontent.com" />
</application>
|
iOS
TODO: 待补充
MacOS
TODO: 待补充
windows
TODO: 待补充
代码
main.dart
1
2
3
4
|
import 'package:google_sign_in/google_sign_in.dart';
import 'package:http/http.dart' as http;
import 'dart:convert';
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
|
class _MyHomePageState extends State<MyHomePage> {
int _counter = 0;
bool _isLeftPanelOpen = true;
GoogleSignInAccount? _currentUser;
final GoogleSignIn _googleSignIn = GoogleSignIn(
scopes: [
'email',
'https://www.googleapis.com/auth/userinfo.profile',
'https://www.googleapis.com/auth/userinfo.email',
'https://www.googleapis.com/auth/user.phonenumbers.read',
'https://www.googleapis.com/auth/user.gender.read',
'https://www.googleapis.com/auth/user.addresses.read',
],
);
@override
void initState() {
.....
```
```dart
@override
void initState() {
super.initState();
_googleSignIn.onCurrentUserChanged.listen((GoogleSignInAccount? account) {
setState(() {
_currentUser = account;
});
if (_currentUser != null) {
_handleSignIn();
}
});
_googleSignIn.signInSilently();
}
Future<void> _handleSignIn() async {
try {
GoogleSignInAccount? account = await _googleSignIn.signIn();
GoogleSignInAuthentication authentication = await account!.authentication;
String? idToken = authentication.idToken;
// Send token to the server
final response = await http.post(
Uri.parse('https://your-server.com/api/auth/google'),
headers: {'Content-Type': 'application/json'},
body: jsonEncode({'token': idToken}),
);
if (response.statusCode == 200) {
// Handle successful response
final data = jsonDecode(response.body);
print('Server response: $data');
} else {
// Handle error response
print('Server error: ${response.statusCode}');
}
} catch (error) {
print('Sign-In Error: $error');
}
}
Future<void> _handleSignOut() async {
await _googleSignIn.disconnect();
}
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
|
Widget _buildHeaderUserPanel(GoogleSignInAccount? user) {
return Container(
child: user != null
? Row(
children: [
RuiLoginStatusPanel(
userName: user.displayName ?? "",
// userPhone: user,
userImage: user.photoUrl ?? "",
userEmail: user.email,
),
GoogleUserCircleAvatar(identity: user),
SizedBox(height: 20),
ElevatedButton(
onPressed: _handleSignOut,
child: Text('Sign Out'),
),
],
)
: ElevatedButton(
onPressed: _handleSignIn,
child: Text('Sign In with Google'),
),
);
}
|