Google ile Oturum Açma'dan geçiş yapın (original) (raw)

Bu kılavuz, kimlik doğrulama için JavaScript kitaplıklarını eski Google ile Oturum Açma platformu kitaplığından yeni Google Kimlik Hizmetleri kitaplığına başarıyla taşımak üzere gerekli değişiklikleri ve adımları anlamanıza yardımcı olur.

İstemciniz yetkilendirme için JavaScript için Google API istemci kitaplığını veya daha önceki kitaplıkları kullanıyorsa daha fazla bilgi için Google Kimlik Hizmetleri'ne Geçiş başlıklı makaleyi inceleyin.

Kimlik doğrulama, kullanıcının kim olduğunu belirler ve genellikle kullanıcı kaydı veya oturum açma olarak adlandırılır. Yetkilendirme, verilere veya kaynaklara erişim verme ya da erişimi reddetme işlemidir. Örneğin, uygulamanız kullanıcının Google Drive'ına erişmek için kullanıcıdan izin ister.

Önceki Google ile Oturum Açma platform kitaplığı gibi yeni Google Kimlik Hizmetleri kitaplığı da hem kimlik doğrulama hem de yetkilendirme işlemlerini desteklemek için tasarlanmıştır.

Ancak yeni kitaplık, geliştiricilerin Google Hesaplarını uygulamanızla entegre etme karmaşıklığını azaltmak için iki işlemi birbirinden ayırır.

Kullanım alanınız yalnızca kimlik doğrulamasıyla ilgiliyse bu sayfayı okumaya devam edin.

Kullanım alanınız yetkilendirmeyi içeriyorsa uygulamanızın yeni ve iyileştirilmiş API'leri kullandığından emin olmak için Kullanıcı yetkilendirmesinin işleyiş şekli ve Google Kimlik Hizmetleri'ne geçiş konularını okuyun.

Neler değişti?

Yeni Google Kimlik Hizmetleri kitaplığı, kullanıcılara birçok kullanılabilirlik iyileştirmesi sunar. Öne çıkan özellikler:

Geliştiriciler için odaklandığımız konular karmaşıklığı azaltmak, güvenliği iyileştirmek ve entegrasyon sürecinizi olabildiğince hızlı hale getirmekti. Bu iyileştirmelerden bazıları şunlardır:

Oturum açma işleminin taşınmasına ilişkin örnek

Mevcut Google ile oturum açma düğmesinden geçiş yapıyorsanız ve yalnızca kullanıcıların sitenizde oturum açmasını istiyorsanız en kolay değişiklik, yeni kişiselleştirilmiş düğmeye geçmek olacaktır. Bu işlem, JavaScript kitaplıklarını değiştirerek ve kod tabanınızı yeni bir oturum açma nesnesi kullanacak şekilde güncelleyerek yapılabilir.

Kitaplıklar ve yapılandırma

Eski Google ile Oturum Açma platform kitaplığı: apis.google.com/js/platform.js ve JavaScript için Google API'leri istemci kitaplığı: gapi.client artık kullanıcı kimlik doğrulama ve yetkilendirme için gerekli değildir. Bunlar, tek bir yeni Google Kimlik Hizmetleri JavaScript kitaplığıyla değiştirildi:accounts.google.com/gsi/client.

Oturum açma için kullanılan önceki üç JavaScript modülü (api, client ve platform) apis.google.com'den yüklenir. Önceki kitaplığın sitenize dahil edilebileceği konumları belirlemenize yardımcı olmak için genellikle:

Çoğu durumda, mevcut web uygulaması istemci kimliği kimlik bilgilerinizi kullanmaya devam edebilirsiniz. Taşıma işleminiz kapsamında, OAuth 2.0 Politikalarımızı incelemenizi ve Google API Konsolu'nu kullanarak aşağıdaki istemci ayarlarını doğrulamanızı ve gerekirse güncellemenizi öneririz:

Etkilenen kodu ve testi belirleme

Hata ayıklama çerezi, etkilenen kodun yerini belirlemenize ve desteği sonlandırıldıktan sonraki davranışı test etmenize yardımcı olabilir.

