@nativescript/firebase-ui

内容

简介
为您的应用设置 Firebase
将 FirebaseUI for Auth SDK 添加到您的应用中
在 Firebase 控制台中启用登录方法
调用 FirebaseUI 身份验证流程
- 用户登出
API
- UI 对象
  - android
  - ios
  - app
  - useEmulator()
  - show()
  - delete()
  - signOut()
- 配置接口
- IIdpResponse 对象
  - android
  - ios
  - isNewUser
  - hasCredentialForLinking
  - email
  - idpSecret
  - idpToken
  - phoneNumber
  - providerType
  - user
- User 对象
  - android
  - ios
  - name
  - email
  - phoneNumber
  - photoURI
  - providerId

简介

使用此插件，您可以在 NativeScript 应用中使用 FirebaseUI for Auth 库。FirebaseUI for Auth 是一个库，提供了一种即插即用的身份验证解决方案，用于处理使用电子邮件和密码、电话号码、Google、Facebook、Twitter 等用户注册和登录的 UI 流程。

为您的应用设置 Firebase

在您启用 FirebaseUI for Auth 之前，需要为您的应用设置 Firebase。要为您的 NativeScript 应用设置和初始化 Firebase，请遵循 @nativescript/firebase-core 插件的文档中的说明。

将 FirebaseUI for Auth SDK 添加到您的应用中

要将 FirebaseUI SDK 添加到您的应用中，请按照以下步骤操作

在项目的根目录中运行以下命令来安装 npm install @nativescript/firebase-ui 插件。

npm install @nativescript/firebase-ui

通过在应用的理想主文件（例如 app.ts 或 main.ts）中导入一次 @nativescript/firebase-messaging 模块来添加 SDK。

import '@nativescript/firebase-ui';

在 Firebase 控制台中启用登录方法

与 @nativescript/firebase-auth 一样，您需要前往 Firebase 控制台并启用您希望提供给用户的登录方法。有关如何操作的更多信息，请参阅设置登录方法。

调用 FirebaseUI 身份验证流程

要调用 FirebaseUI 身份验证流程，请在返回 UI 对象的 show 方法上使用一个指定身份验证选项的配置类型的对象 - 通过 firebase().ui() 返回。

import { firebase } from '@nativescript/firebase-core';
import { AppleProvider, EmailProvider, GithubProvider, GoogleProvider, MicrosoftProvider, TwitterProvider, YahooProvider } from '@nativescript/firebase-ui';

firebase()
    .ui()
    .show({
        providers: [
            new AppleProvider(),
            new GoogleProvider(),
            new TwitterProvider(),
            new GithubProvider(),
            new EmailProvider(),
            new MicrosoftProvider(),
            new YahooProvider()],
    })
    .then((result: IIdpResponse) => {
        console.log(result.user);
        console.log(result.hasCredentialForLinking);
        console.log(result.providerType);
    })
    .catch((error) => {
        console.error('show error:', error);
    });

用户登出

要登出用户，请在通过 firebase().ui() 返回的 UI 对象上调用 signOut 方法。

import { firebase } from '@nativescript/firebase-core';


firebase()
    .ui()
    .signOut()
    .then(() => {
        console.log('signOut complete');
    })
    .catch((e) => {
        console.error('signOut error:', e);
    });

API

UI 对象

UI 对象提供了 FirebaseUI for Auth 库的 API，并具有以下成员。

android

import { firebase } from '@nativescript/firebase-core';

uiAndroid: com.firebase.ui.auth.AuthUI = firebase().ui().android;

一个返回 Android UI 对象的只读属性。

ios

import { firebase } from '@nativescript/firebase-core';

uiIOS: FUIAuth = firebase().ui().ios;

一个返回 iOS UI 对象的只读属性。

app

import { firebase } from '@nativescript/firebase-core';

app: FirebaseApp = firebase().ui().app;

一个返回您的应用的 FirebaseApp 实例的只读属性。

useEmulator()

import { firebase } from '@nativescript/firebase-core';

firebase()
    .ui()
    .useEmulator(host, port);

允许您将 com.firebase.ui.auth.AuthUI 实例指向特定主机和端口的模拟器。

参数	类型	描述
`host`	`字符串`	模拟器的主机。
`port`	`数字`	模拟器的端口。

show()

import { firebase } from '@nativescript/firebase-core';

firebase()
    .ui()
    .show(config)
    .then((result: IIdpResponse) => {
        console.log(result.user);
        console.log(result.hasCredentialForLinking);
        console.log(result.providerType);
    })
    .catch((error) => {
        console.error('show error:', error);
    });

展示身份联合UI界面，用户可以选择从列表中选择身份联合提供者（IDP）进行登录或注册。如果用户选择使用联合IDP进行登录，登录流程将使用IDP的登录SDK完成，并返回的IDP凭据将与当前用户关联。此方法返回一个解析为IIdpResponse对象的Promise。

参数	类型	描述
`配置`	Config	`config`参数指定认证选项，例如用于用户认证的联合身份提供者列表等。

delete()

import { firebase } from '@nativescript/firebase-core';

firebase()
    .ui()
    .delete()
    .then(() => {
        console.log('delete complete');
    })
    .catch((e) => {
        console.error('delete error:', e);
    });

