Pindah ke konten utama

Aplikasi Capacitor dengan Autentikasi Biometrik

Belajar cara mengimplementasikan autentikasi biometrik yang aman di aplikasi Capacitor untuk meningkatkan pengalaman pengguna dan melindungi data sensitif.

Autentikasi Biometrik di Aplikasi Capacitor

Autentikasi Biometrik Memungkinkan pengguna mengakses aplikasi dengan aman menggunakan sidik jari, wajah, atau fitur biologis lainnya daripada kata sandi. Untuk pengembang yang bekerja dengan CapacitorMengimplementasikan fitur ini sangatlah mudah dan berfungsi baik pada baik iOS dan Android. Berikut adalah ringkasan singkatnya:

  • Mengapa Menggunakan Autentikasi Biometrik?

    • Lebih aman daripada kata sandi.
    • Mengurangi waktu login sehingga pengalaman pengguna menjadi lebih baik.
    • Mengenakan standar keamanan untuk data sensitif.
  • Metode yang Dapat Dibantu:

    • Mengikuti standar keamanan untuk data sensitif.
    • Metode yang Dapat Dibantu:
    • Authenikasi Iris: Kasus keamanan tinggi (perangkat terbatas).
    • Recognisi Suara: Fokus aksesibilitas (dukungan terbatas).
  • Alat Utama yang Diperlukan:

    • Capacitor 3.0+.
  • Spotlight Pemasangan:

    • Tambahkan izin ke AndroidManifest dan Info.plist.
    • Pakai Keychain (iOS) atau Keystore (Android) untuk penyimpanan yang aman.
    • Uji coba secara menyeluruh untuk konsistensi dan opsi fallback.

Perbandingan Cepat Plugin

Nama Plugin Capacitor Versi Fitur Terbaik Untuk
@aparajita/capacitor-biometric-auth Capacitor 8 Biometrik Asli, Kredensial Perangkat Proyek Baru Menggunakan Capacitor 8
capacitor-native-biometric Capacitor 3, 4 Pengamanan Penyimpanan Kredensial, Keychain/Keystore Pengelolaan Kredensial
Tersedia Semua Versi Dukungan Biometrik dan Kredensial Perangkat Pilihan Autentikasi Fleksibel

Autentikasi Biometrik di Aplikasi Capacitor adalah cara yang aman dan ramah pengguna untuk melindungi data sensitif. Artikel lengkap menjelaskan langkah-langkah pengaturan, contoh code, strategi pengujian, dan standar keamanan.

Autentikasi Biometrik (FaceID / FingerCetak) Ionic

Persyaratan Pengaturan

Untuk mengaktifkan autentikasi biometrik di aplikasi Anda Capacitor appAnda perlu mengonfigurasi beberapa alat, dependensi, dan pengaturan platform khusus. Berikut adalah persyaratan pengaturan langkah demi langkah untuk kedua platform Android dan iOS.

Peralatan dan Dependensi yang Diperlukan

Sebelum memasuki implementasi, pastikan peralatan dan dependensi berikut sudah siap:

Komponen Versi Minimum Tujuan
Capacitor __CAPGO_KEEP_0__ (Versi 3.0 atau lebih tinggi) Framewok inti
Node.js Versi LTS terbaru Pengelolaan Paket
Xcode Versi terbaru Pengembangan iOS
Studio Android Versi terbaru Pengembangan Android
Perangkat Fisik iOS 13+ / Android API 23+ Menguji fitur biometrik

Pilih plugin biometrik berdasarkan versi __CAPGO_KEEP_0__ Anda: @aparajita/Capacitor-autentikasi-biometrik

  • @aparajita/capacitor-biometric-auth Capacitor-biometrik-nativ
  • untuk capacitor 3 dan 4 untuk Capacitor 3 dan 4

Langkah Pengaturan Android

Untuk mengkonfigurasi autentikasi biometrik pada Android, Anda perlu melakukan beberapa perubahan pada file proyek Anda:

  1. Tambahkan izin berikut ke

    Tambahkan izin berikut ke aplikasi Anda AndroidManifest.xml file:

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

    Perbarui aplikasi Anda build.gradle Berikut file untuk mencakup dependensi biometrik yang diperlukan:

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

Langkah Pengaturan iOS

