react-native-nitro-google-auth

react-native-nitro-google-auth is a React Native package for implementing a "Sign in with Google" flow, built with Nitro modules.

Install

# npm
npm install react-native-nitro-google-auth react-native-nitro-modules

# yarn
yarn add react-native-nitro-google-auth react-native-nitro-modules

# pnpm
pnpm add react-native-nitro-google-auth react-native-nitro-modules

# bun
bun add react-native-nitro-google-auth react-native-nitro-modules

Google Cloud — OAuth clients

Create Web, Android, and iOS OAuth clients in one project: Google Cloud Console → Clients.

| Client | Purpose | | ------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | | Web application | Use its client ID as webClientId in GoogleAuth.configure(...). | | Android | One client per package name + signing cert. Package name must match applicationId; SHA-1 must match the keystore for the build you run. Wrong combo → runtime errors (e.g. credential / console setup errors). | | iOS | Bundle ID must match the app exactly or you get a runtime error. Use its client ID as iosClientId. |

Usage

[!IMPORTANT]
This library is by design headless. It does not provide a pre-built view for the sign-in button itself. You are expected to implement your own button that matches the Sign in with Google Branding Guidelines.

import { GoogleAuth } from "react-native-nitro-google-auth";

// Must be called before signIn()
GoogleAuth.configure({
  iosClientId: "YOUR_IOS_CLIENT_ID.apps.googleusercontent.com",
  webClientId: "YOUR_WEB_CLIENT_ID.apps.googleusercontent.com",
});

const result = await GoogleAuth.signIn();
// Send result.idToken to your backend.

await GoogleAuth.signOut();

Expo

Add the Expo config plugin with iosUrlScheme set to the reversed iOS client ID (see above). The plugin registers the URL scheme in Info.plist.

app.config.ts:

export default {
  expo: {
    plugins: [
      [
        "react-native-nitro-google-auth",
        {
          iosUrlScheme: "com.googleusercontent.apps.123456789-abc",
        },
      ],
    ],
  },
};

Bare React Native (iOS)

1. URL scheme — Add the reversed client ID to CFBundleURLTypes
2. Open URL — Implement the URL handler to forward to GIDSignIn so Google can complete the flow:

// AppDelegate.swift
import GoogleSignIn

func application(
  _ app: UIApplication,
  open url: URL,
  options: [UIApplication.OpenURLOptionsKey: Any] = [:]
) -> Bool {
  if GIDSignIn.sharedInstance.handle(url) {
    return true
  }
  return false
}

Merge this with your existing application(_:open:options:) if you already have one; forward to GIDSignIn before other handlers.

API

• GoogleAuth.configure(config)
  • iosClientId?: string
  • webClientId?: string
• GoogleAuth.signIn(): Promise<GoogleSignInResult>
  • idToken: string
  • providerUserId: string
  • email?: string
  • name?: string
  • photoUrl?: string
• GoogleAuth.signOut(): Promise<void>

Troubleshooting

| Symptom | Checks | | ----------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------- | | Android: NoCredentialException, Developer console is not set up correctly | webClientId is a Web client; Android OAuth client matches package name + SHA-1; same GCP project for all clients. | | iOS sign-in fails | Bundle ID matches iOS OAuth client; URL scheme is the reversed client ID; application(_:open:options:) calls GIDSignIn.sharedInstance.handle(url). |

References

• Android Sign in with Google (Credential Manager)
• Credential Manager troubleshooting

Credits

Bootstrapped with create-nitro-module.

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.