Google JavaScript API ile Oturum Açma referansı

Bu referans sayfasında Sign-In JavaScript API açıklanmaktadır. Web sayfalarınızda One Tap istemini veya Google ile oturum aç 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ği, google.accounts.id.initialize yöntemini bir onload işleviyle uygular:

<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ılabilecek bir Google ile Oturum Aç istemci örneği oluşturur.

• Aynı web sayfasında birden fazla modül (ör. One Tap, Kişiselleştirilmiş düğme, iptal vb.) kullanıyor olsanız bile google.accounts.id.initialize yöntemini bir kez çağırmanız yeterlidir.
• 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.

google.accounts.id.initialize yöntemini her çağırdığınızda yapılandırmaları sıfırlarsınız ve aynı web sayfasında bulunan 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. Bu özellik, Google ile Oturum Aç düğmesi redirect kullanıcı deneyimi modunda kullanılı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	One Tap istem 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	Üst alanda ve alt alan adlarında One Tap'i çağırmanız gerekiyorsa tek bir paylaşılan çerezin kullanılabilmesi için üst alanı bu alana iletin.
ux_mode	Google ile Oturum Açma düğmesi kullanıcı deneyimi akışı
allowed_parent_origin	Ara iframe'i yerleştirmesine izin verilen kaynaklar. Bu alan mevcutsa One Tap, 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ılarda yükseltilmiş One Tap kullanıcı deneyimini etkinleştirir.
login_hint	Kullanıcı ipucu sağlayarak hesap seçimini atlayın.
hd	Hesap seçimini alana göre sınırlandırı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ı uyumlulaştırmasına izin verin.

client_id

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

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

otomatik_seçim

Bu alan, uygulamanızı daha önce onaylayan tek bir Google oturumu olduğunda herhangi bir kullanıcı etkileşimi olmadan otomatik olarak bir kimlik jetonunun döndürülüp döndürülmeyeceğini belirler. false, varsayılan değerdir. 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, One Tap isteminden veya pop-up pencereden döndürülen kimlik jetonunu işleyen JavaScript işlevidir. Kullanıcı deneyimi modu, Google One Tap veya Google ile oturum aç düğmesi popup kullanıldığında zorunludur. Daha fazla bilgi için aşağıdaki tabloya bakın:

Tür	Zorunlu	Örnek
function	One Tap ve popup kullanıcı deneyimi modu için gereklidir	callback: handleResponse

giriş_uri

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

Değer, API Konsolu'nda yapılandırdığınız OAuth 2.0 istemcisi için yetkili yönlendirme URI'lerinden biriyle tam olarak eşleşmelidir ve Yönlendirme URI'si doğrulama kurallarımıza uymalıdır.

Geçerli sayfa giriş sayfanızsa bu özellik atlanabilir. Bu durumda, kimlik bilgileri varsayılan olarak bu sayfaya yayınlanır.

Kimlik jetonu kimlik bilgisi yanıtı, bir kullanıcı Google ile Oturum Aç düğmesini tıkladığında ve yönlendirme kullanıcı deneyimi modu kullanıldığında 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'sına veya belirttiğiniz değere ayarlanır. 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 bir örnek istek verilmiştir:

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

credential=ID_TOKEN

yerel_geri arama

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

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

cancel_on_tap_outside

Bu alan, kullanıcı istemin dışına tıkladığında One Tap isteğinin iptal edilip edilmeyeceğini belirler. true, varsayılan değerdir. Değeri false olarak ayarlarsanız 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

istem_üst_öğesi_kimliği

Bu özellik, kapsayıcı öğenin DOM kimliğini ayarlar. Politika ayarlanmazsa pencerenin sağ üst köşesinde One Tap istemi görüntülenir. Daha fazla bilgi için aşağıdaki tabloya bakın:

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

tek seferlik rastgele sayı

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

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

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

context

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

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

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

İçerik
signin	"Google ile oturum aç"
signup	"Google'a kaydolun"
use	"Google ile kullan"

durum_çerez_alan_adi

Üst alanda ve alt alan adlarında One Tap'i görüntülemeniz gerekiyorsa tek bir paylaşılan durum çerezinin kullanılabilmesi için üst alanı bu alana iletin. Daha fazla bilgi için aşağıdaki tabloya bakın:

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

ux_modu

Google ile Oturum Aç düğmesi tarafından kullanılan kullanıcı deneyimi akışını ayarlamak için bu alanı kullanın. popup, varsayılan değerdir. Bu özelliğin OneTap kullanıcı deneyimi üzerinde herhangi bir etkisi yoktur. Daha fazla bilgi için aşağıdaki tabloya bakın:

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

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

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