Untuk iOS, Anda perlu mengikuti langkah-langkah ini untuk mengonfigurasi autentikasi biometrik:

  1. Konfigurasi Info.plist

    Tambahkan deskripsi penggunaan yang diperlukan ke aplikasi Anda Info.plist file:

    <key>NSFaceIDUsageDescription</key>
    <string>Authentication required for secure access</string>
  2. Aktifkan kemampuan Keychain di Xcode:

    Buka pengaturan proyek Anda.

    • Buka pengaturan proyek Anda.
    • Pergi ke halaman Autentikasi Biometrik di Aplikasi Capacitor tab.
    • Tambahkan Penyimpanan Kunci kemampuan.
    • Konfigurasi kelompok akses jika perlu.
  3. Pengaturan Keamanan

    Tetapkan kebijakan autentikasi lokal untuk mengatasi:

    • Coba autentikasi gagal
    • Jatuh ke kode sandi perangkat
    • Periksa ketersediaan biometrik

    Untuk keamanan yang lebih baik, gunakan Keychain iOS untuk menyimpan data sensitif. Ini memastikan konsistensi dengan Touch ID dan Face ID serta menjaga kredensial pengguna.

Implementasi Code

Setelah konfigurasi pengaturan sudah ada, langkah berikutnya adalah mengimplementasikan code yang aman. Ini melibatkan memilih plugin yang tepat dan membuat aliran autentikasi yang dapat diandalkan.

Petunjuk Pemilihan Plugin

Jika memilih plugin autentikasi biometrik untuk aplikasi Capacitor, pilihan Anda harus sesuai dengan kebutuhan proyek. Berikut beberapa pilihan populer:

Nama Plugin Versi Capacitor Fitur Utama Terbaik Untuk
@aparajita/capacitor-biometric-auth Capacitor 8 Biometri asli, kredit perangkat, API yang komprehensif Proyek-proyek baru yang dimulai dengan Capacitor 8
capacitor-native-biometric Capacitor 3, 4 Pengamanan penyimpanan kredit, integrasi Keychain/Keystore Proyek-proyek yang sudah ada yang memerlukan pengelolaan kredit
Tersedia untuk semua versi Autentikasi biometrik dan kredit perangkat, API yang bersih Proyek-proyek yang memerlukan opsi autentikasi yang fleksibel

Contoh Autentikasi Code

Berikut cara menggunakan plugin untuk autentikasi biometrik: @capgo/capacitor-native-biometric plugin untuk autentikasi biometrik:

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

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

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

    const result = await Biometrics.authenticate({
      reason: "Access your secure data",
      title: "Verify Identity",
      subtitle: "Use biometrics to authenticate",
      cancelTitle: "Use Password Instead"
    });

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

Untuk mengelola kreditur yang aman, capacitor-native-biometric Plugin menawarkan pendekatan yang sederhana:

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;
  }
}

Setelah code di tempat, sangat penting untuk memvalidasi fungsinya melalui tes yang tepat.

Metode Pengujian

Untuk memastikan autentikasi biometrik Anda dapat diandalkan dan aman, pertimbangkan strategi pengujian berikut:

  • Pengujian Kompabilitas Perangkat

    Periksa apakah autentikasi bekerja di berbagai perangkat dan kondisi:

    async function runCompatibilityTests() {
      const tests = {
        biometricAvailable: await Biometrics.isBiometricsAvailable(),
        credentialStorage: await testCredentialStorage(),
        authenticationFlow: await testAuthFlow(),
        fallbackMechanism: await testFallbackAuth()
      };
    
      return tests;
    }
  • Pengelolaan Kesalahan dan Skenario Umum

    Simulasikan kesalahan dan uji mekanisme fallback:

    async function validateErrorHandling() {
      try {
        await Promise.race([
          Biometrics.authenticate(),
          new Promise((_, reject) =>
            setTimeout(() => reject(new Error("Timeout")), 30000)
          )
        ]);
      } catch (error) {
        return implementFallbackAuth();
      }
    }
  • Pengujian Keamanan

    Pastikan implementasi Anda memenuhi standar keamanan:

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

Selain itu, lakukan tes untuk skenario seperti:

  • Banyak upaya autentikasi gagal
  • Tindakan setelah restart perangkat
  • Transisi antara keadaan aplikasi di depan dan di latar belakang
  • Perubahan koneksi jaringan
  • Perbaruan pengaturan biometrik sistem

Tes yang teliti memastikan sistem autentikasi biometrik kuat dan siap digunakan dalam kehidupan nyata.

