Google JavaScript API referansıyla oturum açma

Bu referans sayfasında, Sign-In JavaScript API açıklanmaktadır. Web sayfalarınızda Tek Dokunuş istemini veya Google ile oturum açma düğmesini görüntülemek için bu API'yi kullanabilirsiniz.

Yöntem: google.accounts.id.initialize

google.accounts.id.initialize yöntemi, yapılandırma nesnesine göre Google ile oturum açma istemcisini başlatır. Yöntemin aşağıdaki kod örneğine bakın:

google.accounts.id.initialize(IdConfiguration)

Aşağıdaki kod örneğinde, google.accounts.id.initialize yöntemi bir onload işleviyle uygulanmaktadır:

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

google.accounts.id.initialize yöntemi, aynı web sayfasındaki tüm modüller tarafından dolaylı olarak kullanılabilen bir Google ile oturum açma istemci örneği oluşturur.

  • Aynı web sayfasında birden fazla modül (ör. Tek Dokunuş, Kişiselleştirilmiş düğme, İptal vb.) kullanıyor olsanız bile google.accounts.id.initialize yöntemini yalnızca bir kez çağırmanız gerekir.
  • google.accounts.id.initialize yöntemini birden çok kez çağırırsanız yalnızca son çağrıdaki yapılandırmalar hatırlanır ve kullanılır.

Aslında, google.accounts.id.initialize yöntemini her çağırdığınızda yapılandırmaları sıfırlarsınız ve aynı web sayfasındaki sonraki tüm yöntemler hemen yeni yapılandırmaları kullanır.

Veri türü: IdConfiguration

Aşağıdaki tabloda IdConfiguration veri türünün alanları ve açıklamaları listelenmiştir:

Alan
client_id Uygulamanızın istemci kimliği
auto_select Otomatik seçimi etkinleştirir.
callback Kimlik jetonlarını işleyen JavaScript işlevi. Google One Tap ve Google ile Oturum Aç düğmesi popup kullanıcı deneyimi modu bu özelliği kullanır.
login_uri Giriş uç noktanızın URL'si. Google ile oturum açma düğmesi redirect kullanıcı deneyimi modu bu özelliği kullanır.
native_callback Şifre kimlik bilgilerini işleyen JavaScript işlevi.
cancel_on_tap_outside Kullanıcı istemin dışında bir yeri tıklarsa istemi iptal eder.
prompt_parent_id Tek Dokunuş istemi kapsayıcı öğesinin DOM kimliği
nonce Kimlik jetonları için rastgele bir dize
context One Tap istemindeki başlık ve kelimeler
state_cookie_domain Ana alanda ve alt alan adlarında One Tap'i çağırmanız gerekiyorsa tek bir paylaşılan çerezin kullanılması için ana alanı bu alana iletin.
ux_mode Google ile oturum açma düğmesi kullanıcı deneyimi akışı
allowed_parent_origin Ara iframe'in yerleştirilmesine izin verilen kaynaklar. Bu alan varsa Tek Dokunma, ara iframe modunda çalıştırılır.
intermediate_iframe_close_callback Kullanıcılar One Tap'i manuel olarak kapattığında varsayılan ara iframe davranışını geçersiz kılar.
itp_support ITP tarayıcılarında yükseltilmiş Tek Tıklama kullanıcı deneyimini etkinleştirir.
login_hint Kullanıcı ipucu sağlayarak hesap seçimini atlama.
hd Hesap seçimini alana göre sınırlayın.
use_fedcm_for_prompt Tarayıcının kullanıcı oturum açma istemlerini kontrol etmesine ve web siteniz ile Google arasındaki oturum açma akışını yönetmesine izin verin.
enable_redirect_uri_validation Yönlendirme URI'si doğrulama kurallarına uygun düğme yönlendirme akışını etkinleştirin.

client_id

Bu alan, uygulamanızın istemci kimliğidir. Bu kimlik, Google Cloud Console'da bulunur ve oluşturulur. Daha fazla bilgi için aşağıdaki tabloya bakın:

Tür Zorunlu Örnek
dize Evet client_id: "CLIENT_ID.apps.googleusercontent.com"

auto_select

Bu alan, uygulamanızı daha önce onaylamış tek bir Google oturumu varsa kimlik jetonunun herhangi bir kullanıcı etkileşimi olmadan otomatik olarak döndürülüp döndürülmeyeceğini belirler. Varsayılan değer: false. Daha fazla bilgi için aşağıdaki tabloya bakın:

Tür Zorunlu Örnek
boolean İsteğe bağlı auto_select: true

geri çağırma