izin_verilen_üst_kaynak

Ara iframe'i yerleştirmesine 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 bunların açıklamaları listelenmiştir.

Değer Türleri
string	Tek bir alan URI'sı.	"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 alt alan adlarıyla tüm düzeylerde eşleşir (ör.news.example.com, login.news.example.com). Joker karakter kullanırken göz önünde bulundurulması gerekenler:

• Kalıp dizeleri yalnızca joker karakter ve üst düzey alandan oluşabilir. Ö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 eden bir dizi de kullanabilirsiniz. Örneğin ["https://example1.com", "https://*.example2.com"]; example1.com, example2.com alanları ve example2.com alt alan adlarıyla eşleşir
• Joker karakterli alan adları güvenli bir https:// şemasıyla başlamalıdır. Bu nedenle, "*.example.com" geçersiz olarak kabul edilir.

allowed_parent_origin alanının değeri geçersizse ara iframe modunun One Tap ile başlatılması başarısız olur ve durur.

ara_iframe_close_callback

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

intermediate_iframe_close_callback alanı yalnızca ara iframe modunda etkili olur. Ayrıca, One Tap iframe yerine yalnızca ara iframe'i etkiler. One Tap kullanıcı arayüzü, geri çağırma başlatılmadan önce kaldırılır.

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

ITP_destek

Bu alan, yeni sürüme geçirilmiş One Tap UX'in, Akıllı İzleme Önleme'yi (ITP) destekleyen tarayıcılarda etkinleştirilip etkinleştirilmeyeceğini belirler. Varsayılan değer false olarak ayarlanmıştır. Daha fazla bilgi için aşağıdaki tabloya bakın:

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

giriş_hint

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

Daha fazla bilgi için OpenID Connect belgelerindeki login_hint alanına göz atın.

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

hd

Bir 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 bunu kullanın. İşlem başarılı olduğunda, hesap seçimi sırasında görüntülenen kullanıcı hesapları belirtilen alanla sınırlıdır. Joker karakter değeri: *, kullanıcıya yalnızca Workspace hesapları sunar ve hesap seçimi sırasında tüketici hesaplarını (kullanici@gmail.com) hariç tutar.

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

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

istem_için_fedürü_kullan

Tarayıcının, kullanıcı oturum açma istemlerini kontrol etmesine ve web siteniz ile Google arasındaki oturum açma akışını uyumlulaştırmasına izin verin. Varsayılan olarak false (yanlış) değerine ayarlanır.

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

Yöntem: google.accounts.id.prompt

google.accounts.id.prompt yöntemi, initialize() yöntemi çağrıldıktan sonra One Tap istemini veya tarayıcının yerel kimlik bilgisi yöneticisini görüntüler. 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üklemede çağrılır. Google tarafındaki oturum durumu ve kullanıcı ayarları nedeniyle One Tap istem kullanıcı arayüzü görüntülenmeyebilir. Farklı anların kullanıcı arayüzü durumlarıyla ilgili bildirim almak için kullanıcı arayüzü durum bildirimlerini almak üzere bir işlev iletin.

Bildirimler aşağıdaki anlarda tetiklenir:

• 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, One Tap istemi otomatik iptal veya manuel iptal nedeniyle kapatıldığında veya Google bir kimlik bilgisi gönderemediğinde (ör. seçili oturumda Google oturumu kapatıldığında) ortaya çıkar.

  Bu gibi durumlarda, varsa sonraki kimlik sağlayıcılarla devam etmenizi öneririz.

• Kapatılma anları: Google, kimlik bilgilerini başarıyla aldığında veya bir kullanıcı kimlik bilgisi alma akışını durdurmak istediğinde bu durum meydana gelir. Örneğin, kullanıcı giriş iletişim kutunuza kullanıcı adını ve şifresini girmeye başladığında, One Tap istemini kapatmak ve kapatma anı tetiklemek için google.accounts.id.cancel() yöntemini çağırabilirsiniz.

Aşağıdaki kod örneği, atlanan anı uygular:

<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ü: PromptMomentBildirim

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

Yöntem
isDisplayMoment()	Bu bildirim, görüntü için mi?
isDisplayed()	Bu bildirim bir görüntüleme an için mi ve kullanıcı arayüzü görüntüleniyor mu?
isNotDisplayed()	Bu bildirim bir görüntüleme anına yönelik mi ve kullanıcı arayüzü görüntülenmiyor mu?
getNotDisplayedReason()	Kullanıcı arayüzünün görüntülenmeme 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
isSkippedMoment()	Bu bildirim, atlanan an için mi?
getSkippedReason()	Atlanan anın ayrıntılı nedeni. Olası değerler şunlardır: auto_cancel user_cancel tap_outside issuing_failed
isDismissedMoment()	Bu bildirim kapatılmak için mi?
getDismissedReason()	Reddetme nedeninin ayrıntılı açıklaması. 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 nesnesinde bulunan 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.