Büyük veya karmaşık uygulamalarda, gapi.auth2 modülünün desteğinin sonlandırılmasından etkilenen tüm kodları bulmak zor olabilir. Yakında desteği sonlandırılacak özelliklerin mevcut kullanımını konsola kaydetmek için G_AUTH2_MIGRATIONçerezinin değerini informational olarak ayarlayın. İsteğe bağlı olarak, oturum depolama alanına da günlük kaydetmek için iki nokta üst üste işareti ve ardından bir anahtar değeri ekleyin. Oturum açtıktan ve kimlik bilgilerini aldıktan sonra, daha sonra analiz edilmeleri için toplanan günlükleri inceleyin veya arka uç bir sisteme gönderin. Örneğin, informational:showauth2use kaynağı ve URL'yi showauth2use adlı bir oturum depolama anahtarına kaydeder.

gapi.auth2 modülü artık yüklenmediğinde uygulama davranışını doğrulamak için G_AUTH2_MIGRATION çerezinin değerini enforced olarak ayarlayın. Bu sayede, desteği sonlandırıldıktan sonraki davranışı yaptırım tarihinden önce test edebilirsiniz.

Olası G_AUTH2_MIGRATION çerez değerleri:

Kullanıcı üzerindeki etkiyi en aza indirmek için bu çerezi üretim ortamlarında kullanmadan önce geliştirme ve test sırasında yerel olarak ayarlamanız önerilir.

HTML ve JavaScript

Yalnızca kimlik doğrulama oturum açma senaryosundaki örnek kodda, mevcut Google ile oturum açma düğmesinin oluşturulması gösterilmektedir. Kimlik doğrulama yanıtının bir JavaScript geri çağırma işlevi veya arka uç sunucunuzun giriş uç noktasına güvenli yönlendirme yoluyla nasıl ele alındığındaki farklılıkları görmek için pop-up veya yönlendirme modu arasından seçim yapın.

Önceki yöntem

Google ile oturum açma düğmesini oluşturun ve doğrudan kullanıcının tarayıcısından oturum açmak için geri çağırma işlevi kullanın.

<html>
  <body>
    <script src="https://apis.google.com/js/platform.js" async defer></script>
    <meta name="google-signin-client_id" content="YOUR_CLIENT_ID">
    <div class="g-signin2" data-onsuccess="handleCredentialResponse"></div>
  </body>
</html>

Yönlendirme modu

Google ile oturum açma düğmesini oluşturun. Bu işlem, kullanıcının tarayıcısından arka uç sunucularınızın oturum açma uç noktasına bir AJAX çağrısıyla sonlandırılır.

<html>
  <body>
    <script src="https://apis.google.com/js/platform.js" async defer></script>
    <meta name="google-signin-client_id" content="YOUR_CLIENT_ID">
    <div class="g-signin2" data-onsuccess="handleCredentialResponse"></div>
    <script>
      function handleCredentialResponse(googleUser) {
        ...
        var xhr = new XMLHttpRequest();
        xhr.open('POST', 'https://yourbackend.example.com/tokensignin');
        xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
        xhr.onload = function() {
          console.log('Signed in as: ' + xhr.responseText);
        };
        xhr.send('idtoken=' + id_token);
      }
    </script>
  </body>
</html>

Oluşturuldu

Yeni görsel özellikler, özelleştirilmiş bir düğme oluşturma yöntemini basitleştirir, gapi.signin2.render() çağrılarını ve sitenizde resim ve görsel öğeleri barındırıp yönetmeniz gerekmesini ortadan kaldırır.

Google ile Oturum Açma

Google oturumu açık

Kullanıcı oturum açma durumu güncelleme düğmesi metni.

Yeni yöntem

Yeni kitaplığı yalnızca kimlik doğrulama oturum açma senaryosuyla kullanmak için pop-up veya yönlendirme modunu seçin ve giriş sayfanızdaki mevcut uygulamanızı değiştirmek için kod örneğini kullanın.

Oturum açmayı doğrudan kullanıcının tarayıcısından işlemek için geri çağırma işlevi kullanın.

<html>
  <body>
    <script src="https://accounts.google.com/gsi/client" async defer></script>
    <div id="g_id_onload"
         data-client_id="YOUR_CLIENT_ID"
         data-callback="handleCredentialResponse">
    </div>
    <div class="g_id_signin" data-type="standard"></div>
  </body>
