Integrating OAuth Login (Google

Introduction

OAuth with Google is the most common federated login choice for Flutter mobile development. This tutorial walks through a pragmatic, production-minded integration: create credentials, configure platform settings, implement the client flow with google_sign_in, and exchange/verify tokens on your backend. Focus is on correctness, security, and minimal boilerplate so you can ship fast.

Setup Firebase And Google Console

Decide whether you'll use Firebase Authentication or raw Google OAuth. Firebase simplifies token lifecycle and linking, but raw OAuth gives you full token control. Either way, create OAuth credentials in Google Cloud Console: an OAuth 2.0 Client ID for Android and iOS (or a single multi-platform credential).

For Android: add your applicationId (package name) and the SHA-1 (and SHA-256) of your signing keys. For iOS: add your bundle identifier and configure the reversed client ID in Info.plist (Firebase does this automatically if you use the GoogleService-Info.plist). If using Firebase, enable Google provider in the Firebase Console and download platform config files.

Add Dependencies And Configure Android And iOS

Add the google_sign_in package (and optionally firebase_auth). In pubspec.yaml:

• flutter: SDK dependency

• google_sign_in: latest stable

• http: for backend calls

Android: add the OAuth client ID to res/values/strings.xml (if required) and ensure the SHA certificates were added to the console. Confirm your AndroidManifest includes the internet permission and the correct package name.

iOS: open ios/Runner/Info.plist and add the reversed client ID as a URL scheme. If you used Firebase, Xcode project configuration will include these. Always test on real devices for Google Sign-In (emulators/simulators can behave differently).

Implement OAuth Flow With google_sign_in

Use google_sign_in for the native authentication UX. Request the scopes you need (email, profile, or other Google APIs). After sign-in, retrieve the GoogleSignInAuthentication object to get idToken and accessToken. Persist only what you must; send the idToken to your backend for verification and session issuance.

Example sign-in snippet (client-side):

import 'package:google_sign_in/google_sign_in.dart';

final GoogleSignIn _googleSignIn = GoogleSignIn(scopes: ['email', 'profile']);

Future<GoogleSignInAuthentication?> signInWithGoogle() async {
  final account = await _googleSignIn.signIn();
  return account == null ? null : await account.authentication;
}

After sign-in, the idToken is a JWT you should treat as proof from Google. Do not accept it as your app session token; instead exchange on your server for a secure session cookie or JWT that your backend controls.

Verify Tokens And Exchange With Backend

On the backend verify the idToken with Google's tokeninfo endpoint or a verified JWT library against Google’s public keys (recommended for performance and security). Check the token audience (aud) matches your client ID, verify expiry (exp), and ensure the hosted domain (hd) if you restrict to a G Suite domain.

Send idToken from the client using HTTPS to an auth endpoint. The server validates the token, creates a local user record if needed, and issues a short-lived access token or traditional server session. Store refresh tokens only on the server side. If you need to call Google APIs from the server, exchange the auth code for refresh tokens during the server-side flow (OAuth code flow) instead of relying on client-side tokens.

Example: sending idToken to backend (client-side):

import 'package:http/http.dart' as http;

Future<http.Response> sendIdToken(String idToken) async {
  return await http.post(Uri.parse('https://api.example.com/auth/google'),
    headers: {'Content-Type': 'application/json'},
    body: '{"idToken":"$idToken"}');
}

Key server checks: aud matches your client ID, iss is accounts.google.com or https://accounts.google.com, token not expired, and optionally email_verified is true.

Best Practices And Edge Cases

• Minimize scopes. Request only what you need to reduce friction and security surface.

• Use server-side verification and issue your own session tokens. Do not rely on client idTokens for authorization decisions.

• Handle account switching, sign-out, and token revocation gracefully. Call google_sign_in.signOut() to clear local state.

• Securely store any sensitive tokens using platform secure storage if temporarily needed. Prefer server refresh tokens.

• Test with development and production OAuth clients (different package names, bundle IDs, and SHA fingerprints).

Vibe Studio

Vibe Studio, powered by Steve’s advanced AI agents, is a revolutionary no-code, conversational platform that empowers users to quickly and efficiently create full-stack Flutter applications integrated seamlessly with Firebase backend services. Ideal for solo founders, startups, and agile engineering teams, Vibe Studio allows users to visually manage and deploy Flutter apps, greatly accelerating the development process. The intuitive conversational interface simplifies complex development tasks, making app creation accessible even for non-coders.

Conclusion

Integrating Google OAuth in Flutter for mobile development is straightforward when you separate concerns: use google_sign_in for native UX, pass idTokens to your backend, verify them server-side, and issue your own sessions. This flow gives strong security, centralized control of sessions, and a smooth UX across Android and iOS. Follow the platform configuration steps carefully (SHA fingerprints, URL schemes), minimize scopes, and keep refresh tokens on the server.