Referensi Login dengan Google JavaScript API

Tetap teratur dengan koleksi Simpan dan kategorikan konten berdasarkan preferensi Anda.

Halaman referensi ini menjelaskan Login JavaScript API. Anda dapat menggunakan API ini untuk menampilkan perintah Sekali Ketuk atau tombol Login dengan Google di halaman web Anda.

Metode: google.accounts.id.initialize

Metode google.accounts.id.initialize melakukan inisialisasi klien Login dengan Google berdasarkan objek konfigurasi. Lihat contoh kode berikut dari metode tersebut:

google.accounts.id.initialize(IdConfiguration)

Contoh kode berikut mengimplementasikan metode google.accounts.id.initialize dengan fungsi onload:

<script>
  window.onload = function () {
    google.accounts.id.initialize({
      client_id: 'YOUR_GOOGLE_CLIENT_ID',
      callback: handleCredentialResponse
    });
    google.accounts.id.prompt();
  };
</script>

Metode google.accounts.id.initialize membuat instance klien Login dengan Google yang dapat digunakan secara implisit oleh semua modul dalam halaman yang sama.

  • Anda hanya perlu memanggil metode google.accounts.id.initialize sekali bahkan jika Anda menggunakan beberapa modul (seperti Sekali Ketuk, Tombol yang dipersonalisasi, pencabutan, dll.) di halaman yang sama.
  • Jika Anda memanggil metode google.accounts.id.initialize beberapa kali, hanya konfigurasi dalam panggilan terakhir yang akan diingat dan digunakan.

Anda sebenarnya mereset konfigurasi setiap kali memanggil metode google.accounts.id.initialize, dan semua metode berikutnya di halaman web yang sama akan segera menggunakan konfigurasi baru tersebut.

Jenis data: IdConfiguration

Tabel berikut mencantumkan kolom dan deskripsi jenis data IdConfiguration:

Kolom
client_id Client ID aplikasi Anda
auto_select Mengaktifkan pemilihan otomatis.
callback Fungsi JavaScript yang menangani token ID. Google One Tap dan tombol Login dengan Google dalam mode UX popup menggunakan atribut ini.
login_uri URL endpoint login Anda. Tombol Login dengan Google Mode UX redirect menggunakan atribut ini.
native_callback Fungsi JavaScript yang menangani kredensial sandi.
cancel_on_tap_outside Membatalkan permintaan jika pengguna mengklik di luar perintah.
prompt_parent_id ID DOM elemen penampung perintah One Tap
nonce String acak untuk token ID
context Judul dan kata di perintah Sekali Ketuk
state_cookie_domain Jika Anda perlu memanggil One Tap di domain induk dan subdomainnya, teruskan domain induk ke kolom ini, sehingga digunakan satu cookie bersama.
ux_mode Alur UX tombol Login dengan Google
allowed_parent_origin Asal yang diizinkan menyematkan iframe perantara. Sekali Ketuk akan berjalan dalam mode iframe menengah jika kolom ini ditampilkan.
intermediate_iframe_close_callback Mengganti perilaku iframe perantara default saat pengguna menutup One Tap secara manual.
itp_support Mengaktifkan UX Sekali Ketuk yang diupgrade di browser ITP.

client_id

Kolom ini adalah client ID aplikasi Anda, yang ditemukan dan dibuat di Google Developers Console. Lihat tabel berikut untuk informasi lebih lanjut:

Jenis Wajib Contoh
string Ya client_id: "CLIENT_ID.apps.googleusercontent.com"

pilih_otomatis

Kolom ini menentukan apakah token ID otomatis ditampilkan tanpa interaksi pengguna jika hanya ada satu sesi Google yang telah menyetujui aplikasi Anda sebelumnya. Nilai default-nya adalah false. Lihat tabel berikut untuk informasi selengkapnya:

Jenis Wajib Contoh
boolean Opsional auto_select: true

callback

Kolom ini adalah fungsi JavaScript yang menangani token ID yang ditampilkan dari perintah One Tap atau jendela pop-up. Atribut ini diperlukan jika Google One Tap atau tombol Login dengan Google mode popup UX digunakan. Lihat tabel berikut untuk informasi lebih lanjut:

Jenis Wajib Contoh
fungsi Diperlukan untuk Sekali Ketuk dan mode UX popup callback: handleResponse

login_uri

Atribut ini adalah URI dari endpoint login Anda. Dapat dihilangkan jika halaman saat ini adalah halaman login Anda, sehingga kredensial diposting ke halaman ini secara default.

Respons kredensial token ID diposting ke endpoint login saat pengguna mengklik tombol Login dengan Google dan menggunakan mode UX pengalihan.

Lihat tabel berikut untuk informasi lebih lanjut:

Jenis Opsional Contoh
URL Default-nya adalah URI halaman saat ini, atau nilai yang Anda tentukan.
Hanya digunakan saat ux_mode: "redirect" disetel.
login_uri="https://www.example.com/login"

Endpoint login Anda harus menangani permintaan POST yang berisi kunci credential dengan nilai token ID dalam isi.

Berikut adalah contoh permintaan ke endpoint login Anda:

POST /login HTTP/1.1
Host: www.example.com
Content-Type: application/x-www-form-urlencoded

credential=ID_TOKEN

callback_native

Kolom ini adalah nama fungsi JavaScript yang menangani kredensial sandi yang ditampilkan dari pengelola kredensial native browser. Lihat tabel berikut untuk informasi lebih lanjut:

Jenis Wajib Contoh
fungsi Opsional native_callback: handleResponse

batalkan_pada_ketuk_di luar

Kolom ini menetapkan apakah akan membatalkan permintaan Sekali Ketuk atau tidak jika pengguna mengklik di luar perintah. Nilai default-nya adalah true. Anda dapat menonaktifkannya jika Anda menetapkan nilai ke false. Lihat tabel berikut untuk informasi lebih lanjut:

Jenis Wajib Contoh
boolean Opsional cancel_on_tap_outside: false

prompt_induk_induk

Atribut ini menetapkan ID DOM elemen penampung. Jika tidak disetel, perintah Ketuk Satu Kali akan ditampilkan di sudut kanan atas jendela. Lihat tabel berikut untuk informasi lebih lanjut:

Jenis Wajib Contoh
string Opsional prompt_parent_id: 'parent_id'

nonce

Kolom ini adalah string acak yang digunakan oleh token ID untuk mencegah serangan replay. Lihat tabel berikut untuk informasi lebih lanjut:

Jenis Wajib Contoh
string Opsional nonce: "biaqbm70g23"

Panjang nonce dibatasi pada ukuran JWT maksimum yang didukung oleh lingkungan Anda, serta batasan ukuran HTTP browser dan server individual.

context

Kolom ini mengubah teks judul dan pesan di perintah Sekali Ketuk. Lihat tabel berikut untuk informasi lebih lanjut:

Jenis Wajib Contoh
string Opsional context: "use"

Tabel berikut mencantumkan konteks yang tersedia dan deskripsinya:

Konteks
signin "Login dengan Google"
signup "Daftar dengan Google"
use "Gunakan dengan Google"

Jika Anda perlu menampilkan One Tap di domain induk dan subdomainnya, teruskan domain induk ke kolom ini sehingga satu cookie status bersama digunakan. Lihat tabel berikut untuk informasi lebih lanjut:

Jenis Wajib Contoh
string Opsional state_cookie_domain: "example.com"

mode_ux

Gunakan kolom ini untuk menetapkan alur UX yang digunakan oleh tombol Login dengan Google. Nilai defaultnya adalah popup. Atribut ini tidak berdampak pada UX OneTap. Lihat tabel berikut untuk informasi lebih lanjut:

Jenis Wajib Contoh
string Opsional ux_mode: "redirect"

Tabel berikut mencantumkan mode UX yang tersedia dan deskripsinya.

Mode UX
popup Melakukan alur UX login di jendela pop-up.
redirect Melakukan alur UX login dengan pengalihan halaman penuh.

diizinkan_induk_asal

Asal yang diizinkan menyematkan iframe perantara. Sekali Ketuk akan berjalan dalam mode iframe menengah jika kolom ini ditampilkan. Lihat tabel berikut untuk mengetahui informasi lebih lanjut:

Jenis Wajib Contoh
string atau array string Opsional allowed_parent_origin: "https://example.com"

Tabel berikut mencantumkan jenis nilai yang didukung dan deskripsinya.

Jenis Nilai
string URI domain tunggal. "https://contoh.com"
string array Array URI domain. ["https://news.example.com", "https://local.example.com"]

Awalan karakter pengganti juga didukung. Misalnya, "https://*.example.com" akan cocok dengan example.com dan subdomainnya di semua tingkat (misalnya, news.example.com, login.news.example.com). Hal-hal yang perlu diperhatikan saat menggunakan karakter pengganti:

  • String pola tidak boleh hanya terdiri dari karakter pengganti dan domain level teratas. Misalnya, https://*.com dan https://*.co.uk tidak valid; Seperti disebutkan di atas, "https://*.example.com" akan cocok dengan example.com dan subdomainnya. Anda juga dapat menggunakan array untuk mewakili 2 domain yang berbeda. Misalnya, ["https://example1.com", "https://*.example2.com"] akan cocok dengan domain example1.com, example2.com, dan subdomain dari example2.com
  • Domain karakter pengganti harus dimulai dengan skema https:// yang aman. "*.example.com" akan dianggap tidak valid.

Jika nilai kolom allowed_parent_origin tidak valid, inisialisasi Satu Ketuk mode iframe perantara akan gagal dan berhenti.

intermediate_iframe_close_callback

Mengganti perilaku iframe perantara default saat pengguna menutup Satu Ketuk secara manual dengan mengetuk tombol 'X' di UI Sekali Ketuk. Perilaku default-nya adalah segera menghapus iframe perantara dari DOM.

Kolom intermediate_iframe_close_callback hanya berlaku dalam mode frame perantara. Dan hal ini hanya berdampak pada iframe perantara, bukan iframe Sekali Ketuk. UI Sekali Ketuk dihapus sebelum callback dipanggil.

Jenis Wajib Contoh
fungsi Opsional intermediate_iframe_close_callback: logBeforeClose

dukungan_itp

Kolom ini menentukan apakah UX Satu Ketuk yang diupgrade harus diaktifkan di browser yang mendukung Intelligent Tracking Prevention (ITP). Nilai defaultnya adalah false. Lihat tabel berikut untuk informasi lebih lanjut:

Jenis Wajib Contoh
boolean Opsional itp_support: true

Metode: google.accounts.id.prompt

Metode google.accounts.id.prompt menampilkan permintaan Sekali Ketuk atau pengelola kredensial native browser setelah metode initialize() dipanggil. Lihat contoh kode berikut dari metode tersebut:

 google.accounts.id.prompt(/**
 @type{(function(!PromptMomentNotification):void)=} */ momentListener)

Biasanya, metode prompt() dipanggil saat halaman dimuat. Karena status sesi dan setelan pengguna di sisi Google, UI perintah Sekali Ketuk mungkin tidak ditampilkan. Untuk mendapatkan notifikasi tentang status UI untuk berbagai momen, teruskan fungsi untuk menerima notifikasi status UI.

Notifikasi diaktifkan pada momen berikut:

  • Momen tampilan: Ini terjadi setelah metode prompt() dipanggil. Notifikasi berisi nilai boolean untuk menunjukkan apakah UI ditampilkan atau tidak.
  • Momen yang dilewati: Hal ini terjadi saat perintah Sekali Ketuk ditutup oleh pembatalan otomatis, pembatalan manual, atau saat Google gagal mengeluarkan kredensial, seperti saat sesi yang dipilih telah logout dari Google.

    Dalam kasus ini, sebaiknya Anda melanjutkan ke penyedia identitas berikutnya, jika ada.

  • Momen yang ditolak: Ini terjadi saat Google berhasil mengambil kredensial atau pengguna ingin menghentikan alur pengambilan kredensial. Misalnya, saat pengguna mulai memasukkan nama pengguna dan sandi mereka di dialog login, Anda dapat memanggil metode google.accounts.id.cancel() untuk menutup permintaan Sekali Ketuk dan memicu momen yang ditolak.

Contoh kode berikut mengimplementasikan momen yang dilewati:

<script>
  window.onload = function () {
    google.accounts.id.initialize(...);
    google.accounts.id.prompt((notification) => {
      if (notification.isNotDisplayed() || notification.isSkippedMoment()) {
        // continue with another identity provider.
      }
    });
  };
</script>

Jenis data: PromptMomentNotification

Tabel berikut mencantumkan metode dan deskripsi jenis data PromptMomentNotification:

Metode
isDisplayMoment() Apakah notifikasi ini bersifat sementara?
isDisplayed() Apakah notifikasi ini bersifat sementara, dan UI ditampilkan?
isNotDisplayed() Apakah notifikasi ini bersifat sementara, dan UI tidak ditampilkan?
getNotDisplayedReason()

Alasan terperinci UI tidak ditampilkan. Berikut ini adalah nilai yang memungkinkan:

  • browser_not_supported
  • invalid_client
  • missing_client_id
  • opt_out_or_no_session
  • secure_http_required
  • suppressed_by_user
  • unregistered_origin
  • unknown_reason
isSkippedMoment() Apakah notifikasi ini untuk momen yang dilewati?
getSkippedReason()

Alasan terperinci untuk momen yang dilewati. Berikut ini adalah nilai yang memungkinkan:

  • auto_cancel
  • user_cancel
  • tap_outside
  • issuing_failed
isDismissedMoment() Apakah notifikasi ini untuk sementara ditutup?
getDismissedReason()

Alasan penutupan yang mendetail. Berikut ini adalah nilai yang memungkinkan:

  • credential_returned
  • cancel_called
  • flow_restarted
getMomentType()

Menampilkan string untuk jenis momen. Berikut ini adalah nilai yang memungkinkan:

  • display
  • skipped
  • dismissed

Jenis data: CredentialResponse

Saat fungsi callback dipanggil, objek CredentialResponse akan diteruskan sebagai parameter. Tabel berikut mencantumkan kolom yang terdapat dalam objek respons kredensial:

Kolom
credential Kolom ini adalah token ID yang ditampilkan.
select_by Kolom ini menetapkan cara kredensial dipilih.

kredensial

Kolom ini adalah token ID sebagai string Token Web JSON (JWT) berenkode base64.

Saat didekode, JWT terlihat seperti contoh berikut:

header
{
  "alg": "RS256",
  "kid": "f05415b13acb9590f70df862765c655f5a7a019e", // JWT signature
  "typ": "JWT"
}
payload
{
  "iss": "https://accounts.google.com", // The JWT's issuer
  "nbf":  161803398874,
  "aud": "314159265-pi.apps.googleusercontent.com", // Your server's client ID
  "sub": "3141592653589793238", // The unique ID of the user's Google Account
  "hd": "gmail.com", // If present, the host domain of the user's GSuite email address
  "email": "elisa.g.beckett@gmail.com", // The user's email address
  "email_verified": true, // true, if Google has verified the email address
  "azp": "314159265-pi.apps.googleusercontent.com",
  "name": "Elisa Beckett",
                            // If present, a URL to user's profile picture
  "picture": "https://lh3.googleusercontent.com/a-/e2718281828459045235360uler",
  "given_name": "Elisa",
  "family_name": "Beckett",
  "iat": 1596474000, // Unix timestamp of the assertion's creation time
  "exp": 1596477600, // Unix timestamp of the assertion's expiration time
  "jti": "abc161803398874def"
}

Kolom sub berisi ID unik global untuk Akun Google.

Dengan kolom email, email_verified, dan hd, Anda dapat menentukan apakah Google menghosting dan berwenang untuk alamat email. Jika Google berwenang, pengguna saat ini diketahui sebagai pemilik akun yang sah.

Kasus ketika Google berwenang:

  • email memiliki akhiran @gmail.com, ini adalah akun Gmail.
  • email_verified bernilai benar dan hd ditetapkan, ini adalah akun G Suite.

Pengguna dapat mendaftar ke Akun Google tanpa menggunakan Gmail atau G Suite. Jika email tidak berisi akhiran @gmail.com dan hd tidak ada, berarti Google tidak berwenang dan sandi atau metode tantangan lainnya direkomendasikan untuk memverifikasi pengguna. email_verfied juga dapat bernilai benar karena Google awalnya memverifikasi pengguna tersebut saat Akun Google dibuat, namun kepemilikan akun email pihak ketiga mungkin telah berubah.