</html>

Yönlendirme modu

Google, data-login_url özelliğinde belirtildiği şekilde giriş uç noktanızı çağırır. Daha önce POST işlemi ve parametre adından siz sorumluydunuz. Yeni kitaplık, kimlik jetonunu credential parametresinde uç noktanıza gönderir. Son olarak, arka uç sunucunuzda kimlik jetonunu doğrulayın.

<html>
  <body>
    <script src="https://accounts.google.com/gsi/client" async defer></script>
    <div id="g_id_onload"
         data-client_id="YOUR_CLIENT_ID"
         data-ux_mode="redirect"
         data-login_uri="https://www.example.com/your_login_endpoint">
    </div>
    <div class="g_id_signin" data-type="standard"></div>
  </body>
</html>

Oluşturuldu

Google ile oturum açma düğmesinin boyutunu, şeklini ve rengini özelleştirmek için visual-attributes özelliğini kullanın. Oturum açma oranını artırmak için kişiselleştirilmiş düğmeyle birlikte Tek Dokunuş pop-up'ını gösterin.

Google ile oturum açma düğmesi One Tap pop-up'ı

Kullanıcı oturum açma durumu, düğme metnini "Oturum aç"tan "Oturum açıldı" olarak güncellemez. İzin verildikten sonra veya tekrar ziyaretlerde kişiselleştirilmiş düğmede kullanıcının adı, e-posta adresi ve profil resmi gösterilir.

Yalnızca kimlik doğrulamayı içeren bu örnekte, yeni accounts.google.com/gsi/client kitaplığı, g_id_signin sınıfı ve g_id_onload nesnesi, önceki apis.google.com/js/platform.js kitaplığının ve g-signin2 nesnesinin yerini alır.

Örnek kod, yeni kişiselleştirilmiş düğmeyi oluşturmanın yanı sıra yeni Tek Dokunuş pop-up'ını da gösterir. Kişiselleştirilmiş düğmeyi gösterdiğiniz her yerde, kayıt ve oturum açma sırasında kullanıcıların karşılaşabileceği zorlukları en aza indirmek için Tek Dokunuş pop-up'ını da göstermenizi önemle tavsiye ederiz.

Giriş yapma zorluğu arttığı için önerilmez ancak yeni kişiselleştirilmiş düğme, Tek Dokunuş iletişim kutusu aynı anda gösterilmeden tek başına gösterilebilir. Bunu yapmak için data-auto_prompt özelliğini false olarak ayarlayın.

HTML ve JavaScript API'leri

Önceki örnekte, web sitenize oturum açma özelliğini eklemek için yeni HTML API'nin nasıl kullanılacağı gösterilmektedir. Alternatif olarak, işlevsel olarak eşdeğer JavaScript API'yi kullanabilir veya sitenizde HTML ile JavaScript API'lerini birlikte kullanabilirsiniz.

Geri çağırma türü ve renk, boyut, şekil, metin ve tema gibi özellikler gibi düğme özelleştirme seçeneklerini etkileşimli olarak görüntülemek için Kod Oluşturucumuz'a göz atın. Farklı seçenekleri hızlıca karşılaştırmak ve sitenizde kullanmak üzere HTML snippet'leri oluşturmak için kullanılabilir.

One Tap ile herhangi bir sayfadan oturum açma

One Tap, kullanıcıların sitenize kaydolması veya sitenizde oturum açması için kolay bir yöntemdir. Bu özellik, kullanıcıların doğrudan sitenizdeki herhangi bir sayfadan oturum açmasını sağlar ve kullanıcıların özel bir giriş sayfasını ziyaret etmesini gereksiz kılar. Başka bir deyişle, bu özellik kullanıcılara giriş sayfanız dışındaki sayfalardan kaydolma ve oturum açma esnekliği sunarak kaydolma ve oturum açma sorunlarını azaltır.

Herhangi bir sayfadan oturum açmayı etkinleştirmek için g_id_onload etiketini sitenizin tamamında bulunan ortak bir üstbilgi, altbilgi veya başka bir nesneye eklemenizi öneririz.

