メインコンテンツへスキップ

Capacitor アプリでの生体認証

Capacitor アプリに安全な生体認証を実装し、ユーザー体験の向上と機密データの保護を実現する方法を学びましょう。

Capacitor アプリにおける生体認証 Capgo ブログ用イラスト

生体認証 lets users access apps securely using their fingerprint, face, or other biological traits instead of passwords. For developers working with Capacitorこの機能の実装は非常に簡単で、iOSとAndroidの両方に対応しています。概要は以下の通りです:

  • 生体認証を利用するメリット

    • パスワードよりもセキュリティが高い。
    • ログインが高速化され、UXが向上する。
    • 機密データのセキュリティ基準を満たせる。
  • サポートされている認証方法:

    • 指紋認証:迅速かつ一般的。
    • 顔認証:ハンズフリーでの利用が可能。
    • 虹彩認証:高セキュリティ用途(対応デバイス限定)。
    • 音声認識:アクセシビリティ重視(サポート限定的)。
  • 必要な主要ツール:

    • Capacitor 7.0以上
  • セットアップの要点:

    • AndroidManifestとInfo.plistに権限を追加します。
    • 安全な保存にはKeychain (iOS) または Keystore (Android) を使用します。
    • 互換性とフォールバックオプションを徹底的にテストしてください。

プラグインのクイック比較

プラグイン名 Capacitor のバージョン 機能 最適なケース
@aparajita/capacitor-biometric-auth Capacitor 8 ネイティブ生体認証とデバイス認証情報 Capacitor 8 を使用した新規プロジェクト
@capgo/capacitor-native-biometric Capacitor 8 (プラグイン v8; Capacitor 7 用は v7) 生体認証チェックと Keychain/Keystore による安全な認証情報の保存 認証情報の管理および Identity Vault の代替
その他のコミュニティプラグイン すべてのバージョン 生体認証とデバイス認証情報のサポート 柔軟な認証オプション

Capacitor アプリでの生体認証 は、機密データを保護するための安全でユーザーフレンドリーな方法です。この記事では、セットアップ手順、code の実装例、テスト戦略、セキュリティ基準について詳しく解説します。

Ionic Biometric (FaceID / FingerPrint) 認証

セットアップ要件

お使いのアプリで生体認証を有効にするには、 Capacitor アプリがいくつかのツールと依存関係を設定し、プラットフォーム固有の設定を行う必要があります。以下に、Android と iOS 両方のプラットフォームにおけるセットアップ要件をステップごとに示します。

必要なツールと依存関係

実装を始める前に、以下のツールと依存関係が準備できていることを確認してください。

コンポーネント 最小バージョン 目的
Capacitor 7.0 以上 コアフレームワーク
Node.js 最新のLTS パッケージ管理
iOSプロファイリング 最新バージョン iOS開発
デバッグ 最新バージョン Android開発
実機 iOS 13+ / Android API 23+ 生体認証機能のテスト

以下の 生体認証プラグインを Capacitor のバージョンに合わせて選択してください:

  • @aparajita/capacitor-biometric-auth Capacitor 8 用
  • @capgo/capacitor-native-biometric Capacitor 8 (plugin v8) または Capacitor 7 (plugin v7) 用。生体認証による認証付きのクレデンシャルストレージが必要な場合に使用します

Androidのセットアップ手順

Android で生体認証を設定するには、プロジェクトファイルをいくつか調整する必要があります:

  1. Manifest の設定

    以下の権限を以下に追加してください: AndroidManifest.xml ファイル内で参照します:

    <uses-permission android:name="android.permission.USE_BIOMETRIC" />
    <!-- For Android 9 (API 28) or lower -->
    <uses-permission android:name="android.permission.USE_FINGERPRINT" />
  2. Gradleの設定

    アプリの build.gradle ファイルに、必要な生体認証の依存関係を追加してください:

    dependencies {
        implementation "androidx.biometric:biometric:1.1.0"
    }

iOSのセットアップ手順

