Documentation

Hi friend! Meet us at App.js Conf in Krakow, Poland on April 4th and 5th with workshops and talks. Learn more

Google

As of SDK 32 Expo.Google is just a JS wrapper for the Expo.AppAuth library.
Provides Google authentication integration for Expo apps using a system web browser (not WebView, so credentials saved on the device can be re-used!).
You'll get an access token after a successful login. Once you have the token, if you would like to make further calls to the Google API, you can use Google's REST APIs directly through HTTP (using fetch, for example).
Native Google Sign-In functionality can be used in Standalone builds via the expo-google-sign-in package.
// Example of using the Google REST API
async function getUserInfo(accessToken) {
  let userInfoResponse = await fetch('https://www.googleapis.com/userinfo/v2/me', {
    headers: { Authorization: `Bearer ${accessToken}` },
  });

  return await userInfoResponse.json();
}

logInAsync(config: LogInConfig): Promise<LogInResult>
This method uses AppAuth to authenticate; for even more native functionality see expo-google-sign-in.
Prompts the user to log into Google and grants your app permission to access some of their Google data, as specified by the scopes. The difference between this method and native authentication are very sparce. Google has done a very good job at making the web auth flow work consistently. The biggest difference is that you cannot use expo-google-sign-in in the Expo Client (standalone apps only), which makes Expo.Google.logInAsync your best solution for testing in development.
Parameters
NameTypeDescription
configLogInConfigUsed to log into your Google application.
LogInConfig
NameTypeDescription
clientIdstringWeb API key that denotes the Google application to log in to
scopesstring[]An array specifying the scopes to ask for from Google for this login (more information here). Default scopes are `['profile', 'email']
androidClientIdstringDEPRECATED use clientId instead
iosClientIdstringDEPRECATED use clientId instead
androidStandaloneAppClientIdstringDEPRECATED use clientId instead
iosStandaloneAppClientIdstringDEPRECATED use clientId instead
webClientIdstringDEPRECATED use clientId instead
Returns
NameTypeDescription
logInResultPromise<LogInResult>Resolves into the results of your login attempt.
LogInResult
NameTypeDescription
type'cancel' | 'success'Denotes the summary of the user event.
accessTokenstring | undefinedUsed for accessing data from Google, invalidate to "log out"
idTokenstring | nullID token
refreshTokenstring | nullRefresh the other tokens.
userGoogleUserAn object with data regarding the authenticated user.
GoogleUser
NameTypeDescription
idstring | undefinedoptional ID for the user
namestring | undefinedoptional name for the user
givenNamestring | undefinedoptional first name for the user
familyNamestring | undefinedoptional last name for the user
photoUrlstring | undefinedoptional photo for the user
emailstring | undefinedoptional email address for the user
Example
import { Google } from 'expo';

const clientId = '<YOUR_WEB_CLIENT_ID>';
const { type, accessToken, user } = await Google.logInAsync({ clientId });

if (type === 'success') {
  /* `accessToken` is now valid and can be used to get data from the Google API with HTTP requests */
  console.log(user);
}

logOutAsync({ accessToken, clientId }): Promise<any>
Invalidates the provided accessToken, given the clientId used to sign-in is provided. This method is an alias for the following functionality:
import { AppAuth } from 'expo-app-auth';

async function logOutAsync({ accessToken, clientId }): Promise<any> {
  const config = {
    issuer: 'https://accounts.google.com',
    clientId,
  };

  return await AppAuth.revokeAsync(config, {
    token: accessToken,
    isClientIdProvided: !!clientId,
  });
}
Parameters
NameTypeDescription
options{ accessToken: string, clientId: string }Used to log out of the Google application.
options
NameTypeDescription
accessTokenstringProvided when the user authenticates with your Google application.
clientIdstringUsed to identify the corresponding application.
Example
import { Google } from 'expo';

const clientId = '<YOUR_WEB_CLIENT_ID>';
const { type, accessToken } = await Google.logInAsync({ clientId });

if (type === 'success') {
  /* Log-Out */
  await Google.logOutAsync({ clientId, accessToken });
  /* `accessToken` is now invalid and cannot be used to get data from the Google API with HTTP requests */
}

In the Expo Client app, you can only use browser-based login (this works very well actually because it re-uses credentials saved in your system browser). If you build a standalone app, you can use the native login with the package expo-google-sign-in.
To use Google Sign In, you will need to create a project in Firebase (or on the Google Developer Console). In Firebase create a project, then enable Google Sign-In in the Authentication tab on the left side of the page.

If you need to access Google APIs using the user's authorization you need to pass an additional web client id. This will add accessToken, idToken, refreshToken and serverAuthCode to the response object that you can use on your server with the client id secret.
  1. Open your browser to Google Developer Credentials
  2. Click Create credentials and then OAuth client ID, then choose web and press Create.
When your app is running as an Expo experience, the process is a little different. Due to Google's restrictions, the only way to make this work is via web authentication flow. Once you have your code, send it to your backend and exchange it, but make sure to set the redirect_uri parameter to the same value you used on your client side call to Google. (Something similar to https://auth.expo.io/@username/your-app-slug). With Expo, you can easily authenticate your user with the AuthSession module:
let result = await Expo.AuthSession.startAsync({
  authUrl:
    `https://accounts.google.com/o/oauth2/v2/auth?` +
    `&client_id=${googleWebAppId}` +
    `&redirect_uri=${encodeURIComponent(redirectUrl)}` +
    `&response_type=code` +
    `&access_type=offline` +
    `&scope=profile`,
});