Bu alan, Tek Dokunma isteminden veya pop-up pencereden döndürülen kimlik jetonunu işleyen JavaScript işlevidir. Google One Tap veya Google ile oturum açma düğmesi popup UX modu kullanılıyorsa bu özellik gereklidir. Daha fazla bilgi için aşağıdaki tabloya bakın:

Tür Zorunlu Örnek
işlev Tek Dokunuş ve popup kullanıcı deneyimi modu için gereklidir callback: handleResponse

login_uri

Bu özellik, giriş uç noktanızın URI'sidir.

Değer, Google Cloud Console'da yapılandırdığınız OAuth 2.0 istemcisinin yetkili yönlendirme URI'lerinden biriyle tam olarak eşleşmeli ve yönlendirme URI'si doğrulama kurallarımıza uygun olmalıdır.

Geçerli sayfa giriş sayfanızsa bu özellik atlanabilir. Bu durumda kimlik bilgileri varsayılan olarak bu sayfaya gönderilir.

Kullanıcı Google ile oturum açma düğmesini tıkladığında ve yönlendirme kullanıcı deneyimi modu kullanıldığında kimlik jetonu kimlik bilgisi yanıtı, giriş uç noktanıza gönderilir.

Daha fazla bilgi için aşağıdaki tabloya bakın:

Tür İsteğe bağlı Örnek
URL Varsayılan olarak geçerli sayfanın URI'si veya belirttiğiniz değerdir.
Yalnızca ux_mode: "redirect" ayarlandığında kullanılır.
login_uri: "https://www.example.com/login"

Giriş uç noktanız, gövdesinde kimlik jetonu değeri olan bir credential anahtarı içeren POST isteklerini işlemelidir.

Aşağıda, giriş uç noktanıza gönderilen örnek bir istek verilmiştir:

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

credential=ID_TOKEN

native_callback

Bu alan, tarayıcının yerel kimlik bilgisi yöneticisinden döndürülen şifre kimlik bilgisini işleyen JavaScript işlevinin adıdır. Daha fazla bilgi için aşağıdaki tabloya bakın:

Tür Zorunlu Örnek
işlev İsteğe bağlı native_callback: handleResponse

cancel_on_tap_outside

Bu alan, kullanıcı istem dışında bir yeri tıkladığında Tek Dokunma isteğinin iptal edilip edilmeyeceğini belirler. Varsayılan değer: true. Değeri false olarak ayarlayarak devre dışı bırakabilirsiniz. Daha fazla bilgi için aşağıdaki tabloya bakın:

Tür Zorunlu Örnek
boolean İsteğe bağlı cancel_on_tap_outside: false

prompt_parent_id

Bu özellik, kapsayıcı öğesinin DOM kimliğini ayarlar. Bu ayar yapılmadıysa pencerenin sağ üst köşesinde Tek Dokunma istemi gösterilir. Daha fazla bilgi için aşağıdaki tabloya bakın:

Tür Zorunlu Örnek
dize İsteğe bağlı prompt_parent_id: 'parent_id'

tek seferlik rastgele sayı

Bu alan, kimlik jetonu tarafından yeniden oynatma saldırılarını önlemek için kullanılan rastgele bir dizedir. Daha fazla bilgi için aşağıdaki tabloya bakın:

Tür Zorunlu Örnek
dize İsteğe bağlı nonce: "biaqbm70g23"

Nonce uzunluğu, ortamınız tarafından desteklenen maksimum JWT boyutu ve bağımsız tarayıcı ve sunucu HTTP boyutu kısıtlamalarıyla sınırlıdır.

context

Bu alan, tek dokunuş istemindeki başlığın ve mesajların metnini değiştirir. Daha fazla bilgi için aşağıdaki tabloya bakın:

Tür Zorunlu Örnek
dize İsteğe bağlı context: "use"

Aşağıdaki tabloda, kullanılabilir tüm bağlamlar ve açıklamaları listelenmiştir:

Bağlam
signin "Google ile oturum aç"
signup "Google ile kaydol"
use "Google ile kullan"

Ana alanda ve alt alan adlarında One Tap'i göstermeniz gerekiyorsa tek bir paylaşılan durum çerezi kullanılması için ana alanı bu alana iletin. Daha fazla bilgi için aşağıdaki tabloya bakın:

Tür Zorunlu Örnek
dize İsteğe bağlı state_cookie_domain: "example.com"

ux_mode

Google ile oturum açma düğmesinin kullandığı kullanıcı deneyimi akışını ayarlamak için bu alanı kullanın. Varsayılan değer popup'tür. Bu özelliğin OneTap kullanıcı deneyimi üzerinde etkisi yoktur. Daha fazla bilgi için aşağıdaki tabloya bakın:

Tür Zorunlu Örnek
dize İsteğe bağlı ux_mode: "redirect"

Aşağıdaki tabloda, kullanılabilir kullanıcı deneyimi modları ve açıklamaları listelenmiştir.