iOSの場合は、以下の手順に従って生体認証の設定を行ってください:

  1. Info.plistの設定

    必要な使用目的の説明を Info.plist ファイル内で参照します:

    <key>NSFaceIDUsageDescription</key>
    <string>Authentication required for secure access</string>
  2. Keychainの設定

    XcodeでKeychainの機能を有効にします:

    • プロジェクトの設定を開きます。
    • 以下にアクセスしてください: Signing & Capabilities タブと比較してください。
    • 次を追加します: Keychainの共有 capability。
    • 必要に応じてアクセスグループを設定してください。
  3. 認証ポリシー

    以下の項目を処理するためのローカル認証ポリシーを設定します:

    • 認証失敗時の試行
    • デバイスのパスコードへのフォールバック
    • 生体認証の利用可能性チェック

    セキュリティを高めるため、機密データの保存には iOS Keychain を使用してください。これにより、ユーザーの認証情報を保護しながら、Touch ID と Face ID の両方との互換性を確保できます。

Codeの実装

セットアップ設定が完了したら、次はセキュアなcodeの実装です。適切なプラグインを選び、信頼性の高い認証フローを構築する必要があります。

プラグイン選定ガイド

Capacitorアプリに生体認証プラグインを導入する際は、プロジェクトの要件に合わせた選択が重要です。以下に代表的な選択肢を紹介します。

プラグイン名 Capacitor のバージョン 主な機能 最適なケース
@aparajita/capacitor-biometric-auth Capacitor 8 ネイティブ生体認証、デバイス認証情報、包括的なAPI Capacitor 8 で開始する新規プロジェクト
@capgo/capacitor-native-biometric Capacitor 8 (plugin v8; Capacitor 7 用は v7) 生体認証と安全な認証情報の保存、Keychain/Keystore 連携 生体認証による認証情報の保護が必要なプロジェクト
その他のコミュニティプラグイン すべてのバージョン 生体認証とデバイス認証、クリーンな API 柔軟な認証オプションが必要なプロジェクト

認証 Code の例

使い方は以下の通りです: @capgo/capacitor-native-biometric 生体認証プラグインの使用方法:

import { NativeBiometric } from '@capgo/capacitor-native-biometric';

async function setupBiometricAuth() {
  try {
    const { isAvailable } = await NativeBiometric.isAvailable();

    if (!isAvailable) {
      return {
        success: false,
        message: "Biometric authentication not available"
      };
    }

    await NativeBiometric.verifyIdentity({
      reason: "Access your secure data",
      title: "Verify Identity",
      subtitle: "Use biometrics to authenticate"
    });

    return { success: true };
  } catch (error) {
    return {
      success: false,
      error: error.message
    };
  }
}

安全な認証情報の管理には、 capacitor-native-biometric プラグインを使うと簡単に実装できます:

import { NativeBiometric } from '@capgo/capacitor-native-biometric';

async function secureCredentialStorage(credentials) {
  try {
    await NativeBiometric.setCredentials({
      username: credentials.username,
      password: credentials.password,
      server: "api.yourserver.com"
    });

    // Verify storage by retrieving the credentials
    const stored = await NativeBiometric.getCredentials({
      server: "api.yourserver.com"
    });

    return stored.username === credentials.username;
  } catch (error) {
    console.error("Credential storage failed:", error);
    return false;
  }
}

codeを導入したら、適切なテストを通じてその機能が正しく動作するか検証することが不可欠です。

テスト方法

生体認証の信頼性とセキュリティを確保するために、以下のテスト戦略を検討してください:

  • デバイス互換性テスト

    さまざまなデバイスや条件下で認証が動作するか確認します:

    async function runCompatibilityTests() {
      const tests = {
        biometricAvailable: (await NativeBiometric.isAvailable()).isAvailable,
        credentialStorage: await testCredentialStorage(),
        authenticationFlow: await testAuthFlow(),
        fallbackMechanism: await testFallbackAuth()
      };
    
      return tests;
    }
  • エラーハンドリングと共通シナリオ

    エラーをシミュレートし、フォールバックメカニズムをテストします:

    async function validateErrorHandling() {
      try {
        await Promise.race([
          NativeBiometric.verifyIdentity(),
          new Promise((_, reject) =>
            setTimeout(() => reject(new Error("Timeout")), 30000)
          )
        ]);
      } catch (error) {
        return implementFallbackAuth();
      }
    }
  • セキュリティ検証

    実装がセキュリティ基準を満たしていることを確認します:

    async function validateSecurityMeasures() {
      const validations = {
        keychain: await validateKeychainAccess(),
        biometricStrength: await checkBiometricStrength(),
        encryptionStatus: await verifyEncryption()
      };
    
      return validations.keychain &&
             validations.biometricStrength &&
             validations.encryptionStatus;
    }