Standar Keamanan

Menggunakan keamanan yang kuat dalam autentikasi biometrik berarti memprioritaskan perlindungan data, mematuhi regulasi kompatibilitas, dan menerapkan teknik keamanan yang berlapis.

Metode Keamanan Data

Pada iOS, data biometrik dienkripsi dan disimpan menggunakan Keychainsedangkan Android menggunakan Keystore KeystoreJika Anda menggunakan aplikasi yang memanfaatkan. capacitor-native-biometric Untuk transmisi data, selalu implementasikan enkripsi end-to-end

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"
  });
}

untuk menjaga informasi sensitif tetap terlindungi. Pedoman Penyimpanan untuk menjaga informasi sensitif tetap aman.

keamanan biometrik

Aplikasi toko mematuhi aturan ketat untuk keamanan biometrikBerikut adalah penjelasan dari persyaratan utama platform:

Platform Persyaratan Utama Catatan Implementasi
iOS Pakai framework LocalAuthentication, berikan opsi fallback, dan pastikan konsensus pengguna jelas Wajib mendukung baik Face ID dan Touch ID
Android Manfaatkan BiometricPrompt API, dapatkan izin pengguna eksplisit, dan deklarasikan tingkat keamanan Mendukung pengenalan sidik jari dan wajah, dengan perbedaan untuk tingkat keamanan yang berbeda

Pengaturan Multi-Faktor

Meningkatkan keamanan seringkali memerlukan kombinasi verifikasi biometrik dengan lapisan autentikasi tambahan. Misalnya, setelah verifikasi awal verifikasi biometrik, Anda dapat menambahkan langkah tambahan untuk memastikan identitas pengguna:

async function setupMultiFactorAuth() {
  // First factor: Biometric verification
  const biometricResult = await Biometrics.authenticate({
    reason: "Verify your identity",
    title: "Authentication Required"
  });

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

  return false;
}

Ambilan pendekatan multi-faktor biasanya mencakup:

  • Autentikasi biometrik utama
  • Verifikasi sekunder (misalnya, SMS code atau aplikasi autentikator)
  • Konfirmasi transaksi spesifik untuk keamanan tambahan

Jika Anda menggunakan alat seperti Capgo untuk pembaruan waktu nyata, pastikan untuk memenuhi standar keamanan dengan memanfaatkan fiturnya enkripsi ujung ke ujung fitur. Hal ini menjamin bahwa metode autentikasi biometrik Anda tetap aman selama pembaruan dan sesuai dengan persyaratan platform [1].

verifikasi biometrik

Jaga kinerja sistem biometrik Anda dengan seimbang dengan kecepatan, efisiensi baterai, dan pembaruan waktu yang tepat.

Tips Kecepatan dan Baterai

Berikut adalah code contoh kode untuk menerapkan autentikasi biometrik yang efisien:

// 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
  });
}

Untuk mendapatkan hasil terbaik dari kinerja sistem biometrik Anda:

  • Autentikasi BatchAlih-alih meminta beberapa prompt, kelompokkan aksi yang memerlukan autentikasi ke dalam satu sesi untuk mengurangi gangguan.
  • Penyimpanan Caching yang Bijak: Simpan status autentikasi secara aman dan atur waktu kadaluarsa untuk menghindari verifikasi ulang.
  • Optimasi Latar Belakang: Hentikan sementara tugas-tugas yang tidak penting selama proses autentikasi untuk meningkatkan kecepatan dan menghemat baterai.
  • Pendekatan Berdasarkan Acara: Ganti polling konstan dengan pendengar acara untuk memantau status autentikasi lebih efisien.

Perbarui dengan Capgo

Capgo Live Update Antarmuka Dashboard

Capgo memudahkan pembaruan aplikasi.

Berikut mengapa Capgo adalah alat yang bagus untuk mengelola pembaruan:

  • Pengaktifan Instan: Kirimkan perbaikan keamanan kritis dan fitur baru tanpa menunda.
  • Rollout Langsung: Uji pembaruan dengan kelompok pengguna tertentu sebelum mengirimkannya ke semua orang.
  • Pengendalian Versi: Ikuti jejak versi autentikasi yang berbeda untuk manajemen yang lebih baik.
  • Pengembalian Darurat : Cepat kembali ke versi sebelumnya jika ada masalah yang timbul.

Perbarui API

