How to implement Google Authentication with Firebase for Flutter Desktop Apps

Integrating Google sign-in with a flutter desktop app is different from mobile apps because a popular flutter package named google_sign_in doesn't support desktop platforms yet.

This article will guide you on implementing Sign-in with Google for your Flutter desktop apps using OAuth2.0 protocol and desktop browser.

Here's what the auth flow looks like:

• User clicks on the “Sign in with Google” button in our app, which redirects them to Google’s 2.0 authorization endpoint.

• The user is prompted to log in to their Google account and grant permission for our app to access their data.

• If the user grants permission, Google redirects the browser to the redirect URI specified in the initial request, along with an authorization code.

• Our app sends a request to Google’s OAuth 2.0 token endpoint, along with the authorization code for an access token.

• Google returns an access token, which our app can use to authenticate requests to the corresponding Google service’s API.

• Our app can now make authorized requests on behalf of the user until the access token expires or is revoked by the user.

Table of Contents:

• Prerequisites

1. Set up the firebase project

2. Configure the OAuth client

3. Set up the flutter Project

• Let's Get Started

1. Add Dependencies

2. Import the dependencies

3. Getting Credentials

4. Obtaining OAuth2 Client and Access Token

5. Redirecting to the Authorization URL

6. Get Authorization Code from the request

7. Creating AuthCredentials for firebase authentication

8. Signing a user with AuthCredentials

9. Implementing Firebase Sign-out

For a step by step implementation guide, check out our canopas blog.