さらに、以下のようなシナリオもテストしてください:

  • 認証に複数回失敗した場合
  • デバイス再起動後の挙動
  • アプリのフォアグラウンドとバックグラウンドの切り替え
  • ネットワーク接続状態の変化
  • システム側の生体認証設定の変更

徹底的なテストを行うことで、生体認証システムが堅牢になり、実運用に耐えうるものになります。

セキュリティ基準

生体認証において強固なセキュリティを確保するには、データ保護を最優先し、コンプライアンス規制を遵守し、多層防御の技術を適用することが重要です。

データセキュリティ手法

iOSでは、生体認証データは以下の仕組みを用いて暗号化・保存されます: Keychain、一方Androidでは Keystoreを使用します。もし capacitor-native-biometric pluginを使用している場合、ユーザーの認証情報を次のように安全に保存できます:

import { NativeBiometric } from '@capgo/capacitor-native-biometric';

async function securelyStoreCredentials(username, password) {
  const server = "api.yourapp.com";

  // Use the highest available encryption
  await NativeBiometric.setCredentials({
    username,
    password,
    server,
    authenticationType: "biometricAndDevice",
    accessControl: "biometryAny"
  });
}

データ送信時には、必ず エンドツーエンド暗号化 機密情報を保護する仕組みを実装してください。

ストアガイドライン

アプリストアは、次の項目に厳格なルールを課しています: 生体認証のセキュリティ主要なプラットフォーム要件の内訳は次のとおりです:

プラットフォーム 主な要件 実装時の注意点
iOSと LocalAuthenticationフレームワークを使用し、フォールバック手段を用意した上で、ユーザーの明確な同意を確保してください Face IDとTouch IDの両方に対応する必要があります
Androidでは BiometricPrompt APIを活用し、ユーザーの明示的な許可を取得した上で、セキュリティレベルを宣言してください 指紋や顔認証に対応し、セキュリティレベルに応じた使い分けが可能

マルチファクタ設定

セキュリティを強化するには、多くの場合、以下の要素を組み合わせる必要があります: 生体認証 と、追加の認証レイヤーです。例えば、初回 生体認証、ユーザーの本人確認を行うための追加ステップを追加できます:

async function setupMultiFactorAuth() {
  // First factor: Biometric verification
  // verifyIdentity rejects if the user cancels or fails the check
  try {
    await NativeBiometric.verifyIdentity({
      reason: "Verify your identity",
      title: "Authentication Required"
    });
  } catch {
    return false;
  }

  // Second factor: Time-based OTP or similar mechanism
  const totpResult = await verifyTOTP();
  return totpResult.success;
}

マルチファクタ(多要素)認証には、通常以下が含まれます:

  • 第1段階の生体認証
  • 第2段階の検証 (例:SMS code や認証アプリ)
  • トランザクションごとの確認 セキュリティ強化のため

ライブアップデートに Capgo のようなツールを使っている場合は、その機能を活用してセキュリティ基準への準拠を確保してください。 エンドツーエンド暗号化 これにより、アップデート中も生体認証方式の安全性が保たれ、プラットフォームの要件に適合させることができます。 [1].

メンテナンスガイド

速度、バッテリー効率、そしてタイムリーなアップデートのバランスをとり、生体認証システムを円滑に運用しましょう。

速度とバッテリーのTips

効率的な生体認証を実装するための code スニペットはこちらです:

// Efficient authentication implementation
async function optimizedBiometricCheck() {
  const authResult = await NativeBiometric.isAvailable();

  if (!authResult.isAvailable) {
    return handleFallback();
  }

  // Cache authentication state to avoid unnecessary re-checks
  if (this.cachedAuthState && !this.isAuthExpired()) {
    return this.cachedAuthState;
  }

  return NativeBiometric.verifyIdentity({
    reason: "Verify your identity",
    title: "Authentication Required",
    maxAttempts: 3
  });
}