Kullanıcı deneyimi modu
popup Oturum açma kullanıcı deneyimi akışını pop-up pencerede gerçekleştirir.
redirect Tam sayfa yönlendirmeyle oturum açma kullanıcı deneyimi akışını gerçekleştirir.

allowed_parent_origin

Ara iframe'in yerleştirilmesine izin verilen kaynaklar. Bu alan mevcutsa One Tap, ara iframe modunda çalışır. Daha fazla bilgi için aşağıdaki tabloya bakın:

Tür Zorunlu Örnek
dize veya dize dizisi İsteğe bağlı allowed_parent_origin: "https://example.com"

Aşağıdaki tabloda desteklenen değer türleri ve açıklamaları listelenmiştir.

Değer Türleri
string Tek bir alan URI'si. "https://example.com"
string array Alan URI'leri dizisi. ["https://news.example.com", "https://local.example.com"]

Joker karakter ön ekleri de desteklenir. Örneğin, "https://*.example.com", example.com ve tüm düzeylerdeki alt alan adlarıyla (ör.news.example.com, login.news.example.com) eşleşir. Karıştırıcı karakterleri kullanırken dikkat etmeniz gereken noktalar:

  • Kalıp dizeleri yalnızca joker karakter ve üst düzey alan adı içeremez. Örneğin, https://.com ve https://.co.uk geçersizdir. Yukarıda belirtildiği gibi, "https://.example.com" example.com ve alt alan adlarıyla eşleşir. 2 farklı alanı temsil etmek için dizi de kullanabilirsiniz. Örneğin, ["https://example1.com", "https://.example2.com"], example1.com, example2.com alanlarını ve example2.com'in alt alanlarını eşleştirir
  • Joker karakterli alanlar güvenli bir https:// şemasıyla başlamalıdır. Bu nedenle "*.example.com" geçersiz kabul edilir.

allowed_parent_origin alanının değeri geçersizse ara iframe modunun Tek Dokunuşla Başlatma işlemi başarısız olur ve durur.

intermediate_iframe_close_callback

Kullanıcılar One Tap kullanıcı arayüzündeki "X" düğmesine dokunarak One Tap'i manuel olarak kapattığında varsayılan ara iframe davranışını geçersiz kılar. Varsayılan davranış, ara iframe'in DOM'den hemen kaldırılmasıdır.

intermediate_iframe_close_callback alanı yalnızca ara iframe modunda geçerli olur. Ayrıca, yalnızca One Tap iframe'i değil, ara iframe'i etkiler. Geri arama çağrısı yapılmadan önce One Tap kullanıcı arayüzü kaldırılır.

Tür Zorunlu Örnek
işlev İsteğe bağlı intermediate_iframe_close_callback: logBeforeClose

itp_support

Bu alan, Akıllı Takip Önleme'yi (ITP) destekleyen tarayıcılarda yeni sürüme geçirilmiş Tek Dokunuş kullanıcı deneyiminin etkinleştirilip etkinleştirilmeyeceğini belirler. Varsayılan değer: false. Daha fazla bilgi için aşağıdaki tabloya bakın:

Tür Zorunlu Örnek
boolean İsteğe bağlı itp_support: true

login_hint

Uygulamanız hangi kullanıcının oturum açması gerektiğini önceden biliyorsa Google'a giriş ipucu sağlayabilir. İşlem başarılı olduğunda hesap seçimi atlanır. Kabul edilen değerler: e-posta adresi veya kimlik jetonu sub alan değeridir.

Daha fazla bilgi için OpenID Connect belgelerindeki login_hint alanına bakın.

Tür Zorunlu Örnek
Dize, e-posta adresi veya kimlik jetonu alanındaki değer sub İsteğe bağlı login_hint: 'elisa.beckett@gmail.com'

hd

Kullanıcının birden fazla hesabı varsa ve yalnızca Workspace hesabıyla oturum açması gerekiyorsa Google'a alan adı ipucu sağlamak için bu özelliği kullanın. İşlem başarılı olduğunda, hesap seçimi sırasında gösterilen kullanıcı hesapları sağlanan alanla sınırlıdır. Karıştırıcı değer: *, kullanıcıya yalnızca Workspace hesapları sunar ve hesap seçimi sırasında tüketici hesaplarını (kullanıcı@gmail.com) hariç tutar.

Daha fazla bilgi için OpenID Connect dokümanlarında hd alanına bakın.

Tür Zorunlu Örnek
Dize. Tam nitelikli bir alan adı veya *. İsteğe bağlı hd: '*'

use_fedcm_for_prompt

