Bermigrasi ke FedCM

Panduan ini membantu Anda memahami perubahan pada aplikasi web yang diperkenalkan oleh Federated Credentials Management API (FedCM).

Saat FedCM diaktifkan, browser akan menampilkan perintah pengguna dan tidak ada cookie pihak ketiga yang digunakan.

Ringkasan

Privacy Sandbox untuk Web dan Penghapusan cookie pihak ketiga oleh Chrome dari web memperkenalkan perubahan signifikan pada Layanan Identitas Google dan login pengguna.

FedCM memungkinkan alur login yang lebih pribadi tanpa memerlukan penggunaan cookie pihak ketiga. Browser mengontrol setelan pengguna, menampilkan perintah pengguna, dan hanya menghubungi Penyedia Identitas seperti Google setelah izin pengguna eksplisit diberikan.

Untuk sebagian besar situs, migrasi terjadi dengan lancar melalui update yang kompatibel dengan versi lama pada library JavaScript Google Identity Services.

Info terbaru tentang fitur Login Otomatis

Pengelolaan Kredensial Federasi (FedCM) Beta untuk Google Identity Services diluncurkan pada Agustus 2023. Banyak developer menguji API dan telah memberikan masukan yang berharga.

Salah satu respons yang didengar Google dari developer adalah tentang persyaratan gestur pengguna alur login otomatis FedCM. Untuk meningkatkan privasi, Chrome mewajibkan pengguna mengonfirmasi ulang bahwa mereka ingin login ke situs dengan Akun Google di setiap instance Chrome meskipun pengguna menyetujui situs tersebut sebelum peluncuran FedCM. Konfirmasi ulang satu kali ini dapat dilakukan dengan sekali klik pada perintah Sekali Ketuk guna menunjukkan niat pengguna untuk login. Perubahan ini dapat menyebabkan gangguan awal pada rasio konversi login otomatis untuk beberapa situs.

Baru-baru ini di M121, Chrome melakukan perubahan pada UX alur login otomatis FedCM. Konfirmasi ulang hanya diperlukan jika cookie pihak ketiga dibatasi. Artinya:

  1. Sebelum pembatasan cookie pihak ketiga ditingkatkan hingga 100% pada Kuartal 3 2024, login otomatis FedCM tidak memerlukan konfirmasi ulang untuk pengguna yang kembali. Jika pengguna mengonfirmasi ulang dengan UI FedCM, konfirmasi ulang ini akan diperhitungkan dalam persyaratan gestur pengguna untuk era pasca-3PCD.

  2. Login otomatis FedCM akan memeriksa status konfirmasi ulang saat cookie pihak ketiga dibatasi secara manual oleh pengguna saat ini, atau secara default di Chrome mendatang.

Dengan perubahan ini, sebaiknya semua developer login otomatis bermigrasi ke FedCM sesegera mungkin, untuk mengurangi gangguan pada rasio konversi login otomatis.

Untuk alur login otomatis, JavaScript GIS tidak akan memicu FedCM di Chrome lama (sebelum M121), meskipun situs Anda memilih untuk mengikutsertakan FedCM.

Perbedaan perjalanan pengguna

Pengalaman Sekali Ketuk menggunakan FedCM dan tanpa FedCM, hanya mirip dengan perbedaan kecil.

Pengguna baru satu sesi

Dengan menggunakan FedCM, One Tap akan menampilkan nama domain, bukan nama aplikasi.

Menggunakan FedCM Tanpa FedCM
Pengguna baru sesi tunggal yang menggunakan FedCM Pengguna baru satu sesi tanpa FedCM

Pengguna yang kembali sesi tunggal (dengan login otomatis dinonaktifkan)

Dengan menggunakan FedCM, One Tap akan menampilkan nama domain, bukan nama aplikasi.

Menggunakan FedCM Tanpa FedCM
Perjalanan pengguna yang kembali ke sesi tunggal menggunakan FedCM (dengan login otomatis dinonaktifkan) Perjalanan pengguna yang kembali dalam sesi tunggal tanpa FedCM (dengan login otomatis dinonaktifkan)

Pengguna yang kembali sesi tunggal (dengan login otomatis diaktifkan)

Dengan menggunakan FedCM, pengguna dapat mengklik X untuk membatalkan login otomatis dalam 5 detik, bukan mengklik tombol Cancel.

Menggunakan FedCM Tanpa FedCM
Perjalanan pengguna yang kembali ke sesi tunggal menggunakan FedCM (dengan mengaktifkan login otomatis) Perjalanan pengguna yang kembali ke sesi tunggal tanpa FedCM (dengan mengaktifkan login otomatis)

Beberapa sesi

Dengan menggunakan FedCM, One Tap akan menampilkan nama domain, bukan nama aplikasi.