select_by

Tabel berikut mencantumkan kemungkinan nilai untuk kolom select_by. Jenis tombol yang digunakan bersama dengan sesi dan status izin digunakan untuk menetapkan nilai.

  • Pengguna menekan tombol Sekali Ketuk atau Login dengan Google atau menggunakan proses login Otomatis tanpa sentuhan.

  • Sesi yang sudah ada ditemukan, atau pengguna memilih dan login ke Akun Google untuk membuat sesi baru.

  • Sebelum membagikan kredensial token ID kepada aplikasi, pengguna juga

    • menekan tombol Konfirmasi untuk memberikan izin mereka untuk membagikan kredensial, atau
    • sebelumnya telah memberikan izin dan menggunakan Pilih Akun untuk memilih Akun Google.

Nilai kolom ini ditetapkan ke salah satu jenis berikut,

Nilai Deskripsi
auto Login otomatis pengguna dengan sesi yang ada yang sebelumnya memberikan izin untuk membagikan kredensial.
user Pengguna dengan sesi yang ada yang sebelumnya memberikan izin menekan tombol 'Lanjutkan sebagai' Sekali Ketuk untuk membagikan kredensial.
user_1tap Pengguna dengan sesi yang ada menekan tombol 'Lanjutkan sebagai' Sekali Ketuk untuk memberikan izin dan membagikan kredensial. Hanya berlaku untuk Chrome v75 dan yang lebih tinggi.
user_2tap Pengguna tanpa sesi yang ada menekan tombol 'Lanjutkan sebagai' untuk memilih akun, lalu menekan tombol Konfirmasi di jendela pop-up untuk memberikan izin dan membagikan kredensial. Berlaku untuk browser berbasis non-Chromium.
btn Pengguna dengan sesi yang ada yang sebelumnya memberikan izin menekan tombol Login dengan Google dan memilih Akun Google dari 'Pilih Akun' untuk membagikan kredensial.
btn_confirm Pengguna yang memiliki sesi yang ada menekan tombol Login dengan Google dan menekan tombol Konfirmasi untuk memberikan izin dan membagikan kredensial.
btn_add_session Pengguna tanpa sesi yang sudah ada yang sebelumnya memberikan izin menekan tombol Login dengan Google untuk memilih Akun Google dan membagikan kredensial.
btn_confirm_add_session Pengguna yang tidak memiliki sesi yang ada terlebih dahulu menekan tombol Login dengan Google untuk memilih Akun Google, lalu menekan tombol Konfirmasi untuk mengizinkan dan membagikan kredensial.

Metode: google.accounts.id.renderButton

Metode google.accounts.id.renderButton merender tombol Login dengan Google di halaman web Anda.

Lihat contoh kode berikut dari metode tersebut:

google.accounts.id.renderButton(
      /** @type{!HTMLElement} */ parent,
      /** @type{!GsiButtonConfiguration} */ options
    )

Jenis data: GsiButtonConfiguration

Tabel berikut mencantumkan kolom dan deskripsi jenis data GsiButtonConfiguration:

Atribut
type Jenis tombol: ikon, atau tombol standar.
theme Tema tombol. Misalnya, terisi_biru atau terisi_hitam.
size Ukuran tombol. Misalnya, kecil atau besar.
text Teks tombol. Misalnya, "Login dengan Google" atau "Daftar dengan Google".
shape Bentuk tombol. Misalnya, persegi panjang atau lingkaran.
logo_alignment Perataan logo Google: kiri atau tengah.
width Lebar tombol, dalam piksel.
locale Jika disetel, bahasa tombol akan dirender.
click_listener Jika disetel, fungsi ini akan dipanggil saat tombol Login dengan Google diklik.

Jenis atribut

Bagian berikut berisi detail tentang jenis setiap atribut, dan contohnya.

jenis

Jenis tombol. Nilai default-nya adalah standard.

Lihat tabel berikut untuk informasi lebih lanjut:

Jenis Wajib Contoh
string Ya type: "icon"

Tabel berikut mencantumkan jenis tombol yang tersedia dan deskripsinya:

Jenis
standard Tombol dengan teks atau informasi yang dipersonalisasi:
icon Tombol ikon tanpa teks:

tema

Tema tombol. Nilai default-nya adalah outline. Lihat tabel berikut untuk mengetahui informasi lebih lanjut:

Jenis Wajib Contoh
string Opsional theme: "filled_blue"

Tabel berikut mencantumkan tema yang tersedia dan deskripsinya:

Tema
outline Tema tombol standar:
filled_blue Tema tombol berwarna biru:
filled_black Tema tombol berwarna hitam:

ukuran

Ukuran tombol. Nilai default-nya adalah large. Lihat tabel berikut untuk mengetahui informasi lebih lanjut:

Jenis Wajib Contoh
string Opsional size: "small"

Tabel berikut mencantumkan ukuran tombol dan deskripsinya yang tersedia:

Ukuran
large Tombol besar:
Tombol standar besar Tombol ikon besar Tombol besar yang dipersonalisasi
medium Tombol berukuran sedang:
Tombol standar sedang Tombol ikon sedang
small Tombol kecil:
Tombol kecil Tombol ikon kecil

teks

Teks tombol. Nilai default-nya adalah signin_with. Tidak ada perbedaan visual untuk teks tombol ikon yang memiliki atribut text berbeda. Satu-satunya pengecualian adalah saat teks dibaca untuk aksesibilitas layar.

Lihat tabel berikut untuk informasi lebih lanjut:

Jenis Wajib Contoh
string Opsional text: "signup_with"

Tabel berikut mencantumkan teks tombol yang tersedia dan deskripsinya:

Teks
signin_with Teks tombolnya adalah “Login dengan Google”:
signup_with Teks tombolnya adalah “Daftar dengan Google”:
continue_with Teks tombolnya adalah “Lanjutkan dengan Google”:
signin Teks tombolnya adalah “Login”:

bentuk

Bentuk tombol. Nilai default-nya adalah rectangular. Lihat tabel berikut untuk mengetahui informasi lebih lanjut:

Jenis Wajib Contoh
string Opsional shape: "rectangular"

Tabel berikut mencantumkan bentuk tombol yang tersedia dan deskripsinya:

Bentuk
rectangular Tombol berbentuk persegi panjang. Jika digunakan untuk jenis tombol icon, berarti sama dengan square.
pill Tombol berbentuk pil. Jika digunakan untuk jenis tombol icon, berarti sama dengan circle.
circle Tombol berbentuk lingkaran. Jika digunakan untuk jenis tombol standard, berarti sama dengan pill.
square Tombol berbentuk persegi. Jika digunakan untuk jenis tombol standard, berarti sama dengan rectangular.

logo_alignment

Perataan logo Google. Nilai default-nya adalah left. Atribut ini hanya berlaku untuk jenis tombol standard. Lihat tabel berikut untuk informasi selengkapnya:

Jenis Wajib Contoh
string Opsional logo_alignment: "center"

Tabel berikut mencantumkan perataan yang tersedia dan deskripsinya:

logo_alignment
left Rata-kiri logo Google.
center Rata-tengah logo Google.

lebar

Lebar tombol minimum, dalam piksel. Lebar maksimum adalah 400 piksel.

Lihat tabel berikut untuk informasi lebih lanjut:

Jenis Wajib Contoh
string Opsional width: 400

locale

Lokalitas yang telah ditetapkan sebelumnya dari teks tombol. Jika tidak disetel, lokalitas default browser atau preferensi pengguna sesi Google akan digunakan. Oleh karena itu, pengguna yang berbeda mungkin melihat versi yang berbeda dari tombol yang dilokalkan, dan mungkin dengan ukuran yang berbeda.

Lihat tabel berikut untuk informasi lebih lanjut:

Jenis Wajib Contoh
string Opsional locale: "zh_CN"

click_pemroses

Anda dapat menentukan fungsi JavaScript yang akan dipanggil saat tombol Login dengan Google diklik menggunakan atribut click_listener.

  google.accounts.id.renderButton(document.getElementById("signinDiv"), {
      theme: 'outline',
      size: 'large',
      click_listener: onClickHandler
    });

  
  function onClickHandler(){
    console.log("Sign in with Google button clicked...")
  }
  