生体認証システムのパフォーマンスを最大限に引き出すには:

  • バッチ認証: 複数のプロンプトを表示する代わりに、認証が必要なアクションを 1 つのセッションにまとめて中断を減らします。
  • スマートキャッシュ: 認証状態を安全に保存し、有効期限を設定することで、不要な再認証を防ぎます。
  • バックグラウンドの最適化: 認証中に不要なタスクを一時停止し、速度向上とバッテリー消費の抑制を図ります。
  • イベント駆動型アプローチ: 常時ポーリングをイベントリスナーに置き換え、認証ステータスをより効率的に監視します。

Updates with Capgo

Capgo Live Update ダッシュボードインターフェース

Capgo はアプリのアップデートを簡素化します。

Capgo がアップデート管理に最適な理由はこちらです:

  • 即時デプロイ: 重要なセキュリティ修正や新機能を遅延なくリリースできます。
  • ステージドロールアウト: 全ユーザーに展開する前に、特定のユーザーグループでアップデートをテストできます。
  • バージョン管理: 認証の各バージョンを管理・追跡しやすくなります。
  • 緊急ロールバック: 問題が発生した際、すぐに前のバージョンへ戻せます。

API アップデート

生体認証の API を最新の状態に保つことは、セキュリティと機能性の両面で不可欠です。以下のガイドラインに従って、積極的にアップデートを行いましょう:

アップデートの種類 モニタリング手法 実装タイムライン
セキュリティパッチ プラグインリポジトリのアラート 24時間
機能アップデート プラットフォームドキュメント 1週間
破壊的変更 リリースノート 2〜4週間
ストアポリシーの更新 デベロッパーポータル 申請前に

以下の点に注力してください:

  • プラットフォームの変更: iOSのLocalAuthenticationとAndroidのBiometricPrompt APIの更新を追跡します。
  • セキュリティ基準: 最新の生体認証セキュリティ要件に準拠します。
  • ストアガイドライン: Apple App StoreとGoogle Playのポリシーを遵守し、申請時の問題を回避しましょう。

まとめ

要点

Capacitor アプリに生体認証を導入するには、セキュリティ、パフォーマンス、そしてユーザー体験のバランスが重要です。考慮すべき主要な要素を以下にまとめました。

コンポーネント 実装の重点 主な考慮事項
セキュリティ基準 プラットフォームネイティブストレージ (Keychain/Keystore) エンドツーエンド暗号化と認証情報の保護
プラグインの選定 最新バージョンとの互換性 複数の生体認証タイプに対応
アップデート管理 定期的なメンテナンスサイクル セキュリティパッチの迅速なデプロイ
ユーザー体験 フォールバック認証オプション 分かりやすくユーザーフレンドリーな認証プロンプト

これらのコンポーネントは、統合を成功させるためのロードマップとなります。

生体認証を実装する手順

アプリに生体認証を統合するには、以下の手順に従ってください:

  • プラグインの統合
    まず、Capacitor のバージョンに適合する生体認証プラグインを選択してください。設定ファイル(以下など)が正しく構成されていることを確認してください。 AndroidManifest.xml と Info.plist - が適切に設定されていること。安全な認証情報の保存には、KeychainやKeystoreなどのネイティブソリューションを利用してください。

  • セキュリティ設定
    すべての認証情報の送信にエンドツーエンド暗号化を適用し、ユーザーデータを保護します。必要に応じて、 多要素認証(MFA)を を追加してセキュリティレイヤーを強化してください。障害発生時でも機能を維持できるよう、堅牢なエラーハンドリングとフォールバック策を計画しましょう。

  • 継続的なメンテナンス
    セキュリティパッチのための定期的なアップデートパイプラインを構築し、アプリの安全性を維持してください。プラグインの更新を常にチェックし、セキュリティアドバイザリを監視しましょう。Capgoのようなツールを使えば、インスタントアップデートが可能になり、このプロセスを簡素化できます。Capgoは、24時間以内のユーザーアップデート率が95%という驚異的な数値を誇っており、開発ツールキットに欠かせない存在です。 [2].

「Capgo は、生産性を高めたい開発者にとって必須のツールです。バグ修正でレビューを回避できるのは大きな強みです。」 - Bessie Cooper [2]

よくある質問

::: FAQ

Capacitor向けの生体認証プラグインの違いは何ですか?また、アプリに最適なプラグインをどのように選べばよいですか?