Ayrıca, kişiselleştirilmiş oturum açma düğmesini gösteren g_id_signin öğesini yalnızca giriş veya kullanıcı hesabı yönetimi sayfalarınıza eklemenizi öneririz. Düğmeyi diğer birleşik kimlik sağlayıcı düğmelerinin, kullanıcı adı ve şifre giriş alanlarının yanında göstererek kullanıcılara kayıt veya oturum açma seçenekleri sunun.

Jeton yanıtı

Kullanıcı oturum açma işlemi için artık OAuth 2.0 yetkilendirme kodlarını, erişim jetonlarını veya yenileme jetonlarını anlamanız ya da bunlarla çalışmanız gerekmez. Bunun yerine, oturum açma durumunu ve kullanıcı profilini paylaşmak için JSON Web Token (JWT) kimlik jetonu kullanılır. Daha da basitleştirmek gerekirse, kullanıcı profili verileriyle çalışmak için artık "geter" stilindeki erişim yöntemlerini kullanmanız gerekmiyor.

Google tarafından imzalanan güvenli bir JWT kimlik jetonu kimlik bilgisi aşağıdaki durumlarda döndürülür:

Her iki durumda da aşağıdakileri kaldırarak mevcut geri çağırma işleyicilerinizi güncelleyin:

Bunun yerine, kullanıcı profili verileriyle çalışmak için yeni JWT CredentialResponse nesnesinde credential alt alanlarına doğrudan referanslar kullanın.

Ayrıca, yalnızca Yönlendirme modunda Siteler Arası İstek Sahteciliği'ni (CSRF) önlemek ve arka uç sunucunuzda Google kimlik jetonunu doğrulamak için gerekli önlemleri alın.

Kullanıcıların sitenizle nasıl etkileşime geçtiğini daha iyi anlamak için CredentialResponse'taki select_by alanı, kullanıcı izni sonucunu ve kullanılan belirli oturum açma akışını belirlemek amacıyla kullanılabilir.

Kullanıcı izni ve izni iptal etme

Kullanıcı web sitenizde ilk kez oturum açtığında Google, kullanıcıdan hesap profilini uygulamanızla paylaşmak için izin ister. Kullanıcının profili yalnızca izin verildikten sonra kimlik jetonu kimlik bilgisi yükü olarak uygulamanızla paylaşılır. Bu profile erişimi iptal etmek, önceki oturum açma kitaplığındaki bir erişim jetonunu iptal etmekle aynıdır.

Kullanıcılar https://myaccount.google.com/permissions adresini ziyaret ederek izinleri iptal edebilir ve uygulamanızın Google Hesaplarıyla bağlantısını kaldırabilir. Alternatif olarak, uyguladığınız bir API çağrısını tetikleyerek doğrudan uygulamanızdan bağlantıyı kesebilirler. Daha önceki disconnect yöntemi, yeni revoke yöntemiyle değiştirilmiştir.

Bir kullanıcı platformunuzdaki hesabını sildiğinde, uygulamanızın Google Hesabı ile bağlantısını kesmek için revoke yöntemini kullanmanız önerilir.

Daha önce auth2.signOut(), uygulamanızda kullanıcıların oturumunu kapatma işlemini yönetmeye yardımcı olmak için kullanılabilirdi. auth2.signOut()'ün tüm kullanımları kaldırılmalı ve uygulamanız, kullanıcı oturum durumunu ve oturum açma durumunu doğrudan yönetmelidir.

Oturum durumu ve dinleyiciler

Yeni kitaplık, web uygulamanız için oturum açma durumunu veya oturum durumunu korumaz.

Bir Google Hesabı'nın oturum açma durumu ile uygulamanızın oturum durumu ve oturum açma durumu farklı ve ayrı kavramlardır.

Kullanıcının Google Hesabı ve uygulamanızdaki oturum açma durumu birbirinden bağımsızdır. Bunun tek istisnası, kullanıcının kimliğini başarıyla doğruladığını ve Google Hesabında oturum açtığını bildiğiniz oturum açma anı olur.

Sitenize Google ile oturum açma, One Tap veya otomatik oturum açma özelliği eklendiğinde kullanıcıların aşağıdaki işlemleri yapabilmek için önce Google Hesaplarında oturum açmaları gerekir:

Kullanıcılar, web sitenizde etkin ve oturum açmış bir oturum sürdürürken oturumlarını kapatabilir veya farklı bir Google Hesabı'na geçebilir.

Artık web uygulamanızın kullanıcılarının oturum durumunu doğrudan yönetmekten sorumlusunuz. Daha önce Google ile oturum açma, kullanıcı oturum durumunu izleme konusunda yardımcı oluyordu.

auth2.attachClickHandler() ve kayıtlı geri çağırma işleyicilerine yapılan tüm referansları kaldırın.

Daha önce, kullanıcının Google Hesabı'ndaki oturum açma durumundaki değişiklikleri paylaşmak için dinleyiciler kullanılıyordu. Dinleyiciler artık desteklenmiyor.

listen(), auth2.currentUser ve auth2.isSignedIn ile ilgili tüm referansları kaldırın.

Çerezler

Google ile oturum açma özelliği, çerezleri sınırlı olarak kullanır. Bu çerezlerin açıklaması aşağıda verilmiştir. Google tarafından kullanılan diğer çerez türleri hakkında daha fazla bilgi için Google'ın çerezleri nasıl kullandığı başlıklı makaleyi inceleyin.

Önceki Google ile Oturum Açma Platformu Kitaplığı tarafından ayarlanan G_ENABLED_IDPS çerezi artık kullanılmıyor.

Yeni Google Identity Services kitaplığı, isteğe bağlı olarak yapılandırma seçeneklerinize göre aşağıdaki alan adları arası çerezleri ayarlayabilir:

Çerezleri yöneten bir hizmetiniz varsa taşıma işlemi tamamlandığında iki yeni çerezi eklediğinizden ve önceki çerezi kaldırdığınızdan emin olun.

Birden fazla alan veya alt alan adı yönetiyorsanız g_state çerezi ile çalışmayla ilgili daha fazla talimat için Alt alan adlarında Tek Dokunuş'u görüntüleme başlıklı makaleyi inceleyin.

Kullanıcı oturum açma işlemi için nesne taşıma referansı

