Branding Dinamis & UX: Menyesuaikan iFrame Didit dengan JavaScript (ID)

Integrasi Tanpa HambatanIntegrasikan verifikasi identitas Didit yang kuat langsung ke aplikasi web Anda menggunakan metode iFrame InContext, menawarkan pengaturan cepat dan pengalaman tersemat.

Kustomisasi DinamisManfaatkan API postMessage JavaScript untuk berkomunikasi dengan dan menata gaya iFrame yang tersemat secara dinamis, memastikan tampilan dan nuansa merek Anda konsisten sepanjang proses verifikasi.

Pengalaman Pengguna yang DitingkatkanTangani peristiwa real-time dari iFrame, seperti penyelesaian atau pembatalan verifikasi, untuk memberikan umpan balik instan dan memandu pengguna melalui perjalanan yang mulus dan bermerek.

Arsitektur Fleksibel DiditPendekatan modular dan developer-first Didit, termasuk iFrame InContext dan SDK JavaScript, memberdayakan pengembang untuk membangun alur kerja verifikasi identitas yang sangat disesuaikan dan efisien dengan KYC Inti Gratis.

Mengintegrasikan iFrame InContext Didit untuk Verifikasi Identitas

Dalam lanskap digital saat ini, verifikasi identitas yang kuat sangat penting untuk keamanan, kepatuhan, dan pencegahan penipuan. Didit menawarkan berbagai metode integrasi, dan bagi bisnis yang mencari pengaturan cepat dengan pengalaman tersemat, iFrame InContext menonjol. Metode ini memungkinkan Anda untuk menyematkan kemampuan Verifikasi ID Didit yang kuat langsung di dalam aplikasi web Anda, menjaga pengguna tetap berada di domain Anda. Meskipun mudah diterapkan, kekuatan sebenarnya dari iFrame terletak pada kemampuannya untuk disesuaikan secara dinamis menggunakan JavaScript, mengubah alur verifikasi standar menjadi perjalanan pengguna yang bermerek secara mulus.

iFrame InContext sangat ideal untuk skenario di mana Anda menginginkan proses verifikasi yang terkandung tanpa mengarahkan ulang pengguna. Ini mendukung UniLink (tidak memerlukan backend untuk pengaturan cepat) dan Sesi API (untuk kustomisasi penuh dengan backend). Dengan menyematkan iFrame, Anda dapat memanfaatkan fitur-fitur canggih Didit, termasuk OCR, penguraian MRZ, dan dekode kode batang untuk verifikasi dokumen, sambil tetap mengontrol antarmuka pengguna di sekitarnya.

Kustomisasi Dinamis dengan API postMessage JavaScript

Meskipun iFrame menyediakan pengalaman tersemat, menjaga konsistensi merek di seluruh perjalanan pengguna sangatlah penting. Di sinilah API postMessage JavaScript menjadi sangat berharga. Karena iFrame memuat konten dari asal yang berbeda (layanan verifikasi Didit), manipulasi DOM langsung diblokir oleh kebijakan same-origin. Namun, postMessage memungkinkan komunikasi lintas-asal yang aman antara halaman induk Anda dan iFrame Didit yang tersemat.

Dengan mendengarkan peristiwa atau pesan tertentu dari iFrame dan mengirim pesan ke sana, Anda dapat menyesuaikan tampilan atau perilakunya secara dinamis. Misalnya, Anda mungkin ingin:

• Mengubah tinggi atau lebar iFrame berdasarkan konten yang dimuat di dalamnya.
• Memicu tindakan tertentu di halaman induk Anda ketika langkah verifikasi selesai di dalam iFrame.
• Meneruskan parameter gaya ke iFrame agar sesuai dengan tema aplikasi Anda, jika didukung oleh konfigurasi iFrame Didit.

Pengaturan tipikal melibatkan:

1. Menyematkan iFrame Didit dengan atribut src-nya menunjuk ke URL verifikasi (misalnya, https://verify.didit.me/u/YOUR_WORKFLOW_ID_BASE64).
2. Menambahkan pendengar peristiwa ke jendela induk Anda untuk menangkap pesan dari iFrame:

window.addEventListener('message', (event) => {
  // Pastikan pesan berasal dari asal yang tepercaya (domain Didit)
  if (event.origin !== 'https://verify.didit.me') return;

  const data = event.data;
  if (data.type === 'didit-verification-event') {
    console.log('Didit iFrame event:', data.payload);
    // Tangani peristiwa seperti 'verification_completed', 'verification_failed', dll.
  }
});

Ini memungkinkan aplikasi Anda untuk bereaksi secara cerdas terhadap status iFrame, memandu pengalaman pengguna dengan lebih efektif.

Meningkatkan Pengalaman Pengguna dan Penanganan Peristiwa

Pengalaman pengguna yang benar-benar mulus melampaui sekadar penyematan. Ini melibatkan pemberian umpan balik yang jelas, pengelolaan status, dan penanganan hasil yang berbeda dari proses verifikasi dengan baik. Integrasi iFrame Didit, terutama jika digabungkan dengan JavaScript, memungkinkan penanganan peristiwa yang canggih yang dapat secara signifikan meningkatkan UX.

Misalnya, setelah verifikasi berhasil (yang akan dikonfirmasi oleh backend Anda melalui webhook), Anda dapat secara terprogram menutup modal yang berisi iFrame, menampilkan pesan sukses, dan mengorientasikan pengguna. Jika verifikasi gagal atau dibatalkan, Anda dapat memberikan opsi untuk mencoba lagi atau menghubungi dukungan.

Pertimbangkan skenario di mana Anda menggunakan Verifikasi ID Didit untuk mengorientasikan pengguna baru. Setelah pengguna menyelesaikan pengambilan dan pengiriman dokumen di dalam iFrame, Didit memproses data, termasuk melakukan pemeriksaan Kehidupan Pasif & Aktif untuk mencegah penipuan deepfake. Backend Anda menerima webhook dengan hasil verifikasi. Anda kemudian dapat menggunakan JavaScript untuk:

• Menyembunyikan spinner pemuatan setelah iFrame mengirimkan peristiwa 'verification_submitted'.
• Memperbarui UI untuk menampilkan 'Verifikasi Tertunda' saat backend Anda memproses webhook.
• Menampilkan 'Verifikasi Disetujui' atau 'Verifikasi Ditolak' berdasarkan status akhir yang diterima oleh backend Anda dan dikomunikasikan kembali ke frontend.

Tingkat interaksi dinamis ini memastikan bahwa pengguna selalu mendapat informasi dan terlibat, mengurangi tingkat pengabaian dan membangun kepercayaan pada platform Anda.

Memilih Integrasi yang Tepat: iFrame vs. JavaScript SDK

Meskipun iFrame InContext menawarkan pengaturan cepat dan kenyamanan tersemat, Didit juga menyediakan SDK JavaScript yang kuat bagi mereka yang memerlukan kontrol terprogram maksimum. SDK, yang direkomendasikan untuk aplikasi produksi, menawarkan manajemen sesi, panggilan balik peristiwa, dan dukungan TypeScript penuh, menjadikannya ideal untuk aplikasi kompleks yang dibangun dengan React, Vue, Angular, atau vanilla JS.

iFrame sangat baik untuk waktu pengaturan minimal, seringkali kurang dari 1 menit, dan untuk skenario di mana Anda memerlukan alur verifikasi yang terkandung dan siap pakai. Namun, untuk panggilan balik peristiwa real-time dan kontrol terprogram penuh atas alur pengguna, SDK JavaScript memberikan fleksibilitas yang unggul. Kedua metode mendukung verifikasi lintas-perangkat dan white-labeling, memastikan konsistensi merek.

Komitmen Didit terhadap pendekatan developer-first berarti Anda memiliki opsi untuk mengintegrasikan verifikasi identitas dengan cara yang paling sesuai dengan tumpukan teknis dan tujuan pengalaman pengguna Anda. Baik melalui kesederhanaan iFrame atau kekuatan SDK, Anda dapat memanfaatkan platform AI-native Didit untuk membangun alur kerja identitas yang aman dan efisien.

Bagaimana Didit Membantu

Didit menyediakan blok bangunan dasar untuk menciptakan pengalaman verifikasi identitas yang sangat dapat disesuaikan dan aman. Arsitektur modular kami memungkinkan Anda untuk memasang dan memainkan pemeriksaan identitas seperti Verifikasi ID, Kehidupan Pasif & Aktif, dan Pencocokan Wajah 1:1 & Pencarian Wajah, semuanya didukung oleh AI mutakhir. Untuk solusi tersemat, iFrame InContext menawarkan pengaturan yang sangat cepat, memungkinkan Anda untuk menerapkan verifikasi yang kuat dengan sedikit usaha. Bagi mereka yang membutuhkan integrasi yang lebih dalam dan kontrol dinamis, SDK JavaScript kami menyediakan alat untuk membangun perjalanan pengguna yang disesuaikan, menangani peristiwa real-time, dan menjaga kesinambungan merek sepenuhnya.

Platform Didit dirancang untuk developer-first, menawarkan sandbox instan, dokumentasi publik yang komprehensif, dan API yang bersih. Kami menghilangkan biaya pengaturan dan menawarkan tingkat KYC Inti Gratis, membuat verifikasi identitas tingkat perusahaan dapat diakses. Pendekatan AI-native kami memastikan akurasi dan otomatisasi yang tinggi, mengurangi kebutuhan tinjauan manual dan merampingkan operasi Anda. Dengan Didit, Anda dapat mengatur risiko dan mengotomatiskan kepercayaan secara global, memastikan pengalaman yang aman dan ramah pengguna bagi pelanggan Anda sambil memenuhi persyaratan kepatuhan.

Siap untuk Memulai?

Siap melihat Didit beraksi? Dapatkan demo gratis hari ini.

Mulai verifikasi identitas secara gratis dengan tingkat gratis Didit.