Mengupdate biometrik API Anda secara teratur sangat penting untuk keamanan dan kinerja. Tetaplah proaktif dengan mengikuti pedoman berikut:

Jenis Update Metode Pengawasan Jadwal Implementasi
Pembaruan Keamanan Pemberitahuan Repositori Plugin 24 jam
Perbarui Fitur Dokumentasi Platform 1 minggu
Perubahan Penting Catatan Rilis 2-4 minggu
Update Kebijakan Toko Portal Pengembang Sebelum Pengajuan

Fokus pada area ini:

  • Perubahan Platform: Ikuti pembaruan pada API LocalAuthentication iOS dan BiometricPrompt Android.
  • Standar Keamanan: Tetap terintegrasi dengan persyaratan keamanan biometrik terbaru.
  • Pedoman TokoPastikan kompatibilitas dengan kebijakan App Store Apple dan Google Play untuk menghindari masalah pengajuan.

Kesimpulan

Poin Utama

Menambahkan autentikasi biometrik ke aplikasi Capacitor Anda melibatkan keseimbangan keamanan, kinerja, dan pengalaman pengguna. Berikut adalah ringkasan singkat elemen inti yang perlu dipertimbangkan:

Komponen Fokus Implementasi Pertimbangan Utama
Standar Keamanan Penyimpanan asli platform (Keychain/Keystore) Enkripsi akhir-ke-akhir, perlindungan kreditensial
Pemilihan Plugin Kemampuan versi terbaru Support untuk berbagai jenis biometrik
Pengelolaan Update Siklus pemeliharaan reguler Pengembangan keamanan cepat
Pengalaman Pengguna Opsi autentikasi fallback Prompt autentikasi yang jelas dan mudah digunakan

Komponen-komponen ini adalah peta jalan Anda untuk integrasi sukses.

Langkah-langkah untuk Mengimplementasikan Autentikasi Biometrik

Integrasikan autentikasi biometrik ke dalam aplikasi Anda dengan mengikuti langkah-langkah berikut:

  • Pengintegrasian Plugin
    Mulai dengan memilih plugin biometrik yang sesuai dengan versi Capacitor Anda. Pastikan file konfigurasi Anda - seperti AndroidManifest.xml dan Info.plist - harus dikelola dengan benar. Untuk penyimpanan kredit yang aman, bergantung pada solusi native seperti Keychain atau Keystore.

  • Konfigurasi Keamanan
    Jaga data pengguna dengan mengaktifkan enkripsi akhir-ke-akhir untuk semua transmisi kredit. Di mana perlu, termasuk autentikasi multi-faktor untuk menambahkan lapisan keamanan tambahan. Rencanakan penanganan kesalahan yang kuat dan opsi fallback untuk menjaga fungsi dalam kasus gagal.

  • Pemeliharaan Berkelanjutan
    Jaga aplikasi Anda aman dengan mengatur pipeline pembaruan reguler untuk patch keamanan. Tetaplah terus menerus atas pembaruan plugin dan pantau saran keamanan. Alat seperti Capgo dapat memudahkan proses ini dengan mengaktifkan pembaruan instan. Capgo menunjukkan tingkat pembaruan pengguna yang luar biasa 95% dalam waktu 24 jam, membuatnya menjadi penambahan berharga pada toolkit Anda [2].

“Capgo adalah alat yang harus dimiliki oleh pengembang yang ingin lebih produktif. Menghindari tinjauan untuk memperbaiki bug adalah emas.” - Bessie Cooper [2]

FAQs

::: faq

Apa perbedaan antara plugin biometrik untuk Capacitor, dan bagaimana saya dapat memilih yang terbaik untuk aplikasi saya?

Ketika memilih plugin biometrik untuk aplikasi Capacitor Anda, sangat penting untuk menyesuaikan pilihan dengan kebutuhan spesifik proyek Anda. Pertimbangkan faktor-faktor seperti kompatibilitas platform (apakah Anda memerlukan dukungan untuk iOS, Android, atau keduanya), bagaimana proses integrasi yang sederhana, dan apakah plugin mendukung metode biometrik canggih seperti Wajah ID atau pengenalan sidik jari.

Meskipun panduan ini berfokus pada implementasi autentikasi biometrik di aplikasi __CAPGO_KEEP_0__ Aplikasi Capacitor, alat seperti Capgo can play a valuable role. They allow you to push real-time updates to your app without needing app store approvals. This means your app can stay current with the latest security features, including biometric updates, while remaining compliant with both Apple and Android standards. :::