giriş bilgisi

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

JWT, kodu çözüldüğünde aşağıdaki örnekte olduğu 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 genel olarak benzersiz bir tanımlayıcı içerir.

email, email_verified ve hd alanlarını kullanarak, Google'ın bir e-posta adresi barındırıp barındırmadığını ve bu adres 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 ekine sahip. Bu bir Gmail Hesabı'dır.
• email_verified doğru ve hd ayarlandı. Bu bir Google Workspace hesabı.

Kullanıcılar Gmail veya Google Workspace kullanmadan Google Hesaplarına kaydolabilir. email, @gmail.com son eki içermediğinde ve hd olmadığında Google yetkili değildir ve kullanıcıyı doğrulamak için şifre veya başka sorgulama yöntemleri önerilir. Google, kullanıcıyı ilk olarak Google Hesabı oluşturulduğunda 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ı, sunucu tarafındaki jetonu doğrulamanız için son kullanma tarihini gösterir. Google ile Oturum Açma özelliğinden alınan kimlik jetonu için bu süre bir saattir. Geçerlilik süresi sona ermeden önce jetonu doğrulamanız gerekir. Oturum yönetimi için exp adını kullanmayın. Süresi dolmuş bir kimlik jetonu, kullanıcının oturumunun kapatıldığı anlamına gelmez. Uygulamanız, kullanıcılarınızın oturum yönetiminden sorumludur.

seçme_kriteri

Aşağıdaki tabloda select_by alanı için olası değerler listelenmektedir. Oturum ve izin durumu ile birlikte kullanılan düğme türü, değeri belirlemek için kullanılır.

• Kullanıcı, One Tap veya Google ile Oturum Aç düğmesine bastı ya da dokunmadan otomatik oturum açma işlemini kullandı.

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

• Kimlik jetonu kimlik bilgilerini uygulamanızla paylaşmadan önce kullanıcı,

  • kimlik bilgilerinin paylaşılmasına izin vermek için Onayla düğmesine bastı veya
  • Kullanıcı, daha önce izin vermiş ve bir Google Hesabı seçmek için Hesap Seç özelliğini kullanmış olabilir.

Bu alanın değeri şu türlerden birine ayarlandığında:

Değer	Açıklama
auto	Daha önce kimlik bilgilerinin paylaşılmasına izin vermiş olan mevcut bir oturumuyla bir kullanıcının otomatik olarak oturum açması.
user	Mevcut oturumunda daha önce izin vermiş bir kullanıcı, kimlik bilgilerini paylaşmak için One Tap "Farklı devam et" düğmesine bastı.
user_1tap	Mevcut oturumu olan bir kullanıcı, izin vermek ve kimlik bilgilerini paylaşmak için One Tap "Farklı devam et" düğmesine bastı. Yalnızca Chrome v75 ve sonraki sürümler için geçerlidir.
user_2tap	Mevcut oturumu olmayan bir kullanıcı, hesap seçmek için One Tap "Farklı devam et" düğmesine, ardından izin vermek ve kimlik bilgilerini paylaşmak için pop-up penceredeki Onayla düğmesine bastı. Chromium tabanlı olmayan tarayıcılar için geçerlidir.
btn	Mevcut oturumunda daha önce izin vermiş bir kullanıcı, Google ile Oturum Aç düğmesine bastı ve kimlik bilgilerini paylaşmak için "Hesap Seçin" bölümünden Google Hesabı seçti.
btn_confirm	Mevcut bir oturumu olan bir kullanıcı, izin vermek ve kimlik bilgilerini paylaşmak için Google ile Oturum Aç düğmesine, ardından Onayla düğmesine bastı.
btn_add_session	Mevcut oturumu olmayan ve daha önce izin veren 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 bir oturumu olmayan bir kullanıcı, önce Google Hesabı seçmek için Google ile Oturum Aç düğmesine, ardından izin vermek ve kimlik bilgilerini paylaşmak için Onayla düğmesine bastı.

Yöntem: google.accounts.id.renderButton