Capacitor アプリに生体認証プラグインを選定する際は、プロジェクト固有の要件に合わせることが極めて重要です。以下の要素を検討してください: プラットフォームの互換性 (iOS、Android、またはその両方のサポートが必要か)、統合プロセスの簡便さ、そして以下のような高度な生体認証方式への対応状況などです。 Face ID または 指紋認証.

このガイドでは主に、 Capacitor アプリにおける生体認証の実装に焦点を当てていますが、 Capgo のようなツールも非常に役立ちます。これらを使用すると、App Storeの承認を待たずにアプリへリアルタイムのアップデートを配信できます。つまり、AppleとAndroidの両方の基準を遵守しながら、生体認証のアップデートを含む最新のセキュリティ機能をアプリに即座に反映できるのです。 :::

::: FAQ

Capacitor アプリの生体認証がセキュリティ基準とアプリストアのガイドラインを満たすにはどうすればよいですか?

Capacitor アプリの生体認証を最新のセキュリティ基準とアプリストアのルールに適合させるには、次の主要なプラクティスに従ってください:

  • 信頼できるプラグインの選択: Capacitor のプラグインのような信頼できる生体認証プラグインを使い、 @capacitor/biometrics アプリのセキュリティを確保し、デバイス間でシームレスに動作するようにします。
  • プラットフォームの規約を遵守: ユーザーの同意取得、セキュアなストレージの使用、PIN やパスワードによるバックアップ手段の提供など、Apple と Android のガイドラインを遵守してください。
  • 依存関係の最新化: 脆弱性を修正し、変化する基準に対応し続けるために、アプリとライブラリを定期的にアップデートしてください。

live update のようなサービスを利用すると、 Capgo このプロセスをよりスムーズに進められます。アプリストアの審査待ちを回避して、セキュリティアップデートや改善を即座にアプリへプッシュできるため、常に安全で、Apple と Android のポリシーに準拠した最新の状態を維持できます。 :::

::: FAQ

Capacitor アプリに生体認証を組み込む際、開発者はどのような課題に直面し、それをどう解決すべきでしょうか?

Capacitor アプリへの生体認証の実装には、いくつかの課題が伴います。デバイス間の互換性の確保、ユーザー権限の適切な管理、機密データの安全な取り扱いなどが挙げられます。これらの問題への対処法を以下に紹介します。

  • デバイスの互換性: AndroidとiOSの両方で生体認証機能をサポートするには、次のようなプラグインの使用を検討してください。 @capacitor-fingerprint-auth. これらのツールはプラットフォーム間の差異を埋め、さまざまなデバイスでアプリがシームレスに動作するようにします。

  • ユーザー権限: アプリが生体認証へのアクセスを必要とする理由を明確に説明することが重要です。ユーザーに透明性のある情報を提供し、権限を許可しなかった場合でもアプリが適切に対応できるよう設計してください。

  • データセキュリティ: 認証データの保護は非常に重要です。以下の 暗号化のベストプラクティス に従い、各プラットフォームが提供するセキュリティガイドラインを遵守して、機密情報を安全に保ってください。

アプリストアの審査を待たずに、生体認証機能のアップデートや問題修正を行うには、Capgo のようなツールを利用できます。これによりリアルタイム更新が可能になり、AppleとAndroidのポリシーを守りながら、バグ修正や機能改善をすばやく行えます。 :::

Capacitor アプリにおける生体認証の続きはこちら

使用している場合 Capacitor アプリでの生体認証 セキュリティとコンプライアンスを計画するには、これを以下と連携させてください 暗号化 暗号化の実装詳細について コンプライアンス コンプライアンスの実装詳細について Capgo セキュリティスキャナー Capgo Security Scanner のプロダクトワークフローについて Capgo のセキュリティ Capgo Security のプロダクトワークフロー向け、および Capgo トラストセンター Capgo Trust Center のプロダクトワークフロー向け。

Capacitor アプリ向けの Live Updates

Web レイヤーのバグが本番で発生したら、App Store の審査を何日も待たずに Capgo で修正を配信しましょう。ネイティブの変更は通常の審査フローに残したまま、ユーザーはバックグラウンドでアップデートを受け取れます。

最新のブログ記事

Capgoは、真にプロフェッショナルなモバイルアプリを作るために必要な最高のインサイトを提供します。