Pertanyaan Umum

How saya memastikan autentikasi biometrik di aplikasi saya Capacitor memenuhi standar keamanan dan pedoman toko aplikasi?

To pastikan autentikasi biometrik di aplikasi Anda Capacitor memenuhi standar keamanan saat ini dan aturan toko aplikasi, ikuti praktik-praktik kunci ini:

  • Pilih plugin yang dapat diandalkan: Gunakan plugin autentikasi biometrik yang terpercaya seperti Capacitor’s @capacitor/biometrics untuk memastikan aplikasi Anda aman dan berfungsi dengan lancar di berbagai perangkat.
  • Patuhi aturan platform: Patuhi pedoman Apple dan Android, termasuk memperoleh persetujuan pengguna, menggunakan penyimpanan yang aman, dan menawarkan opsi cadangan seperti PIN atau kata sandi.
  • Perbarui dependensi secara teratur: Perbarui aplikasi dan library Anda secara teratur untuk memperbaiki kelemahan dan tetap sejalan dengan standar yang berubah-ubah.

Menggunakan layanan live update seperti live update Capgo can make this process smoother. It allows you to push security updates or improvements to your app instantly, bypassing app store approval delays. This keeps your app secure, compliant, and up-to-date with Apple and Android policies. :::

::: faq

Apa tantangan yang mungkin dihadapi pengembang ketika mengintegrasikan autentikasi biometrik ke dalam aplikasi Capacitor, dan bagaimana mereka dapat mengatasi masalah tersebut?

Mengimplementasikan autentikasi biometrik di aplikasi Capacitor memiliki tantangannya sendiri. Tantangan ini dapat mencakup memastikan konsistensi kompatibilitas di perangkat, mengelola izin pengguna secara efektif, dan mengelola data sensitif dengan aman. Berikut adalah cara Anda dapat mengatasi masalah-masalah tersebut:

  • Kompatibilitas perangkat: Untuk mendukung fitur biometrik di Android dan iOS, pertimbangkan menggunakan plugin seperti @capacitor-fingerprint-authPlugin ini membantu menghubungkan celah antar platform, sehingga aplikasi Anda dapat berjalan dengan lancar di berbagai perangkat.

  • Izin pengguna: Penting untuk menjelaskan secara transparan mengapa aplikasi Anda membutuhkan akses biometrik. Berikan informasi yang jelas kepada pengguna dan desain aplikasi Anda untuk menghadapi situasi dengan baik ketika pengguna memilih tidak memberikan izin.

  • Keamanan data: Melindungi data autentikasi sangat penting. Ikuti praktik enkripsi terbaik dan patuhi pedoman keamanan yang disediakan oleh setiap platform untuk memastikan informasi sensitif tetap aman.

To membuat pembaruan atau memperbaiki masalah terkait fitur biometrik tanpa harus menghadapi proses persetujuan toko aplikasi, Anda dapat menggunakan alat seperti Capgo. Ini memungkinkan pembaruan waktu nyata, memungkinkan Anda untuk menangani bug atau meningkatkan fungsi dengan cepat sambil tetap memenuhi kebijakan Apple dan Android. :::

Teruskan dari Autentikasi Biometrik di Aplikasi Capacitor

Jika Anda menggunakan Autentikasi Biometrik di Aplikasi Capacitor untuk merencanakan keamanan dan kewenangan, hubungkannya dengan Enkripsi untuk detail implementasi di Enkripsi, Kewenangan untuk detail implementasi di Kewenangan, Scanner Keamanan Capgo untuk alur kerja produk di Scanner Keamanan Capgo, Keamanan Capgo untuk alur kerja produk di Capgo Keamanan, dan Capgo Pusat Kepercayaan untuk alur kerja produk di Capgo Pusat Kepercayaan.

Live update untuk aplikasi Capacitor

Jika bug layer web masih aktif, kirimkan perbaikan melalui Capgo daripada menunggu hari-hari untuk persetujuan toko aplikasi. Pengguna mendapatkan update di latar belakang sementara perubahan native tetap dalam jalur review normal.

dukungan manusia dari Martin

Dapatkan Mulai Sekarang

Terbaru dari Blog Kami

Capgo memberikan Anda wawasan terbaik yang Anda butuhkan untuk membuat aplikasi mobile profesional yang sebenarnya