google_sign_in_web 0.9.1+1

Flutter web

Flutter plugin for Google Sign-In, a secure authentication system for signing in with a Google account on Android, iOS and Web.

google_sign_in_web #

The web implementation of google_sign_in

Usage #

Import the package #

This package is the endorsed implementation of google_sign_in for the web platform since version 4.1.0, so it gets automatically added to your dependencies by depending on google_sign_in: ^4.1.0.

No modifications to your pubspec.yaml should be required in a recent enough version of Flutter (>=1.12.13+hotfix.4):

...
dependencies:
  ...
  google_sign_in: ^4.1.0
  ...
...

Web integration #

First, go through the instructions here to create your Google Sign-In OAuth client ID.

On your web/index.html file, add the following meta tag, somewhere in the head of the document:

<meta name="google-signin-client_id" content="YOUR_GOOGLE_SIGN_IN_OAUTH_CLIENT_ID.apps.googleusercontent.com">

For this client to work correctly, the last step is to configure the Authorized JavaScript origins, which identify the domains from which your application can send API requests. When in local development, this is normally localhost and some port.

You can do this by:

  1. Going to the Credentials page.
  2. Clicking "Edit" in the OAuth 2.0 Web application client that you created above.
  3. Adding the URIs you want to the Authorized JavaScript origins.

For local development, may add a localhost entry, for example: http://localhost:7357

Starting flutter in http://localhost:7357

Normally flutter run starts in a random port. In the case where you need to deal with authentication like the above, that's not the most appropriate behavior.

You can tell flutter run to listen for requests in a specific host and port with the following:

flutter run -d chrome --web-hostname localhost --web-port 7357

Other APIs #

Read the rest of the instructions if you need to add extra APIs (like Google People API).

Using the plugin #

Add the following import to your Dart code:

import 'package:google_sign_in/google_sign_in.dart';

Initialize GoogleSignIn with the scopes you want:

GoogleSignIn _googleSignIn = GoogleSignIn(
  scopes: [
    'email',
    'https://www.googleapis.com/auth/contacts.readonly',
  ],
);

Full list of available scopes.

You can now use the GoogleSignIn class to authenticate in your Dart code, e.g.

Future<void> _handleSignIn() async {
  try {
    await _googleSignIn.signIn();
  } catch (error) {
    print(error);
  }
}

Example #

Find the example wiring in the Google sign-in example application.

API details #

See the google_sign_in.dart for more API details.

Contributions and Testing #

Tests are a crucial to contributions to this package. All new contributions should be reasonably tested.

In order to run tests in this package, do:

flutter test --platform chrome -j1

Contributions to this package are welcome. Read the Contributing to Flutter Plugins guide to get started.

Issues and feedback #

Please file issues to send feedback or report a bug.

Thank you!

8
likes
70
pub points
99%
popularity

Publisher

flutter.dev

Flutter plugin for Google Sign-In, a secure authentication system for signing in with a Google account on Android, iOS and Web.

Homepage
Repository (GitHub)
View/report issues

Documentation

API reference

License

BSD (LICENSE)

Dependencies

flutter, flutter_web_plugins, google_sign_in_platform_interface, js, meta

More

Packages that depend on google_sign_in_web