Integrasi Verifikasi Identitas: Panduan Integrasi iFrame

Di lanskap digital saat ini, memverifikasi identitas pengguna sangat penting untuk pencegahan penipuan, kepatuhan, dan membangun kepercayaan. Menyematkan verifikasi identitas langsung ke aplikasi web Anda memberikan pengalaman pengguna yang efisien. Panduan ini akan memandu Anda melalui integrasi solusi verifikasi identitas Didit menggunakan iFrame, mencakup segala sesuatu mulai dari pengaturan awal hingga penanganan event dan praktik terbaik. Kami akan fokus pada implementasi iFrame verifikasi identitas yang kuat dan aman.

Poin Penting 1 iFrame menawarkan cara cepat dan mudah untuk mengintegrasikan verifikasi identitas tanpa perubahan kode yang ekstensif pada aplikasi inti Anda.

Poin Penting 2 Mengelola komunikasi secara aman antara aplikasi Anda dan iFrame melalui penanganan event sangat penting untuk integritas data.

Poin Penting 3 Memanfaatkan API Didit bersama dengan iFrame memberikan kontrol granular atas proses verifikasi dan akses ke hasil verifikasi yang terperinci.

Poin Penting 4 Konfigurasi yang tepat dan langkah-langkah keamanan sangat penting saat menggunakan iFrame untuk mencegah kerentanan cross-site scripting (XSS).

Mengapa Menggunakan iFrame untuk Verifikasi Identitas?

Mengintegrasikan verifikasi identitas bisa jadi rumit, membutuhkan upaya pengembangan yang signifikan. iFrame menawarkan pendekatan yang disederhanakan, merangkum proses verifikasi dalam dokumen HTML terpisah yang disematkan di halaman web Anda. Ini memberikan beberapa keuntungan:

• Mengurangi Kompleksitas Integrasi: Minimalkan perubahan pada basis kode yang ada.
• Keamanan: iFrame beroperasi di lingkungan yang terisolasi, membatasi potensi risiko keamanan.
• Implementasi Lebih Cepat: Siapkan dan jalankan dengan cepat tanpa siklus pengembangan yang ekstensif.
• Pemeliharaan: Pembaruan pada proses verifikasi terkandung dalam iFrame, meminimalkan gangguan pada aplikasi Anda.

Menyiapkan iFrame: Panduan Langkah demi Langkah

Berikut cara menyematkan iFrame verifikasi identitas Didit ke aplikasi web Anda:

1. Dapatkan URL iFrame: Dari Konsol Bisnis Didit Anda, buat tautan verifikasi (Unilink) dan atur parameter embed ke true. Ini akan mengembalikan URL yang dirancang khusus untuk penyematan iFrame.
2. Buat Elemen iFrame: Tambahkan elemen <iframe> ke halaman HTML Anda.
3. Atur Atribut iFrame: Konfigurasikan iFrame dengan atribut berikut:
   • src: Atur ini ke URL iFrame yang diperoleh di langkah 1.
   • width: Tentukan lebar iFrame.
   • height: Tentukan tinggi iFrame.
   • frameborder: Atur ke 0 untuk menghapus border.

Contoh Kode HTML:

<iframe src="https://business.didit.me/verification?embed=true&apiKey=YOUR_API_KEY" width="600" height="400" frameborder="0"></iframe>

Catatan Penting: Ganti YOUR_API_KEY dengan kunci API Didit Anda yang sebenarnya. Selalu gunakan HTTPS untuk sumber iFrame untuk memastikan komunikasi yang aman.

Integrasi JavaScript dan Penanganan Event

Untuk integrasi JavaScript yang kuat, Anda perlu menangani event yang dipancarkan oleh iFrame. Ini memungkinkan aplikasi Anda untuk menanggapi event verifikasi seperti penyelesaian, kegagalan, atau kesalahan. iFrame Didit menggunakan postMessage untuk komunikasi lintas asal yang aman.

Mendengarkan Pesan:

window.addEventListener('message', function(event) {
  if (event.origin !== 'https://business.didit.me') {
    return;
  }

  const message = JSON.parse(event.data);

  switch (message.type) {
    case 'verification_completed':
      // Tangani verifikasi yang berhasil
      console.log('Verifikasi selesai:', message.data);
      break;
    case 'verification_failed':
      // Tangani kegagalan verifikasi
      console.error('Verifikasi gagal:', message.data);
      break;
    case 'error':
      // Tangani kesalahan
      console.error('Kesalahan:', message.data);
      break;
    default:
      console.log('Pesan tidak dikenal:', message);
  }
});

Mengirim Pesan ke iFrame:

const iframe = document.querySelector('iframe');
iframe.contentWindow.postMessage({ type: 'resize', height: 500 }, 'https://business.didit.me');

Pertimbangan Keamanan untuk Penyematan iFrame

Meskipun iFrame menawarkan kenyamanan, keamanan harus menjadi prioritas utama. Berikut adalah pertimbangan utama:

• Verifikasi Asal: Selalu verifikasi event.origin di pendengar pesan Anda untuk memastikan pesan berasal dari domain yang diharapkan (https://business.didit.me).
• Perlindungan XSS: Bersihkan data apa pun yang diterima dari iFrame sebelum menampilkannya di aplikasi Anda untuk mencegah serangan cross-site scripting (XSS).
• Hanya HTTPS: Selalu gunakan HTTPS untuk aplikasi Anda dan sumber iFrame.
• Kebijakan Keamanan Konten (CSP): Terapkan Kebijakan Keamanan Konten yang kuat untuk membatasi sumber daya yang dapat dimuat oleh iFrame.

Bagaimana Didit Membantu

Didit menyederhanakan proses penyematan web dengan:

• URL iFrame Khusus: URL yang mudah digunakan yang dirancang khusus untuk integrasi iFrame.
• Komunikasi Aman: API postMessage untuk komunikasi lintas asal yang aman.
• Penanganan Event Komprehensif: Event terperinci untuk melacak status verifikasi dan menangani kesalahan.
• Integrasi API: Akses ke rangkaian API lengkap Didit untuk kontrol dan akses data yang canggih.
• Infrastruktur Skalabel: Infrastruktur yang andal dan skalabel untuk menangani volume permintaan verifikasi yang tinggi.

Siap Memulai?

Siap untuk mengintegrasikan verifikasi identitas ke aplikasi web Anda dengan mudah? Jelajahi dokumentasi dan sumber daya komprehensif Didit:

• Dokumentasi Teknis
• Pusat Demo
• Harga

Mulailah membangun pengalaman online yang lebih aman dan terpercaya dengan Didit hari ini!