Pengesahan Muka Tanpa Kata Laluan di Tapak Web! (FACEIO)

Apakah FaceIO, dan Mengapa Menggunakannya? ?

FaceIO ialah perkhidmatan yang membenarkan tapak web dan apl mengecam seseorang melalui wajah mereka menggunakan kamera web.

Daripada menaip kata laluan atau menggunakan cap jari, pengguna hanya boleh melihat kamera dan apl boleh mengesahkan siapa mereka.

Ini berguna kerana:

• ⚡ Ia lebih pantas daripada menaip kata laluan.
• ? Ia lebih selamat kerana hanya orang dengan wajah itu boleh mengakses apl itu.
• ? Pengguna tidak perlu mengingati kata laluan yang rumit.

Bagaimana FaceIO Berfungsi?

Terdapat dua tindakan utama dengan FaceIO:

1. ⛳ Mendaftar Pengguna: Ini bermakna merakam muka pengguna buat kali pertama.
2. ? Mengesahkan Pengguna: Ini bermakna menyemak sama ada orang di hadapan kamera adalah sama dengan orang yang mendaftar lebih awal.

Menyediakan FaceIO dalam Halaman Web ?️

Untuk menggunakan FaceIO, anda perlu menambahkan pustaka JavaScript mereka (kod khas yang melakukan pengesanan muka) ke tapak web anda. Begini cara anda melakukannya:

1. Sertakan Skrip:
Tambahkan teg skrip dalam fail HTML anda yang menghala ke pustaka FaceIO:

   <script src="https://cdn.faceio.net/fio.js"></script>

? Skrip ini membenarkan tapak web anda menggunakan ciri FaceIO.

2. Buat Butang untuk Mendaftar dan Mengesahkan:
Dalam HTML anda, tambahkan dua butang:

   <button onclick="enrollNewUser()">Enroll New User</button>
   <button onclick="authenticateUser()">Authenticate User</button>

? Apabila pengguna mengklik butang ini, mereka akan sama ada mendaftar (menyimpan muka mereka) atau mengesahkan (menyemak wajah mereka).

Mendaftarkan Pengguna ?

Proses menyimpan muka pengguna baharu dipanggil mendaftar. Berikut ialah kod JavaScript untuknya:

function enrollNewUser() {
    const faceio = new faceIO("app-public-id"); // Replace with your app's ID

    faceio.enroll({
        locale: "en", // This sets the language to English
        payload: {
            email: "user@example.com" // Link this user's email or any other unique ID
        }
    }).then(userInfo => {
        console.log("User enrolled successfully!");
        console.log("User ID: " + userInfo.facialId);
        console.log("Enrollment Date: " + userInfo.timestamp);
        alert("Enrollment successful! Welcome, user.");
    }).catch(err => {
        handleError(err);
    });
}

?‍♂️ Apakah Fungsi Kod Ini?

• Ia memanggil fungsi enroll() daripada FaceIO untuk memulakan proses.
• tempatan bermaksud bahasa yang digemari pengguna.
• muatan ialah maklumat tambahan tentang pengguna (seperti e-mel atau ID mereka).
• Jika ia berfungsi, ia menunjukkan mesej yang mengatakan "Pendaftaran berjaya!" dan log butiran seperti ID pengguna dan tarikh.
• Jika ia tidak berfungsi, ia akan memanggil fungsi handleError() untuk menyemak perkara yang salah.

Mengesahkan Pengguna ?

Ini adalah cara anda menyemak sama ada pengguna adalah yang mereka katakan mereka menggunakan muka mereka:

   <script src="https://cdn.faceio.net/fio.js"></script>

?‍♂️ Apakah Fungsi Kod Ini?

• Ia menggunakan kaedah authenticate() daripada FaceIO.
• Jika berjaya, ia mencatat mesej dan mengalu-alukan pengguna kembali.
• Jika tidak, ia memanggil handleError() untuk memahami masalah.

Untuk mendapatkan kunci API (juga dikenali sebagai **App Public ID) dalam FaceIO, ikut langkah mudah berikut:**

1. Daftar untuk FaceIO:

   • Pergi ke tapak web FaceIO dan daftar untuk mendapatkan akaun jika anda belum memilikinya.
   • Log masuk dengan akaun baharu anda.

2. Buat Aplikasi Baharu:

   • Setelah log masuk, pergi ke Papan Pemuka.
   • Klik pada "Buat Aplikasi Baharu".
   • Isi butiran yang diperlukan seperti nama dan perihalan apl anda, kemudian klik "Buat".

1. Cari ID Awam Apl:

   • Selepas mencipta apl, anda akan melihat apl tersebut disenaraikan pada bahagian "Aplikasi" anda pada papan pemuka anda.
   • Di sini, anda akan menemui ID Awam Apl anda. Ini ialah kunci API yang akan anda gunakan dalam kod JavaScript anda untuk menghubungkan tapak web anda dengan FaceIO.

2. Salin ID Awam Apl:

   • Klik ikon salin di sebelah ID Awam Apl untuk menyalinnya.
   • Sekarang, anda boleh menampal kunci ini ke dalam kod anda yang tertera "app-public-id".

Contoh: Gantikan "app-public-id" dalam kod JavaScript dengan ID Awam Apl anda yang sebenar:

   <button onclick="enrollNewUser()">Enroll New User</button>
   <button onclick="authenticateUser()">Authenticate User</button>

Kini, apl anda disambungkan ke FaceIO dan sedia untuk menggunakan ciri pengecaman muka!

Sebelum sebelumnya, izinkan saya menunjukkan kepada anda cara menjalankan FaceIO pada pelayan langsung.