google.accounts.id.renderButton yöntemi, web sayfalarınızda Google ile Oturum Aç 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, doldurulmuş_mavi veya doldurulmuş_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 kaydolun".
shape	Düğme şekli. Örneğin, dikdörtgen veya yuvarlak.
logo_alignment	Google logosunu hizalama: sola veya ortaya.
width	Piksel cinsinden düğme genişliği.
locale	Ayarlanırsa düğme dili oluşturulur.
click_listener	Ayarlanırsa bu işlev, Google ile oturum aç düğmesi tıklandığında çağrılır.

Özellik türleri

Aşağıdaki bölümlerde her özellik türü hakkında ayrıntılar ve bir örnek bulunmaktadır.

tür

Düğme türü. standard, varsayılan değerdir.

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

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

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

Tür
standard
icon

tema

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

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

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

Tema
outline
filled_blue
filled_black

boy

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

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

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

Boyut
large
medium
small

text (metin)

Düğme metni. signin_with, varsayılan değerdir. Farklı text özelliklerine sahip simge düğmelerinin metninde görsel fark yoktur. Tek istisna, 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
string	İsteğe bağlı	text: "signup_with"

Aşağıdaki tabloda kullanılabilir düğme metinleri ve açıklamaları listelenmiştir:

Metin
signin_with
signup_with
continue_with
signin

shape

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

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

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

Şekil
rectangular
pill
circle
square

logo_hizalama

Google logosunun hizalaması. left, varsayılan değerdir. 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
string	İsteğe bağlı	logo_alignment: "center"

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

logo_hizalama
left
center

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
string	İsteğe bağlı	width: "400"

locale

İsteğe bağlı. Düğme metnini belirtilen yerel ayarı kullanarak görüntüleyin. Aksi takdirde varsayılan olarak kullanıcının Google Hesabı veya tarayıcı ayarları kullanılır. Kitaplığı yüklerken hl parametresini ve dil kodunu src yönergesine 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. Dolayısıyla, farklı kullanıcılar yerelleştirilmiş düğmelerin farklı sürümlerini ve muhtemelen farklı boyutlarda görebilirler.

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

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

tıklama_dinleyicisi

click_listener özelliğini kullanarak, Google ile oturum aç 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ç düğmesi tıklandığında Google ile oturum aç düğmesi tıklandığında... mesajı konsola kaydedilir.

Veri türü: Kimlik bilgisi

native_callback işleviniz çağrıldığında parametre olarak bir Credential nesnesi aktarılır. Aşağıdaki tabloda, nesnede bulunan alanlar listelenmiştir:

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

Yöntem: google.accounts.id.disableAutoSelect

Kullanıcı web sitenizde oturumu kapattığında, durumu çerezlere kaydetmek için google.accounts.id.disableAutoSelect yöntemini çağırmanız gerekir. Bu, kullanıcı deneyimindeki ölü döngülerin önüne geçer. Yöntemin aşağıdaki kod snippet'ini inceleyin:

google.accounts.id.disableAutoSelect()

Aşağıdaki kod örneği, google.accounts.id.disableAutoSelect yöntemini bir onSignout() işleviyle uygular:

<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öntemi için bir sarmalayıcıdır. Bu nedenle, yalnızca şifre kimlik bilgilerini 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ği, google.accounts.id.storeCredential yöntemini bir onSignIn() işleviyle uygular:

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

Yöntem: google.accounts.id.cancel

İstemi bağlı taraf DOM'den kaldırırsanız One Tap akışını iptal edebilirsiniz. Bir kimlik bilgisi zaten 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ği, google.accounts.id.cancel() yöntemini bir onNextButtonClicked() işleviyle uygular:

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

Kitaplık yüklemesi geri çağırması: onGoogleLibraryLoad

onGoogleLibraryLoad geri çağırması kaydedebilirsiniz. Google JavaScript ile Oturum Açma kitaplığı yüklendikten sonra bildirilir:

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

Bu geri çağırma, window.onload geri çağırma işleminin kısayoludur. Davranışlar arasında fark yok.

Aşağıdaki kod örneği, bir onGoogleLibraryLoad geri çağırma işlemini uygular:

<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ı için kimlik jetonunu paylaşmak üzere kullanılan OAuth iznini iptal eder. Yöntemin aşağıdaki kod snippet'ini inceleyin: javascript google.accounts.id.revoke(login_hint, callback)

Parametre	Tür	Açıklama
login_hint	string	Kullanıcının Google Hesabının e-posta adresi veya benzersiz kimliği. Kimlik, credential yükünün sub özelliğidir.
callback	function	İsteğe bağlı RevocationResponse işleyici.

Aşağıdaki kod örneğinde, revoke yönteminin 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ürülen değeridir.
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" (doğru), başarısız olduğunda "false" (yanlış) olarak ayarlanmış 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ısız olduğunda bu alan tanımlanmaz.