Tarayıcının kullanıcı oturum açma istemlerini kontrol etmesine ve web siteniz ile Google arasındaki oturum açma akışını yönetmesine izin verin. Varsayılan değer yanlıştır. Daha fazla bilgi için FedCM'ye taşıma sayfasına bakın.

Tür Zorunlu Örnek
boolean İsteğe bağlı use_fedcm_for_prompt: true

enable_redirect_uri_validation

Yönlendirme URI'si doğrulama kurallarına uygun düğme yönlendirme akışını etkinleştirin.

Tür Zorunlu Örnek
boolean İsteğe bağlı enable_redirect_uri_validation: true

Yöntem: google.accounts.id.prompt

google.accounts.id.prompt yöntemi, initialize() yöntemi çağrıldıktan sonra Tek Dokunma istemini veya tarayıcı yerel kimlik bilgisi yöneticisini gösterir. Yöntemin aşağıdaki kod örneğine bakın:

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

Normalde prompt() yöntemi sayfa yüklenirken çağrılır. Google tarafındaki oturum durumu ve kullanıcı ayarları nedeniyle One Tap istemi kullanıcı arayüzü gösterilmeyebilir. Kullanıcı arayüzü durumuyla ilgili farklı anlarda bildirim almak için kullanıcı arayüzü durumu bildirimlerini almak üzere bir işlev iletin.

Bildirimler aşağıdaki durumlarda gönderilir:

  • Görüntüleme anı: Bu, prompt() yöntemi çağrıldıktan sonra gerçekleşir. Bildirim, kullanıcı arayüzünün gösterilip gösterilmediğini belirten bir boole değeri içerir.
  • Atlanan an: Bu durum, Tek Dokunma istemini otomatik veya manuel olarak iptal ettiğinizde ya da Google'ın kimlik bilgisi vermeyi başaramadığında (ör. seçili oturumda Google oturumu kapatıldığında) ortaya çıkar.

    Bu durumlarda, varsa sonraki kimlik sağlayıcılara geçmenizi öneririz.

  • Kapatma anı: Bu durum, Google bir kimlik bilgisini başarıyla aldığında veya kullanıcı kimlik bilgisi alma akışını durdurmak istediğinde ortaya çıkar. Örneğin, kullanıcı giriş iletişim kutunuza kullanıcı adını ve şifresini girmeye başladığında, Tek Dokunuş istemini kapatmak ve reddedilen bir an tetiklemek için google.accounts.id.cancel() yöntemini çağırabilirsiniz.

Aşağıdaki kod örneğinde atlanan an uygulanmaktadır:

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

Veri türü: PromptMomentNotification

Aşağıdaki tabloda PromptMomentNotification veri türünün yöntemleri ve açıklamaları listelenmiştir:

Yöntem
isDisplayMoment() Bu bildirim bir görüntüleme anı için mi?

Not: FedCM etkinleştirildiğinde bu bildirim gönderilmez. Daha fazla bilgi için FedCM'ye taşıma sayfasına bakın.
isDisplayed() Bu bildirim, ekran anı için mi gönderildi ve kullanıcı arayüzü gösteriliyor mu?

Not: FedCM etkinleştirildiğinde bu bildirim gönderilmez. Daha fazla bilgi için FedCM'ye taşıma sayfasına bakın.
isNotDisplayed() Bu bildirim, ekran anı için mi ve kullanıcı arayüzü gösterilmiyor mu?

Not: FedCM etkinleştirildiğinde bu bildirim gönderilmez. Daha fazla bilgi için FedCM'ye taşıma sayfasına bakın.
getNotDisplayedReason()

Kullanıcı arayüzünün gösterilmemesinin ayrıntılı nedeni. Olası değerler şunlardır:

  • browser_not_supported
  • invalid_client
  • missing_client_id
  • opt_out_or_no_session
  • secure_http_required
  • suppressed_by_user
  • unregistered_origin
  • unknown_reason
Not: FedCM etkinleştirildiğinde bu yöntem desteklenmez. Daha fazla bilgi için FedCM'ye taşıma sayfasına bakın.
isSkippedMoment() Bu bildirim, atlanan bir anla ilgili mi?
getSkippedReason()

Atlanan anın ayrıntılı nedeni. Olası değerler şunlardır:

  • auto_cancel
  • user_cancel
  • tap_outside
  • issuing_failed
Not: FedCM etkinleştirildiğinde bu yöntem desteklenmez. Daha fazla bilgi için FedCM'ye taşıma sayfasına bakın.
isDismissedMoment() Bu bildirim, kaldırılan bir anla ilgili mi?
getDismissedReason()

Fesih işleminin ayrıntılı nedeni. Olası değerler şunlardır:

  • credential_returned
  • cancel_called
  • flow_restarted
getMomentType()

An türü için bir dize döndürür. Olası değerler şunlardır:

  • display
  • skipped
  • dismissed