Önceki Yeni Notlar
JavaScript kitaplıkları
apis.google.com/js/platform.js accounts.google.com/gsi/client Eskiyi yeniyle değiştirin.
apis.google.com/js/api.js accounts.google.com/gsi/client Eskiyi yeniyle değiştirin.
GoogleAuth nesnesi ve ilişkili yöntemler:
GoogleAuth.attachClickHandler() IdConfiguration.callback JS ve HTML data-callback için Eskiyi yeniyle değiştirin.
GoogleAuth.currentUser.get() CredentialResponse Bunun yerine CredentialResponse kullanın. Artık gerekli değildir.
GoogleAuth.currentUser.listen() Kaldır'a dokunun. Kullanıcının Google'daki mevcut oturum açma durumu kullanılamaz. Kullanıcıların izin ve oturum açma anları için Google'da oturum açmış olması gerekir. CredentialResponse'taki select_by alanı, kullanılan oturum açma yöntemiyle birlikte kullanıcı izninin sonucunu belirlemek için kullanılabilir.
GoogleAuth.disconnect() google.accounts.id.revoke Eskiyi yeniyle değiştirin. İzinleri https://myaccount.google.com/permissions adresinden de iptal edebilirsiniz.
GoogleAuth.grantOfflineAccess() Kaldır'a dokunun. OAuth 2.0 erişim jetonları ve kapsamları, kimlik jetonuyla değiştirildi.
GoogleAuth.isSignedIn.get() Kaldır'a dokunun. Kullanıcının Google'daki mevcut oturum açma durumu kullanılamaz. Kullanıcıların izin ve oturum açma anları için Google'da oturum açmış olması gerekir.
GoogleAuth.isSignedIn.listen() Kaldır'a dokunun. Kullanıcının Google'daki mevcut oturum açma durumu kullanılamaz. Kullanıcıların izin ve oturum açma anları için Google'da oturum açmış olması gerekir.
GoogleAuth.signIn() Kaldır'a dokunun. g_id_signin öğesinin HTML DOM'de yüklenmesi veya google.accounts.id.renderButton JS çağrısı, kullanıcının Google Hesabı'nda oturum açmasını tetikler.
GoogleAuth.signOut() Kaldır'a dokunun. Uygulamanız ve Google Hesabı için kullanıcı oturum açma durumu birbirinden bağımsızdır. Google, uygulamanızın oturum durumunu yönetmez.
GoogleAuth.then() Kaldır'a dokunun. GoogleAuth desteği sonlandırıldı.
GoogleUser nesnesi ve ilişkili yöntemler:
GoogleUser.disconnect() google.accounts.id.revoke Eskiyi yeniyle değiştirin. İzinleri https://myaccount.google.com/permissions adresinden de iptal edebilirsiniz.
GoogleUser.getAuthResponse()
GoogleUser.getBasicProfile() CredentialResponse BasicProfile yöntemleri yerine doğrudan credential ve alt alanları kullanın.
GoogleUser.getGrantedScopes() Kaldır'a dokunun. OAuth 2.0 erişim jetonları ve kapsamları, kimlik jetonuyla değiştirildi.
GoogleUser.getHostedDomain() CredentialResponse Bunun yerine doğrudan credential.hd kullanın.
GoogleUser.getId() CredentialResponse Bunun yerine doğrudan credential.sub kullanın.
GoogleUser.grantOfflineAccess() Kaldır'a dokunun. OAuth 2.0 erişim jetonları ve kapsamları, kimlik jetonuyla değiştirildi.
GoogleUser.grant() Kaldır'a dokunun. OAuth 2.0 erişim jetonları ve kapsamları, kimlik jetonuyla değiştirildi.
GoogleUser.hasGrantedScopes() Kaldır'a dokunun. OAuth 2.0 erişim jetonları ve kapsamları, kimlik jetonuyla değiştirildi.
GoogleUser.isSignedIn() Kaldır'a dokunun. Kullanıcının Google'daki mevcut oturum açma durumu kullanılamaz. Kullanıcıların izin ve oturum açma anları için Google'da oturum açmış olması gerekir.
GoogleUser.reloadAuthResponse() Kaldır'a dokunun. OAuth 2.0 erişim jetonları ve kapsamları, kimlik jetonuyla değiştirildi.
gapi.auth2 nesnesi ve ilişkili yöntemler:
gapi.auth2.AuthorizeConfig nesnesi Kaldır'a dokunun. OAuth 2.0 erişim jetonları ve kapsamları, kimlik jetonuyla değiştirildi.
gapi.auth2.AuthorizeResponse nesnesi Kaldır'a dokunun. OAuth 2.0 erişim jetonları ve kapsamları, kimlik jetonuyla değiştirildi.
gapi.auth2.AuthResponse nesnesi Kaldır'a dokunun. OAuth 2.0 erişim jetonları ve kapsamları, kimlik jetonuyla değiştirildi.
gapi.auth2.authorize() Kaldır'a dokunun. OAuth 2.0 erişim jetonları ve kapsamları, kimlik jetonuyla değiştirildi.
gapi.auth2.ClientConfig() Kaldır'a dokunun. OAuth 2.0 erişim jetonları ve kapsamları, kimlik jetonuyla değiştirildi.
gapi.auth2.getAuthInstance() Kaldır'a dokunun. OAuth 2.0 erişim jetonları ve kapsamları, kimlik jetonuyla değiştirildi.
gapi.auth2.init() Kaldır'a dokunun. OAuth 2.0 erişim jetonları ve kapsamları, kimlik jetonuyla değiştirildi.
gapi.auth2.OfflineAccessOptions nesnesi Kaldır'a dokunun. OAuth 2.0 erişim jetonları ve kapsamları, kimlik jetonuyla değiştirildi.
gapi.auth2.SignInOptions nesnesi Kaldır'a dokunun. OAuth 2.0 erişim jetonları ve kapsamları, kimlik jetonuyla değiştirildi.
gapi.signin2 nesnesi ve ilişkili yöntemler:
gapi.signin2.render() Kaldır'a dokunun. g_id_signin öğesinin HTML DOM'de yüklenmesi veya google.accounts.id.renderButton JS çağrısı, kullanıcının Google Hesabı'nda oturum açmasını tetikler.