merganon / capacitor-firebase-authentication

⚡️ Capacitor plugin for Firebase Authentication.

Firebase Authentication

@robingenz/capacitor-firebase-authentication

Capacitor plugin for Firebase Authentication.

Maintainers

Maintainer	GitHub	Social
Robin Genz	robingenz	@robin_genz

Installation

npm install @robingenz/capacitor-firebase-authentication
npx cap sync

Add Firebase to your project if you haven't already (Android / iOS).

On iOS, verify that this function is included in your app's AppDelegate.swift:

func application(_ app: UIApplication, open url: URL, options: [UIApplication.OpenURLOptionsKey : Any] = [:]) -> Bool {
  return ApplicationDelegateProxy.shared.application(app, open: url, options: options)
}

The further installation steps depend on the selected authentication method:

• Apple Sign-In
• Facebook Sign-In
• GitHub Sign-In
• Google Sign-In
• Microsoft Sign-In
• Twitter Sign-In
• Yahoo Sign-In
• Phone Number Sign-In

Configuration

These configuration values are available:

Prop	Type	Description	Default
skipNativeAuth	boolean	Configure whether the plugin should skip the native authentication. Only needed if you want to use the Firebase JavaScript SDK. Only available for Android and iOS.	false
providers	string[]	Configure which providers you want to use so that only the providers you need are initialized. If you do not configure any providers, they will be all initialized. Only available for Android and iOS.	["apple.com", "facebook.com", "github.com", "google.com", "microsoft.com", "twitter.com", "yahoo.com", "phone"]

Examples

In capacitor.config.json:

{
  "plugins": {
    "FirebaseAuthentication": {
      "skipNativeAuth": false,
      "providers": ["apple.com", "google.com"]
    }
  }
}

In capacitor.config.ts:

/// <reference types="@capacitor/firebase-authentication" />

import { CapacitorConfig } from '@capacitor/cli';

const config: CapacitorConfig = {
  plugins: {
    FirebaseAuthentication: {
      skipNativeAuth: false,
      providers: ["apple.com", "google.com"],
    },
  },
};

export default config;

Usage

import { FirebaseAuthentication } from '@robingenz/capacitor-firebase-authentication';

const getCurrentUser = async () => {
  const result = await FirebaseAuthentication.getCurrentUser();
  return result.user;
};

const getIdToken = async () => {
  const result = await FirebaseAuthentication.getIdToken();
  return result.token;
};

const setLanguageCode = async () => {
  await FirebaseAuthentication.setLanguageCode({ languageCode: 'en-US' });
};

const signInWithApple = async () => {
  await FirebaseAuthentication.signInWithApple();
};

const signInWithFacebook = async () => {
  await FirebaseAuthentication.signInWithFacebook();
};

const signInWithGithub = async () => {
  await FirebaseAuthentication.signInWithGithub();
};

const signInWithGoogle = async () => {
  await FirebaseAuthentication.signInWithGoogle();
};

const signInWithMicrosoft = async () => {
  await FirebaseAuthentication.signInWithMicrosoft();
};

const signInWithPhoneNumber = async () => {
  const { verificationId } = await FirebaseAuthentication.signInWithPhoneNumber(
    {
      phoneNumber: '123456789',
    },
  );
  const verificationCode = window.prompt(
    'Please enter the verification code that was sent to your mobile device.',
  );
  await FirebaseAuthentication.signInWithPhoneNumber({
    verificationId,
    verificationCode,
  });
};

const signInWithTwitter = async () => {
  await FirebaseAuthentication.signInWithTwitter();
};

const signInWithYahoo = async () => {
  await FirebaseAuthentication.signInWithYahoo();
};

const signOut = async () => {
  await FirebaseAuthentication.signOut();
};

const useAppLanguage = async () => {
  await FirebaseAuthentication.useAppLanguage();
};

API

• getCurrentUser()
• getIdToken(...)
• setLanguageCode(...)
• signInWithApple(...)
• signInWithFacebook(...)
• signInWithGithub(...)
• signInWithGoogle(...)
• signInWithMicrosoft(...)
• signInWithPhoneNumber(...)
• signInWithTwitter(...)
• signInWithYahoo(...)
• signOut()
• useAppLanguage()
• Interfaces

getCurrentUser()

getCurrentUser() => Promise<GetCurrentUserResult>

Fetches the currently signed-in user.

Only available for Android and iOS.

Returns: Promise<GetCurrentUserResult>

---

getIdToken(...)

getIdToken(options?: GetIdTokenOptions | undefined) => Promise<GetIdTokenResult>

Fetches the Firebase Auth ID Token for the currently signed-in user.

Only available for Android and iOS.

Param	Type
options	GetIdTokenOptions

Returns: Promise<GetIdTokenResult>

---

setLanguageCode(...)

setLanguageCode(options: SetLanguageCodeOptions) => Promise<void>

Sets the user-facing language code for auth operations.

Only available for Android and iOS.

Param	Type
options	SetLanguageCodeOptions

---

signInWithApple(...)

signInWithApple(options?: SignInOptions | undefined) => Promise<SignInResult>

Starts the Apple sign-in flow.