Menggunakan FedCM Tanpa FedCM
Pengguna beberapa sesi menggunakan FedCM Pengguna beberapa sesi tanpa FedCM

Sebelum memulai

Pastikan setelan browser dan versi Anda mendukung FedCM API. Sebaiknya update ke versi terbaru.

  • FedCM API tersedia di Chrome 117 atau yang lebih baru.

  • Setelan Login pihak ketiga diaktifkan di Chrome.

  • Jika browser Chrome Anda versi 119 atau yang lebih lama, buka chrome://flags dan aktifkan fitur FedCmWithoutThirdPartyCookies eksperimental. Langkah ini tidak diperlukan di browser Chrome versi 120 atau yang lebih baru.

Memigrasikan aplikasi web Anda

Ikuti langkah-langkah berikut untuk mengaktifkan FedCM, mengevaluasi potensi dampak migrasi, dan jika perlu melakukan perubahan pada aplikasi web Anda yang sudah ada:

1. Tambahkan flag boolean untuk mengaktifkan FedCM saat melakukan inisialisasi menggunakan:

2. Hapus penggunaan metode isDisplayMoment(), isDisplayed(), isNotDisplayed(), dan getNotDisplayedReason() di kode Anda.

Untuk meningkatkan privasi pengguna, callback google.accounts.id.prompt tidak lagi menampilkan notifikasi momen tampilan apa pun dalam objek PromptMomentNotication. Hapus semua kode yang bergantung pada metode terkait momen tampilan. Metode tersebut adalah metode isDisplayMoment(), isDisplayed(), isNotDisplayed(), dan getNotDisplayedReason().

3. Hapus penggunaan metode getSkippedReason() dalam kode Anda.

Meskipun momen lewati, isSkippedMoment(), masih akan dipanggil dari callback google.accounts.id.prompt di objek PromptMomentNotication, alasan mendetail tidak akan diberikan. Hapus semua kode yang bergantung pada metode getSkippedReason() dari kode Anda.

Perhatikan bahwa notifikasi momen yang ditutup, isDismissedMoment(), dan metode alasan mendetail yang terkait, getDismissedReason(), tidak berubah saat FedCM diaktifkan.

4. Hapus atribut gaya position dari data-prompt_parent_id dan intermediate_iframes.

Browser mengontrol ukuran dan posisi perintah pengguna, posisi kustom untuk Sekali Ketuk di Desktop tidak didukung.

5. Perbarui tata letak halaman jika diperlukan.

Browser mengontrol ukuran dan posisi perintah pengguna. Bergantung pada tata letak setiap halaman, beberapa konten mungkin ditempatkan sebagai posisi kustom untuk Sekali Ketuk di Desktop tidak didukung dengan cara apa pun seperti atribut gaya, data-prompt_parent_id, intermediate_iframes, iframe yang disesuaikan, dan cara kreatif lainnya.

Ubah tata letak halaman untuk meningkatkan pengalaman pengguna saat informasi penting terhalang. Jangan mem-build UX dengan perintah Sekali Ketuk meskipun Anda berasumsi bahwa perintah tersebut berada di posisi default. Karena FedCM API dimediasi browser, vendor browser yang berbeda dapat menempatkan posisi perintah dengan sedikit berbeda.

6. Tambahkan atribut allow="identity-credentials-get" ke frame induk jika aplikasi web Anda memanggil One Tap API dari iframe lintas origin.