异步删除当前用户的账户。

signOut()

import { firebase } from '@nativescript/firebase-core';

firebase()
    .ui()
    .signOut()
    .then(() => {
        console.log('signOut complete');
    })
    .catch((e) => {
        console.error('signOut error:', e);
    });

异步注销当前用户。

配置接口

Config对象指定认证流程选项，例如可用的身份提供者、电子邮件链接、UI主题和其他选项。

export interface Config {
	providers: IProvider[];
	anonymousUsersAutoUpgrade?: boolean;
	emailLink?: string;
	resetPasswordSettings?: IActionCodeSettings;
	theme?: number; // Android only
	lockOrientation?: boolean;
	tosAndPrivacyPolicy?: {
		tos: string;
		privacyPolicy: string;
	};

	alwaysShowSignInMethodScreen?: boolean;
}

IIdpResponse 对象

当UI对象的show方法成功解析时，它返回具有以下成员的IIdpResponse对象。

android

import { firebase } from '@nativescript/firebase-core';

firebase()
    .ui()
    .show(config)
    .then((result: IIdpResponse) => {
        responseAndroid: com.firebase.ui.auth.IdpResponse = result.android;
    })
    .catch((error) => {
        console.error('show error:', error);
    });

一个只读属性，返回Android的IdpResponse实例。

ios

import { firebase } from '@nativescript/firebase-core';

firebase()
    .ui()
    .show(config)
    .then((result: IIdpResponse) => {
        responseIOS: com.firebase.ui.auth.IdpResponse = result.ios;
    })
    .catch((error) => {
        console.error('show error:', error);
    });

一个只读属性，返回iOS的IdpResponse实例。

isNewUser

import { firebase } from '@nativescript/firebase-core';

firebase()
    .ui()
    .show(config)
    .then((result: IIdpResponse) => {
        isNewUser: boolean = result.isNewUser;
    })
    .catch((error) => {
        console.error('show error:', error);
    });

如果用户是首次注册，则返回true，否则返回false。

hasCredentialForLinking

import { firebase } from '@nativescript/firebase-core';

firebase()
    .ui()
    .show(config)
    .then((result: IIdpResponse) => {
        hasCredentialForLinking: boolean = result.hasCredentialForLinking;
    })
    .catch((error) => {
        console.error('show error:', error);
    });

如果任何联合身份提供者（IDP）有用于将Firebase账户关联的凭据，则返回true，否则返回false。

email

import { firebase } from '@nativescript/firebase-core';

firebase()
    .ui()
    .show(config)
    .then((result: IIdpResponse) => {
        email: string = result.email;
    })
    .catch((error) => {
        console.error('show error:', error);
    });

返回用户用于登录的电子邮件。

idpSecret

import { firebase } from '@nativescript/firebase-core';

firebase()
    .ui()
    .show(config)
    .then((result: IIdpResponse) => {
        idpSecret: boolean = result.idpSecret;
    })
    .catch((error) => {
        console.error('show error:', error);
    });

（仅限Twitter）返回使用Twitter登录后接收到的令牌密钥。

idpToken

import { firebase } from '@nativescript/firebase-core';

firebase()
    .ui()
    .show(config)
    .then((result: IIdpResponse) => {
        idpToken: boolean = result.idpToken;
    })
    .catch((error) => {
        console.error('show error:', error);
    });

获取指定IDP登录后接收到的令牌。

phoneNumber

import { firebase } from '@nativescript/firebase-core';

firebase()
    .ui()
    .show(config)
    .then((result: IIdpResponse) => {
        phoneNumber: string = result.phoneNumber;
    })
    .catch((error) => {
        console.error('show error:', error);
    });

获取用于登录的电话号码。

providerType

import { firebase } from '@nativescript/firebase-core';

firebase()
    .ui()
    .show(config)
    .then((result: IIdpResponse) => {
        providerType: string = result.providerType;
    })
    .catch((error) => {
        console.error('show error:', error);
    });

获取提供者类型。例如：{@link GoogleAuthProvider#PROVIDER_ID}。

user

import { firebase } from '@nativescript/firebase-core';

firebase()
    .ui()
    .show(config)
    .then((result: IIdpResponse) => {
        user: User = result.user;
    })
    .catch((error) => {
        console.error('show error:', error);
    });

返回用户数据对象。

User 对象

此对象代表联合身份提供者（IDP）提供的用户数据。

android

userAndroid: com.firebase.ui.auth.data.model.User = user.android;

一个只读属性，返回Android的User实例。

ios

userIOS: FIRUser = user.ios;

一个只读属性，返回iOS的FIRUser实例。

name

name: string = user.name;

一个只读属性，返回用户的显示名称。

email

email: string = user.email;

一个只读属性，返回用户的电子邮件。

phoneNumber

phoneNumber: string = user.phoneNumber;

一个只读属性，返回用户的电话号码。

photoUri

photoUri: string = user.photoUri;

一个只读属性，返回用户的个人资料照片URL。

providerId

providerId: string = user.providerId;

一个只读属性，返回唯一标识提供当前用户数据的身份提供者的字符串。

许可证

Apache许可证版本2.0