Veri türü: CredentialResponse

callback işleviniz çağrıldığında parametre olarak bir CredentialResponse nesnesi iletilir. Aşağıdaki tabloda, kimlik bilgisi yanıt nesnesindeki alanlar listelenmiştir:

Alan
credential Bu alan, döndürülen kimlik jetonudur.
select_by Bu alan, kimlik bilgisinin nasıl seçileceğini belirler.
state Bu alan yalnızca kullanıcı oturum açmak için Google ile oturum aç düğmesini tıkladığında ve düğmenin state özelliği belirtildiğinde tanımlanır.

yeterlilik belgesi

Bu alan, base64 kodlamalı bir JSON Web Token (JWT) dizesi olarak kimlik jetonudur.

Kodunun çözüldüğü durumlarda JWT aşağıdaki örnek gibi görünür:

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"
}

sub alanı, Google Hesabı için dünya genelinde benzersiz bir tanımlayıcıdır. Tüm Google Hesapları arasında benzersiz olduğu ve hiçbir zaman yeniden kullanılmadığı için kullanıcının tanımlayıcısı olarak yalnızca sub alanını kullanın. Google Hesabı'nın farklı zamanlarda birden fazla e-posta adresi olabileceğinden, tanımlayıcı olarak e-posta adresini kullanmayın.

email, email_verified ve hd alanlarını kullanarak Google'ın bir e-posta adresini barındırıp barındırmadığını ve bu e-posta adresi için yetkili olup olmadığını belirleyebilirsiniz. Google'ın yetkili olduğu durumlarda, kullanıcının meşru hesap sahibi olduğu onaylanır.

Google'ın yetkili olduğu durumlar:

  • email, @gmail.com son ekiyle bitiyorsa bu bir Gmail hesabıdır.
  • email_verified doğruysa ve hd ayarlanmışsa bu bir Google Workspace hesabıdır.

Kullanıcılar Gmail veya Google Workspace'i kullanmadan Google Hesabı'na kaydolabilir. email, @gmail.com soneki içermiyorsa ve hd yoksa Google yetkili değildir ve kullanıcıyı doğrulamak için şifre veya başka istem yöntemleri önerilir. Google, Google Hesabı oluşturulduğunda kullanıcıyı ilk kez doğruladığı için email_verfied doğru olabilir. Ancak üçüncü taraf e-posta hesabının sahipliği o zamandan beri değişmiş olabilir.

exp alanı, jetonu sunucu tarafında doğrulamanız için son kullanma tarihini gösterir. Google ile oturum açma özelliğinden elde edilen kimlik jetonu için bir saattir. Süre dolmadan önce jetonu doğrulamanız gerekir. Oturum yönetimi için exp kullanmayın. Geçerlilik süresi dolmuş bir kimlik jetonu, kullanıcının oturumunun kapalı olduğu anlamına gelmez. Kullanıcılarınızın oturum yönetiminden uygulamanız sorumludur.

select_by

Aşağıdaki tabloda select_by alanı için olası değerler listelenmektedir. Değeri ayarlamak için oturum ve izin durumuyla birlikte kullanılan düğme türü kullanılır.

  • Kullanıcı, One Tap veya Google ile oturum aç düğmesine bastı ya da dokunmadan otomatik oturum açma sürecini kullandı.

  • Mevcut bir oturum bulundu veya kullanıcı yeni bir oturum oluşturmak için bir Google Hesabı seçip oturum açtı.

  • Kullanıcı, kimlik jetonu kimlik bilgilerini uygulamanızla paylaşmadan önce:

    • Kimlik bilgilerini paylaşma izni vermek için Onayla düğmesini bastıysa veya
    • Daha önce izin verdiyseniz ve Google Hesabı seçmek için Hesap Seç'i kullandıysanız

Bu alanın değeri aşağıdaki türlerden birine ayarlanır:

Değer Açıklama
auto Mevcut oturumu olan ve daha önce kimlik bilgilerini paylaşma izni vermiş bir kullanıcının otomatik olarak oturum açması. Yalnızca FedCM tarafından desteklenmeyen tarayıcılar için geçerlidir.
user Mevcut oturumu olan ve daha önce izin vermiş bir kullanıcı, kimlik bilgilerini paylaşmak için One Tap'in "Bu kimlikle devam et" düğmesine bastı. Yalnızca FedCM tarafından desteklenmeyen tarayıcılar için geçerlidir.
fedcm Bir kullanıcı, FedCM'yi kullanarak kimlik bilgilerini paylaşmak için Tek Dokunuş ile "Bu kimlikle devam et" düğmesine bastı. Yalnızca FedCM tarafından desteklenen tarayıcılar için geçerlidir.
fedcm_auto Mevcut oturumu olan ve daha önce FedCM One Tap'ı kullanarak kimlik bilgilerini paylaşma izni vermiş bir kullanıcının otomatik olarak oturum açması. Yalnızca FedCM tarafından desteklenen tarayıcılar için geçerlidir.
user_1tap Mevcut oturumu olan bir kullanıcı, izin vermek ve kimlik bilgilerini paylaşmak için One Tap'in "Bu kimlikle devam et" düğmesine bastı. Yalnızca Chrome 75 ve sonraki sürümler için geçerlidir.
user_2tap Mevcut oturumu olmayan bir kullanıcı, hesap seçmek için Tek Dokunuş'taki "Bu kimlikle devam et" düğmesine, ardından izin vermek ve kimlik bilgilerini paylaşmak için pop-up pencerede Onayla düğmesine bastı. Chromium tabanlı olmayan tarayıcılar için geçerlidir.
itp Mevcut bir oturumu olan ve daha önce izin vermiş bir kullanıcı, ITP tarayıcılarında Tek Dokunma'ya bastı.
itp_confirm Mevcut oturumu olan bir kullanıcı, ITP tarayıcılarında Tek Tıklama'ya ve ardından izin vermek ve kimlik bilgilerini paylaşmak için Onay düğmesine bastı.
itp_add_session Mevcut oturumu olmayan ve daha önce izin veren bir kullanıcı, Google Hesabı seçip kimlik bilgilerini paylaşmak için ITP tarayıcılarında Tek Dokunuş'a bastı.
itp_confirm_add_session Mevcut oturumu olmayan bir kullanıcı, önce bir Google Hesabı seçmek için ITP tarayıcılarında Tek Dokunuş'a, ardından kimlik bilgilerini paylaşmak ve izin vermek için Onayla düğmesine bastı.
btn Mevcut oturumu olan ve daha önce izin veren bir kullanıcı, kimlik bilgilerini paylaşmak için Google ile oturum aç düğmesine bastı ve "Hesap seçin" bölümünden bir Google Hesabı seçti.
btn_confirm Mevcut oturumu olan bir kullanıcı, izin vermek ve kimlik bilgilerini paylaşmak için Google ile Oturum Aç düğmesine ve Onay'a bastı.
btn_add_session Mevcut oturumu olmayan ve daha önce izin vermiş bir kullanıcı, Google Hesabı seçmek ve kimlik bilgilerini paylaşmak için Google ile oturum aç düğmesine bastı.
btn_confirm_add_session Mevcut oturumu olmayan bir kullanıcı, önce Google ile Oturum Aç düğmesine basarak bir Google Hesabı seçti, ardından Onayla düğmesine basarak izin verdi ve kimlik bilgilerini paylaştı.

durum

Bu alan yalnızca kullanıcı oturum açmak için Google ile oturum açma düğmesini tıkladığında ve tıklanan düğmenin state özelliği belirtildiğinde tanımlanır. Bu alanın değeri, düğmenin state özelliğinde belirttiğiniz değerle aynıdır.

Aynı sayfada birden fazla Google ile oturum açma düğmesi oluşturulabileceğinden, her düğmeye benzersiz bir dize atayabilirsiniz. Bu nedenle, kullanıcının oturum açmak için hangi düğmeyi tıkladığını belirlemek üzere bu state alanını kullanabilirsiniz.

Yöntem: google.accounts.id.renderButton

google.accounts.id.renderButton yöntemi, web sayfalarınızda Google ile oturum açma düğmesi oluşturur.

Yöntemin aşağıdaki kod örneğine bakın:

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

Veri türü: GsiButtonConfiguration

Aşağıdaki tabloda GsiButtonConfiguration veri türünün alanları ve açıklamaları listelenmiştir:

Özellik
type Düğme türü: simge veya standart düğme.
theme Düğme teması. Örneğin, dolu_mavi veya dolu_siyah.
size Düğme boyutu. Örneğin, küçük veya büyük.
text Düğme metni. Örneğin, "Google ile oturum aç" veya "Google ile kaydol".
shape Düğme şekli. Örneğin, dikdörtgen veya dairesel.
logo_alignment Google logosunun hizalaması: sol veya orta.
width Düğmenin piksel cinsinden genişliği.
locale Ayarlanırsa düğme dili oluşturulur.
click_listener Ayarlanırsa Google ile oturum aç düğmesi tıklandığında bu işlev çağrılır.
state Ayarlanırsa bu dize, kimlik jetonuyla birlikte döndürülür.

Özellik türleri

Aşağıdaki bölümlerde, her bir özelliğin türü ve bir örnek hakkında ayrıntılı bilgi verilmektedir.

tür

Düğme türü. Varsayılan değer: standard.