Berjalan pada Pelayan Langsung:

• FaceIO memerlukan fail JavaScript untuk disampaikan daripada pelayan HTTP langsung, bukan daripada URL file:// (fail tempatan).
• Pastikan anda menjalankan fail HTML anda pada pelayan. Anda boleh menggunakan alatan seperti sambungan Pelayan Langsung VS Code atau Node.js.

Mula-mula, pasang node.js dalam komputer anda dan kemudian pasang pakej berikut dalam projek FaceIO:

   <script src="https://cdn.faceio.net/fio.js"></script>

Kemudian gunakannya dengan arahan berikut:

   <button onclick="enrollNewUser()">Enroll New User</button>
   <button onclick="authenticateUser()">Authenticate User</button>

Berikut ialah pautan pelayan langsung dalam terminal vscode anda:

Mengendalikan Ralat?

Tidak semuanya berjalan lancar sepanjang masa, jadi kita perlu menangani ralat apabila ia berlaku. Berikut ialah fungsi yang melakukan perkara itu:

function enrollNewUser() {
    const faceio = new faceIO("app-public-id"); // Replace with your app's ID

    faceio.enroll({
        locale: "en", // This sets the language to English
        payload: {
            email: "user@example.com" // Link this user's email or any other unique ID
        }
    }).then(userInfo => {
        console.log("User enrolled successfully!");
        console.log("User ID: " + userInfo.facialId);
        console.log("Enrollment Date: " + userInfo.timestamp);
        alert("Enrollment successful! Welcome, user.");
    }).catch(err => {
        handleError(err);
    });
}

?‍♂️ Apakah Fungsi Kod Ini?

• Ia memerlukan kod ralat dan memadankannya dengan mesej tertentu.
• Sebagai contoh, jika pengguna tidak membenarkan akses kepada kamera, ia memberitahu mereka bahawa mereka perlu mendayakannya.
• Setiap kes ralat membantu pengguna memahami perkara yang salah dan perkara yang perlu dilakukan seterusnya.

Mengapa FaceIO Memerlukan Pelayan HTTP? ?

Anda mungkin tertanya-tanya mengapa kod ini perlu dijalankan pada pelayan dan bukannya hanya membukanya sebagai fail biasa dalam penyemak imbas anda. Inilah sebabnya:

1. ?? JavaScript dan Keselamatan:

   • Kod JavaScript berjalan dalam penyemak imbas anda (sebelah pelanggan). Tetapi atas sebab keselamatan, ia tidak boleh bercakap terus dengan pelayan yang bukan asalnya.
   • Ini dipanggil dasar asal yang sama. Ia memastikan data anda selamat daripada diakses oleh tapak web yang anda tidak buka.

2. ?️ FaceIO Perlu Bercakap dengan Pelayannya:

   • Apabila anda mendaftar atau mengesahkan wajah, perpustakaan FaceIO menghantar maklumat ke pelayan mereka untuk membandingkan atau menyimpan data.
   • Untuk melakukan ini dengan selamat, ia mesti datang dari alamat web yang betul (seperti http://yourwebsite.com) dan bukan hanya fail setempat pada komputer anda.

Mengurus Apl Anda dengan FaceIO Console ?

FaceIO menawarkan Pengurus Aplikasi berasaskan web. Ini seperti papan pemuka di mana anda boleh mengawal segala-galanya tentang apl anda:

• ? Pengurusan Pengguna: Tambah, edit atau padam pengguna.
• ? Pengurusan Kumpulan: Letakkan pengguna dalam kumpulan untuk mengurus mereka dengan lebih baik.
• ? Pengurusan Kebenaran: Tentukan siapa yang boleh melakukan perkara dalam apl anda.
• ? Memantau Analitis: Semak bilangan pengguna yang menggunakan apl anda dan cara mereka berinteraksi dengannya.
• ? Ciri Keselamatan: Gunakan perkara seperti pengesahan berbilang faktor untuk menjadikan apl anda lebih selamat.

Rekap Perkara Utama ♻️

1. FaceIO membantu tapak web mengenali pengguna menggunakan pengecaman muka, menjadikan log masuk lebih pantas dan lebih selamat.
2. Untuk menggunakan FaceIO, anda perlu memasukkan pustaka JavaScript mereka, mencipta butang dan menyediakan fungsi untuk mendaftar dan mengesahkan pengguna.
3. Ralat pengendalian adalah penting untuk membimbing pengguna apabila berlaku masalah.
4. Pelayan HTTP diperlukan untuk memintas peraturan keselamatan penyemak imbas dan berkomunikasi dengan betul dengan pelayan FaceIO.
5. Pengurus Aplikasi membantu anda mengawal pengguna, tetapan dan keselamatan.

Dengan mengikuti langkah ini, anda boleh membuat tapak web di mana pengguna boleh log masuk hanya dengan melihat kamera web mereka! Anda mengubah tapak web anda menjadi apl futuristik yang mengenali wajah dan menjadikannya lebih mesra pengguna dan selamat untuk menarik penemuduga atau pelanggan anda!

---

Saya harap penjelasan ini bermanfaat! Ia merangkumi segala-galanya daripada cara FaceIO berfungsi untuk menyediakan dan mengurusnya. Beritahu saya jika anda mempunyai sebarang soalan lagi!

Baca lebih lanjut: kemahiran untuk menjadi pembangun bahagian belakang dalam masa 6 bulan (peta jalan)

Atas ialah kandungan terperinci Pengesahan Muka Tanpa Kata Laluan di Tapak Web! (FACEIO). Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!