본문 바로가기

시작하기

GitHub

AI-Assisted Setup으로 플러그인을 설치할 수 있습니다. 다음 명령어로 AI 도구에 Capgo 스킬을 추가하세요:

터미널 창
npx skills add https://github.com/Cap-go/capgo-skills --skill capacitor-plugins

그런 다음 아래 프롬프트를 사용하세요:

Use the `capacitor-plugins` skill from `Cap-go/capgo-skills` to install the `@capgo/capacitor-native-biometric` plugin in my project.

수동 설정을 선호한다면, 다음 명령어를 실행하여 플러그인을 설치하고 아래의 플랫폼별 지침을 따르세요:

터미널 창
bun add @capgo/capacitor-native-biometric
bunx cap sync
import { NativeBiometric } from '@capgo/capacitor-native-biometric';

빠른 시작: 생체 인증으로 로그인 보호하기

“빠른 시작: 생체 인증 로그인 구현하기” 섹션
import { NativeBiometric } from '@capgo/capacitor-native-biometric';
async function biometricLogin() {
const { isAvailable } = await NativeBiometric.isAvailable();
if (!isAvailable) {
return fallbackToPasscode();
}
try {
const { username, password } = await NativeBiometric.getSecureCredentials({
server: 'https://api.example.com',
});
await signIn(username, password);
} catch {
return fallbackToPasscode();
}
}

먼저 다음을 사용하여 비밀 정보를 저장하세요: setCredentials 및 accessControl 데이터를 읽을 때 생체 인증 보호가 필요한 경우

예시: 다음으로 잠금 해제 verifyIdentity

“예시: verifyIdentity로 잠금 해제” 섹션

getSecureCredentials() 자격 증명에 생체 인증을 사용하면 이미 프롬프트가 표시됩니다 accessControl. 다음을 사용하세요 verifyIdentity() 기타 권한이 필요한 작업에 적용하거나, 경로 취소 또는 잠금 발생 시 사용자 패스코드 흐름으로 연결하세요.

try {
await NativeBiometric.verifyIdentity({
reason: 'Unlock your account',
title: 'Biometric login',
});
} catch {
return fallbackToPasscode();
}

예제: 로그아웃 시 vault 항목 삭제

“예시: 로그아웃 시 vault 항목 삭제” 섹션
await NativeBiometric.deleteCredentials({ server: 'https://api.example.com' });

예제: 생체 인증 등록 변경 시 반응하기

“예시: 생체 인증 등록 변경 시 반응하기” 섹션
await NativeBiometric.addListener('biometryChange', async () => {
const { isAvailable } = await NativeBiometric.isAvailable();
if (!isAvailable) showPasscodeUi();
});

자주 하는 실수

“흔한 실수” 섹션
  • getSecureCredentials 사전 설정이 필요합니다: accessControl저장 시 생체 인식 액세스 플래그를 사용하거나, getCredentials 추가 prompt 없이 사용하세요.
  • 사용자 잠금: 다음을 처리하세요: BiometricAuthError.USER_LOCKOUT 및 BiometricAuthError.USER_TEMPORARY_LOCKOUT 과 verifyIdentity 대기 시간 UI를 통해 처리합니다.
  • Simulator: 테스트 전 Simulator에 지문이나 얼굴을 등록하세요.

생체 인증 하드웨어 사용 가능 여부를 확인합니다.

import { NativeBiometric } from '@capgo/capacitor-native-biometric';
const result = await NativeBiometric.isAvailable();
console.log(result);

사용자에게 생체 인증을 요청합니다.

import { NativeBiometric } from '@capgo/capacitor-native-biometric';
await NativeBiometric.verifyIdentity();

지정된 서버의 저장된 인증 정보를 가져옵니다.

import { NativeBiometric } from '@capgo/capacitor-native-biometric';
const result = await NativeBiometric.getCredentials({ server: 'example.com' });
// The result holds sensitive values: use it without logging it.

지정된 서버의 인증 정보를 저장합니다.

import { NativeBiometric } from '@capgo/capacitor-native-biometric';
await NativeBiometric.setCredentials({
username: 'username',
password: 'password',
server: 'example.com',
});

지정된 서버의 저장된 인증 정보를 삭제합니다.

import { NativeBiometric } from '@capgo/capacitor-native-biometric';
await NativeBiometric.deleteCredentials({ server: 'example.com' });

생체 인증을 통해 지정된 서버의 저장된 인증 정보를 가져옵니다. 인증 정보는 accessControl이 BIOMETRY_CURRENT_SET 또는 BIOMETRY_ANY로 설정되어 저장되어야 합니다.

iOS에서는 보호된 Keychain 항목에 접근할 때 시스템이 자동으로 생체 인증 prompt를 표시합니다. Android에서는 인증 정보 복호화 키에 바인딩된 CryptoObject와 함께 BiometricPrompt가 표시됩니다.

import { NativeBiometric } from '@capgo/capacitor-native-biometric';
const result = await NativeBiometric.getSecureCredentials({ server: 'example.com' });
// The result holds sensitive values: use it without logging it.

지정된 서버에 대한 인증 정보가 이미 저장되어 있는지 확인합니다.

import { NativeBiometric } from '@capgo/capacitor-native-biometric';
const result = await NativeBiometric.isCredentialsSaved({ server: 'example.com' });
console.log(result);

타입 레퍼런스