Daha fazla bilgi için aşağıdaki tabloya bakın:

Tür Zorunlu Örnek
dize Evet type: "icon"

Aşağıdaki tabloda, kullanılabilen düğme türleri ve açıklamaları listelenmiştir:

Tür
standard
Metin veya kişiselleştirilmiş bilgiler içeren düğme.
icon
Metin içermeyen bir simge düğmesi.

tema

Düğme teması. Varsayılan değer: outline. Daha fazla bilgi için aşağıdaki tabloya bakın:

Tür Zorunlu Örnek
dize İsteğe bağlı theme: "filled_blue"

Aşağıdaki tabloda mevcut temalar ve açıklamaları listelenmiştir:

Tema
outline
Standart bir düğme teması.
filled_blue
Mavi dolu düğme teması.
filled_black
İçi siyah düğme teması.

beden

Düğme boyutu. Varsayılan değer: large. Daha fazla bilgi için aşağıdaki tabloya bakın:

Tür Zorunlu Örnek
dize İsteğe bağlı size: "small"

Aşağıdaki tabloda, kullanılabilen düğme boyutları ve açıklamaları listelenmiştir:

Boyut
large
Büyük standart bir düğme Büyük simge düğmesi Büyük, kişiselleştirilmiş bir düğme
Büyük bir düğme.
medium
Orta boy standart bir düğme Orta boy simge düğmesi
Orta boyutlu bir düğme.
small
Küçük bir düğme Küçük simge düğmesi
Küçük bir düğme.

text (metin)

Düğme metni. Varsayılan değer: signin_with. Farklı text özelliklerine sahip simge düğmelerinin metninde görsel farklılık yoktur. Bunun tek istisnası, metnin ekran erişilebilirliği için okunmasıdır.

Daha fazla bilgi için aşağıdaki tabloya bakın:

Tür Zorunlu Örnek
dize İsteğe bağlı text: "signup_with"

Aşağıdaki tabloda, mevcut tüm düğme metinleri ve açıklamaları listelenmiştir:

Metin
signin_with
"Google ile oturum aç" düğmesi metni.
signup_with
"Google ile kaydol" düğmesi metni.
continue_with
"Google ile devam et" düğmesi metni.
signin
Düğme metni "Giriş yap"tır.

şekil

Düğme şekli. Varsayılan değer: rectangular. Daha fazla bilgi için aşağıdaki tabloya bakın:

Tür Zorunlu Örnek
dize İsteğe bağlı shape: "rectangular"

Aşağıdaki tabloda, kullanılabilen düğme şekilleri ve açıklamaları listelenmiştir:

Şekil
rectangular
Dikdörtgen şeklindeki düğme. icon düğme türü için kullanılıyorsa square ile aynıdır.
pill
Hap şeklindeki düğme. icon düğme türü için kullanılıyorsa circle ile aynıdır.
circle
Daire şeklindeki düğme. standard düğme türü için kullanılıyorsa pill ile aynıdır.
square
Kare şeklindeki düğme. standard düğme türü için kullanılıyorsa rectangular ile aynıdır.

logo_alignment

Google logosunun hizalaması. Varsayılan değer: left. Bu özellik yalnızca standard düğme türü için geçerlidir. Daha fazla bilgi için aşağıdaki tabloya bakın:

Tür Zorunlu Örnek
dize İsteğe bağlı logo_alignment: "center"

Aşağıdaki tabloda, kullanılabilen hizalamalar ve açıklamaları listelenmiştir:

logo_alignment
left
Google logosunu sola hizalar.
center
Google logosunu orta hizaya getirir.

genişlik

Piksel cinsinden minimum düğme genişliği. Maksimum genişlik 400 pikseldir.

Daha fazla bilgi için aşağıdaki tabloya bakın:

Tür Zorunlu Örnek
dize İsteğe bağlı width: "400"

locale

İsteğe bağlı. Düğme metnini belirtilen yerel ayarı kullanarak gösterin. Aksi takdirde varsayılan olarak kullanıcının Google Hesabı veya tarayıcı ayarları kullanılır. Kitaplığı yüklerken src yönergesine hl parametresini ve dil kodunu ekleyin. Örneğin: gsi/client?hl=<iso-639-code>.

Ayarlanmazsa tarayıcının varsayılan yerel ayarı veya Google oturumu kullanıcısının tercihi kullanılır. Bu nedenle, farklı kullanıcılar yerelleştirilmiş düğmelerin farklı sürümlerini ve muhtemelen farklı boyutlarda görebilir.

Daha fazla bilgi için aşağıdaki tabloya bakın:

Tür Zorunlu Örnek
dize İsteğe bağlı locale: "zh_CN"

click_listener