Only available for Android and iOS.

Param	Type
options	SignInOptions

Returns: Promise<SignInResult>

---

signInWithFacebook(...)

signInWithFacebook(options?: SignInOptions | undefined) => Promise<SignInResult>

Starts the Facebook sign-in flow.

Only available for Android and iOS.

Param	Type
options	SignInOptions

Returns: Promise<SignInResult>

---

signInWithGithub(...)

signInWithGithub(options?: SignInOptions | undefined) => Promise<SignInResult>

Starts the GitHub sign-in flow.

Only available for Android and iOS.

Param	Type
options	SignInOptions

Returns: Promise<SignInResult>

---

signInWithGoogle(...)

signInWithGoogle(options?: SignInOptions | undefined) => Promise<SignInResult>

Starts the Google sign-in flow.

Only available for Android and iOS.

Param	Type
options	SignInOptions

Returns: Promise<SignInResult>

---

signInWithMicrosoft(...)

signInWithMicrosoft(options?: SignInOptions | undefined) => Promise<SignInResult>

Starts the Microsoft sign-in flow.

Only available for Android and iOS.

Param	Type
options	SignInOptions

Returns: Promise<SignInResult>

---

signInWithPhoneNumber(...)

signInWithPhoneNumber(options: SignInWithPhoneNumberOptions) => Promise<SignInWithPhoneNumberResult>

Starts the sign-in flow using a phone number.

Either the phone number or the verification code and verification ID must be provided.

Only available for Android and iOS.

Param	Type
options	SignInWithPhoneNumberOptions

Returns: Promise<SignInWithPhoneNumberResult>

---

signInWithTwitter(...)

signInWithTwitter(options?: SignInOptions | undefined) => Promise<SignInResult>

Starts the Twitter sign-in flow.

Only available for Android and iOS.

Param	Type
options	SignInOptions

Returns: Promise<SignInResult>

---

signInWithYahoo(...)

signInWithYahoo(options?: SignInOptions | undefined) => Promise<SignInResult>

Starts the Yahoo sign-in flow.

Only available for Android and iOS.

Param	Type
options	SignInOptions

Returns: Promise<SignInResult>

---

signOut()

signOut() => Promise<void>

Starts the sign-out flow.

Only available for Android and iOS.

---

useAppLanguage()

useAppLanguage() => Promise<void>

Sets the user-facing language code to be the default app language.

Only available for Android and iOS.

---

Interfaces

GetCurrentUserResult

Prop	Type	Description
user	User | null	The currently signed-in user, or null if there isn't any.

User

Prop	Type
displayName	string | null
email	string | null
emailVerified	boolean
isAnonymous	boolean
phoneNumber	string | null
photoUrl	string | null
providerId	string
tenantId	string | null
uid	string

GetIdTokenResult

Prop	Type	Description
token	string	The Firebase Auth ID token JWT string.

GetIdTokenOptions

Prop	Type	Description
forceRefresh	boolean	Force refresh regardless of token expiration.

SetLanguageCodeOptions

Prop	Type	Description
languageCode	string	BCP 47 language code. Example: en-US.

SignInResult

Prop	Type	Description
user	User | null	The currently signed-in user, or null if there isn't any.
credential	AuthCredential | null	Credentials returned by an auth provider.

AuthCredential

Prop	Type	Description
providerId	string	The authentication provider ID for the credential. Example: google.com.
accessToken	string	The OAuth access token associated with the credential if it belongs to an OAuth provider.
idToken	string	The OAuth ID token associated with the credential if it belongs to an OIDC provider.
secret	string	The OAuth access token secret associated with the credential if it belongs to an OAuth 1.0 provider.
nonce	string	The random string used to make sure that the ID token you get was granted specifically in response to your app's authentication request.

SignInOptions

Prop	Type	Description
customParameters	SignInCustomParameter[]	Configures custom parameters to be passed to the identity provider during the OAuth sign-in flow.

SignInCustomParameter

Prop	Type	Description
key	string	The custom parameter key (e.g. login_hint).
value	string	The custom parameter value (e.g. [email protected]).

SignInWithPhoneNumberResult

Prop	Type	Description
verificationId	string	The verification ID, which is needed to identify the verification code.

SignInWithPhoneNumberOptions

Prop	Type	Description
phoneNumber	string	The phone number to be verified.
verificationId	string	The verification ID which will be returned when signInWithPhoneNumber is called for the first time. The verificationCode must also be provided.
verificationCode	string	The verification code from the SMS message. The verificationId must also be provided.

FAQ

1. What does this plugin do?
   This plugin enables the use of Firebase Authentication in a Capacitor app. It uses the native Firebase SDK for Java (Android) and Swift (iOS). Accordingly, the plugin signs the user in at the native layer of the app. The Firebase JavaScript SDK is not required, but can be used.
2. Which platforms are supported?
   Currently, only Android and iOS are supported. It is planned to support web soon as well (see #20). In the meantime, the Firebase JavaScript SDK can be used.
3. How can I use this plugin with the Firebase JavaScript SDK?
   See here.

Changelog

See CHANGELOG.md.

License

See LICENSE.