iframe dianggap sebagai lintas origin jika origin-nya tidak sama persis dengan origin induk. Misalnya:

  • Domain yang berbeda: https://example1.com dan https://example2.com
  • Domain level teratas yang berbeda: https://example.uk dan https://example.jp

  • Subdomain: https://example.com dan https://login.example.com

    Untuk meningkatkan privasi pengguna, saat API Sekali Ketuk dipanggil dari iframe lintas origin, Anda harus menambahkan atribut allow="identity-credentials-get" di setiap tag iframe frame induk:

    <iframe src="https://your.cross-origin/onetap.page" allow="identity-credentials-get"></iframe>

    Jika aplikasi Anda menggunakan iframe yang berisi iframe lain, Anda harus memastikan bahwa atribut telah ditambahkan ke setiap iframe, termasuk semua sub-iframe.

    Misalnya, perhatikan skenario berikut:

  • Dokumen teratas (https://www.example.uk) berisi iframe bernama "Iframe A", yang menyematkan halaman (https://logins.example.com).

  • Halaman tersemat ini (https://logins.example.com) juga berisi iframe bernama "Iframe B", yang menyematkan lebih lanjut halaman (https://onetap.example2.com) yang menghosting fitur Sekali Ketuk.

    Untuk memastikan bahwa Sekali Ketuk dapat ditampilkan dengan benar, atribut harus ditambahkan ke tag Iframe A dan Iframe B.

    Bersiaplah untuk pertanyaan pada perintah Sekali Ketuk yang tidak ditampilkan. Situs lain dengan asal yang berbeda dapat menyematkan halaman Anda yang menghosting fitur Sekali Ketuk dalam iframe-nya. Anda mungkin menerima peningkatan jumlah tiket dukungan terkait fitur One Tap yang tidak muncul dari pengguna akhir atau pemilik situs lainnya. Meskipun pembaruan hanya dapat dilakukan oleh pemilik situs di halaman mereka, Anda dapat melakukan hal berikut untuk mengurangi dampaknya:

  • Perbarui dokumentasi developer untuk menyertakan cara menyiapkan iframe dengan benar untuk memanggil situs Anda. Anda dapat memberikan link ke halaman ini dalam dokumentasi.

  • Perbarui halaman FAQ developer Anda jika ada.

  • Beri tahu tim dukungan Anda tentang perubahan mendatang ini dan persiapkan respons atas pertanyaan Anda terlebih dahulu.

  • Hubungi partner, pelanggan, atau pemilik situs yang terpengaruh secara proaktif untuk transisi FedCM yang lancar.

7. Tambahkan perintah ini ke Kebijakan Keamanan Konten (CSP).

Langkah ini bersifat opsional karena tidak semua situs memilih untuk menentukan CSP.

  • Jika CSP tidak digunakan di situs Anda, Anda tidak perlu melakukan perubahan.

  • Jika CSP berfungsi untuk Sekali Ketuk saat ini dan Anda tidak menggunakan connect-src, frame-src, script-src, style-src, atau default-src, perubahan tidak diperlukan.

  • Jika tidak, ikuti panduan ini untuk menyiapkan CSP Anda. Tanpa penyiapan CSP yang tepat, Sekali Ketuk FedCM tidak akan ditampilkan di situs.

8. Menghapus dukungan Accelerated Mobile Pages (AMP) untuk login.

Dukungan login pengguna untuk AMP adalah fitur opsional GIS yang mungkin telah diterapkan oleh aplikasi web Anda. Jika masalahnya seperti ini,

Hapus semua referensi ke:

  • elemen kustom amp-onetap-google, dan

  • <script async custom-element="amp-onetap-google" src="https://cdn.ampproject.org/v0/amp-onetap-google-0.1.js"></script>

    Pertimbangkan untuk mengalihkan permintaan login dari AMP ke alur login HTML situs Anda. Perhatikan bahwa Intermediate Iframe Support API terkait tidak terpengaruh.

Menguji dan memverifikasi migrasi

Setelah melakukan perubahan yang diperlukan berdasarkan langkah-langkah sebelumnya, Anda dapat memverifikasi bahwa migrasi berhasil.

  1. Pastikan browser Anda mendukung FedCM dan Anda sudah memiliki sesi Akun Google.

  2. Buka halaman Sekali Ketuk di aplikasi Anda.

  3. Konfirmasi bahwa perintah Sekali Ketuk ditampilkan dan menempatkan konten yang mendasarinya dengan aman.

  4. Pastikan kredensial yang benar ditampilkan ke endpoint atau metode callback saat Anda login ke aplikasi menggunakan Sekali Ketuk.

  5. Jika login otomatis diaktifkan, pastikan bahwa pembatalan berfungsi dan kredensial yang benar ditampilkan ke endpoint atau metode callback Anda.

Periode tunggu Sekali Ketuk

Mengklik Sekali Ketuk di pojok kanan atas akan menutup perintah dan memasuki periode tunggu yang akan menyembunyikan perintah Sekali Ketuk agar tidak ditampilkan untuk sementara. Di Chrome, jika ingin menampilkan lagi perintah Sekali Ketuk sebelum periode tunggu berakhir, Anda dapat mereset status periode tunggu dengan mengklik ikon gembok di kolom URL dan mengklik tombol Reset Permission.

Periode tenang login otomatis

Saat menguji login otomatis One Tap menggunakan FedCM, proses ini memiliki waktu hening selama 10 menit di antara setiap upaya login otomatis. Masa tenang tidak dapat direset. Anda harus menunggu selama 10 menit atau menggunakan Akun Google lain untuk pengujian agar dapat memicu login otomatis lagi.

Sumber daya bermanfaat

Privacy Sandbox Analysis Tool (PSAT) adalah ekstensi Chrome DevTools dengan kemampuan khusus untuk membantu developer menangani penghentian cookie pihak ketiga dan adopsi API alternatif. Cara kerjanya adalah dengan memindai situs Anda untuk menemukan fitur yang terpengaruh dan memberikan daftar perubahan yang direkomendasikan.