click_listener özelliğini kullanarak Google ile oturum açma düğmesi tıklandığında çağrılacak bir JavaScript işlevi tanımlayabilirsiniz.

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

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

Bu örnekte, Google ile oturum açma düğmesi tıklandığında Google ile oturum açma düğmesi tıklandı... mesajı konsola kaydedilir.

durum

İsteğe bağlı olarak, aynı sayfada birden fazla Google ile oturum açma düğmesi oluşturulabileceğinden her düğmeye benzersiz bir dize atayabilirsiniz. Kimlik jetonuyla birlikte aynı dize döndürülür. Böylece, kullanıcının oturum açmak için hangi düğmeyi tıkladığını belirleyebilirsiniz.

Daha fazla bilgi için aşağıdaki tabloya bakın:

Tür Zorunlu Örnek
dize İsteğe bağlı data-state: "button 1"

Veri türü: Kimlik bilgisi

native_callback işleviniz çağrıldığında parametre olarak bir Credential nesnesi iletilir. Aşağıdaki tabloda nesnede bulunan alanlar listelenmektedir:

Alan
id Kullanıcıyı tanımlar.
password Şifre

Yöntem: google.accounts.id.disableAutoSelect

Kullanıcı web sitenizdeki oturumunu kapattığında durumu çerezlere kaydetmek için google.accounts.id.disableAutoSelect yöntemini çağırmanız gerekir. Bu, kullanıcı deneyiminde kilitlenme olmasını önler. Yöntemin aşağıdaki kod snippet'ine bakın:

google.accounts.id.disableAutoSelect()

Aşağıdaki kod örneğinde, google.accounts.id.disableAutoSelect yöntemi bir onSignout() işleviyle uygulanmaktadır:

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

Yöntem: google.accounts.id.storeCredential

Bu yöntem, tarayıcının yerel kimlik bilgisi yöneticisi API'sinin store() yönteminin sarmalayıcısıdır. Bu nedenle, yalnızca şifre kimlik bilgisini depolamak için kullanılabilir. Yöntemin aşağıdaki kod örneğine bakın:

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

Aşağıdaki kod örneğinde, google.accounts.id.storeCredential yöntemi bir onSignIn() işleviyle uygulanmaktadır:

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

Yöntem: google.accounts.id.cancel

İstemleri güvenen taraf DOM'undan kaldırırsanız Tek Dokunuş akışını iptal edebilirsiniz. Halihazırda bir kimlik bilgisi seçiliyse iptal işlemi yoksayılır. Yöntemin aşağıdaki kod örneğine bakın:

google.accounts.id.cancel()

Aşağıdaki kod örneğinde, google.accounts.id.cancel() yöntemi bir onNextButtonClicked() işleviyle uygulanmaktadır:

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

Kitaplık yükleme geri çağırma işlevi: onGoogleLibraryLoad

onGoogleLibraryLoad geri arama kaydı oluşturabilirsiniz. Google ile Oturum Açma JavaScript kitaplığı yüklendikten sonra bildirim gönderilir:

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

Bu geri çağırma, window.onload geri çağırması için yalnızca bir kısayoldur. Davranışta herhangi bir fark yoktur.

Aşağıdaki kod örneğinde onGoogleLibraryLoad geri çağırma işlevi uygulanmaktadır:

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

Yöntem: google.accounts.id.revoke

google.accounts.id.revoke yöntemi, belirtilen kullanıcının kimlik jetonunu paylaşmak için kullanılan OAuth iznini iptal eder. Yöntemin aşağıdaki kod snippet'ine bakın: javascript google.accounts.id.revoke(login_hint, callback)

Parametre Tür Açıklama
login_hint dize Kullanıcının Google Hesabı'nın e-posta adresi veya benzersiz kimliği. Kimlik, kimlik bilgisi yükündeki sub mülküdür.
callback işlev İsteğe bağlı RevocationResponse işleyicisi.

Aşağıdaki kod örneğinde, revoke yönteminin bir kimlikle nasıl kullanılacağı gösterilmektedir.

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

Veri türü: RevocationResponse

callback işleviniz çağrıldığında parametre olarak bir RevocationResponse nesnesi iletilir. Aşağıdaki tabloda, iptal yanıtı nesnesinde bulunan alanlar listelenmiştir:

Alan
successful Bu alan, yöntem çağrısının döndürdüğü değerdir.
error Bu alan isteğe bağlı olarak ayrıntılı bir hata yanıtı mesajı içerir.

başarılı

Bu alan, iptal yöntemi çağrısı başarılı olursa true, başarısız olursa false olarak ayarlanan bir boole değeridir.

hata

Bu alan bir dize değeridir ve iptal yöntemi çağrısı başarısız olursa ayrıntılı bir hata mesajı içerir. Başarılı olursa tanımlanmaz.