“타입 참조” 섹션
export interface IsAvailableOptions {
/**
* Only for iOS.
* Specifies if should fallback to passcode authentication if biometric authentication is not available.
* On Android, this parameter is ignored due to BiometricPrompt API constraints:
* DEVICE_CREDENTIAL authenticator and negative button (cancel) are mutually exclusive.
*/
useFallback: boolean;
}

생체 인증 가능 여부를 나타내는 isAvailable() 메서드의 결과값입니다.

export interface AvailableResult {
/**
* Whether authentication is available (biometric or fallback if useFallback is true)
*/
isAvailable: boolean;
/**
* The strength of available authentication method (STRONG, WEAK, or NONE)
*/
authenticationStrength: AuthenticationStrength;
/**
* The primary biometry type available on the device.
* On Android devices with multiple biometry types, this returns MULTIPLE.
* Use this for display purposes only - always use isAvailable for logic decisions.
*/
biometryType: BiometryType;
/**
* Whether the device has a secure lock screen (PIN, pattern, or password).
* This is independent of biometric enrollment.
*/
deviceIsSecure: boolean;
/**
* Whether strong biometry (Face ID, Touch ID, or fingerprint on devices that consider it strong)
* is specifically available, separate from weak biometry or device credentials.
*/
strongBiometryIsAvailable: boolean;
/**
* Error code from BiometricAuthError enum. Only present when isAvailable is false.
* Indicates why biometric authentication is not available.
* @see BiometricAuthError
*/
errorCode?: BiometricAuthError;
}

생체 인증 변경 리스너를 위한 콜백 타입입니다.

export type BiometryChangeListener = (result: AvailableResult) => void;
export interface BiometricOptions {
reason?: string;
title?: string;
subtitle?: string;
description?: string;
negativeButtonText?: string;
/**
* Only for iOS.
* Specifies if should fallback to passcode authentication if biometric authentication fails.
* On Android, this parameter is ignored due to BiometricPrompt API constraints:
* DEVICE_CREDENTIAL authenticator and negative button (cancel) are mutually exclusive.
*/
useFallback?: boolean;
/**
* Only for iOS.
* Set the text for the fallback button in the authentication dialog.
* If this property is not specified, the default text is set by the system.
*/
fallbackTitle?: string;
/**
* Only for Android.
* Set a maximum number of attempts for biometric authentication. The maximum allowed by android is 5.
* @default 1
*/
maxAttempts?: number;
/**
* Only for Android.
* Specify which biometry types are allowed for authentication.
* If not specified, all available types will be allowed.
* @example [BiometryType.FINGERPRINT, BiometryType.FACE_AUTHENTICATION]
*/
allowedBiometryTypes?: BiometryType[];
}
export interface GetCredentialOptions {
server: string;
}
export interface Credentials {
username: string;
password: string;
}
export interface SetCredentialOptions {
username: string;
password: string;
server: string;
/**
* Access control level for the stored credentials.
* When set to BIOMETRY_CURRENT_SET or BIOMETRY_ANY, the credentials are
* hardware-protected and require biometric authentication to access.
*
* On iOS, this adds SecAccessControl to the Keychain item.
* On Android, this creates a biometric-protected Keystore key and requires
* BiometricPrompt authentication for both storing and retrieving credentials.
*
* @default AccessControl.NONE
* @since 8.4.0
*/
accessControl?: AccessControl;
}
export interface DeleteCredentialOptions {
server: string;
}

GetSecureCredentialsOptions

“GetSecureCredentialsOptions” 섹션
export interface GetSecureCredentialsOptions {
server: string;
/**
* Reason for requesting biometric authentication.
* Displayed in the biometric prompt on both iOS and Android.
*/
reason?: string;
/**
* Title for the biometric prompt.
* Only for Android.
*/
title?: string;
/**
* Subtitle for the biometric prompt.
* Only for Android.
*/
subtitle?: string;
/**
* Description for the biometric prompt.
* Only for Android.
*/
description?: string;
/**
* Text for the negative/cancel button.
* Only for Android.
*/
negativeButtonText?: string;
}
export interface IsCredentialsSavedOptions {
server: string;
}
export interface IsCredentialsSavedResult {
isSaved: boolean;
}
export enum AuthenticationStrength {
/**
* No authentication available, even if PIN is available but useFallback = false
*/
NONE = 0,
/**
* Strong authentication: Face ID on iOS, fingerprints on devices that consider fingerprints strong (Android).
* Note: PIN/pattern/password is NEVER considered STRONG, even when useFallback = true.
*/
STRONG = 1,
/**
* Weak authentication: Face authentication on Android devices that consider face weak,
* or PIN/pattern/password if useFallback = true (PIN is always WEAK, never STRONG).
*/
WEAK = 2,
}

이 페이지는 플러그인의 src/definitions.tsupstream에서 public API가 변경되면 sync를 다시 실행하세요.

사용 중이라면 시작하기 인증 및 계정 흐름을 설계할 때, 이를 다음 항목과 연결하세요: @capgo/capacitor-native-biometric 사용하기 @capgo/capacitor-native-biometric 사용하기에서 네이티브 기능을 위해, @capgo/capacitor-social-login @capgo/capacitor-social-login의 구현 세부 사항은, @capgo/capacitor-passkey @capgo/capacitor-passkey의 구현 세부 사항은 @capgo/capacitor-native-biometric @capgo/capacitor-native-biometric의 구현 세부 사항은, 2단계 인증 2단계 인증의 구현 세부 사항에 대해서는