Pada contoh di atas, pesan Sign in with Google button click... akan dicatat ke konsol saat tombol Login dengan Google diklik.

Jenis data: Kredensial

Saat fungsi native_callback dipanggil, objek Credential akan diteruskan sebagai parameter. Tabel berikut mencantumkan kolom yang ada dalam objek:

Kolom
id Mengidentifikasi pengguna.
password Sandi

Metode: google.accounts.id.disableAutoSelect

Saat pengguna logout dari situs, Anda perlu memanggil metode google.accounts.id.disableAutoSelect untuk mencatat status dalam cookie. Hal ini mencegah dead loop UX. Lihat cuplikan kode berikut dari metode ini:

google.accounts.id.disableAutoSelect()

Contoh kode berikut menerapkan metode google.accounts.id.disableAutoSelect dengan fungsi onSignout():

<script>
  function onSignout() {
    google.accounts.id.disableAutoSelect();
  }
</script>

Metode: google.accounts.id.storeCredential

Metode ini adalah wrapper sederhana untuk metode store() dari API pengelola kredensial native browser. Oleh karena itu, metode ini hanya dapat digunakan untuk menyimpan kredensial sandi. Lihat contoh kode berikut dari metode tersebut:

google.accounts.id.storeCredential(Credential, callback)

Contoh kode berikut menerapkan metode google.accounts.id.storeCredential dengan fungsi onSignIn():

<script>
  function onSignIn() {
    let cred = {id: '...', password: '...'};
    google.accounts.id.storeCredential(cred);
  }
</script>

Metode: google.accounts.id.cancel

Anda dapat membatalkan alur Sekali Ketuk jika perintah ini dihapus dari DOM pihak tepercaya. Operasi pembatalan akan diabaikan jika kredensial sudah dipilih. Lihat contoh kode berikut dari metode ini:

google.accounts.id.cancel()

Contoh kode berikut mengimplementasikan metode google.accounts.id.cancel() dengan fungsi onNextButtonClicked():

<script>
  function onNextButtonClicked() {
    google.accounts.id.cancel();
    showPasswordPage();
  }
</script>

Callback pemuatan library: onGoogleLibraryLoad

Anda dapat mendaftarkan callback onGoogleLibraryLoad. Notifikasi ini muncul setelah library Login dengan Google JavaScript dimuat:

window.onGoogleLibraryLoad = () => {
    ...
};

Callback ini hanyalah pintasan untuk callback window.onload. Tidak ada perbedaan perilaku.

Contoh kode berikut mengimplementasikan callback onGoogleLibraryLoad:

<script>
  window.onGoogleLibraryLoad = () => {
   google.accounts.id.initialize({
     ...
   });
   google.accounts.id.prompt();
  };
</script>

Metode: google.accounts.id.revoke

Metode google.accounts.id.revoke mencabut pemberian izin OAuth yang digunakan untuk membagikan token ID untuk pengguna yang ditentukan. Lihat cuplikan kode berikut dari metode: google.accounts.id.revoke(hint, callback)

Parameter Jenis Deskripsi
hint string Alamat email atau ID unik Akun Google pengguna. ID adalah properti sub dari payload kredensial.
callback fungsi Pengendali RevocationResponse opsional.

Contoh kode berikut menunjukkan cara menggunakan metode revoke dengan ID.

  google.accounts.id.revoke('1618033988749895', done => {
    console.log(done.error);
  });

Jenis data: RevocationResponse

Saat fungsi callback dipanggil, objek RevocationResponse akan diteruskan sebagai parameter. Tabel berikut mencantumkan kolom yang ada dalam objek respons pencabutan:

Kolom
successful Kolom ini adalah nilai yang ditampilkan dari panggilan metode.
error Kolom ini secara opsional berisi pesan respons error mendetail.

berhasil

Kolom ini adalah nilai boolean yang ditetapkan ke true jika panggilan metode pencabutan berhasil atau salah jika gagal.

error

Kolom ini merupakan nilai string dan berisi pesan error mendetail jika pemanggilan metode pencabutan gagal, tidak terdefinisi jika berhasil.