Kurulum

Web sitenize Google ile oturum açma, Tek Dokunuş veya Otomatik oturum açma özelliğini eklemeden önce OAuth yapılandırmanızı ayarlayın ve isteğe bağlı olarak sitenizin İçerik Güvenliği Politikası'nı yapılandırın.

Google API istemci kimliğinizi alın

Web sitenizde Google ile Oturum Açma özelliğini etkinleştirmek için öncelikle Google API istemci kimliği. Bunun için aşağıdaki adımları uygulayın:

  1. Google Etiket Yöneticisi'nin Credentials (Kimlik Bilgileri) sayfasını Google API'leri konsolu.
  2. Bir Google API'leri projesi oluşturun veya seçin. Google ile oturum açma düğmesi veya Google One Tap için zaten bir projeniz varsa mevcut projeyi ve web istemci kimliğini kullanın. Üretim uygulamaları oluştururken birden fazla proje gerekebilir. Yönediğiniz her proje için bu bölümün kalan adımlarını tekrarlayın.
  3. Yeni bir istemci kimliği oluşturmak için Kimlik bilgileri oluştur > OAuth istemci kimliği'ni tıklayın ve Uygulama türü için Web uygulaması'nı seçin. Mevcut bir istemci kimliğini kullanmak için Web uygulaması türünden birini seçin.

  4. Web sitenizin URI'sını Yetkili JavaScript kaynaklarına ekleyin. URI yalnızca şemayı ve tam nitelikli ana makine adını içerir. Örneğin, https://www.example.com

  5. İsteğe bağlı olarak kimlik bilgileri, kullandığınız uç noktaya yönlendirme yapılarak bir ana makineye ait olduğunu varsayalım. Bu durumda, yönlendirme URI'lerinizi Yetkili yönlendirme URI'lerine yönlendirin. Yönlendirme URI'leri şunları içerir: şemayı, tam ana makine adını ve yolu belirlemeli ve Yönlendirme URI'si doğrulama kuralları. Örneğin, https://www.example.com/auth-receiver.

Hem Google ile oturum açma hem de Tek Dokunuş kimlik doğrulama, kullanıcılara verilerine erişim isteyen uygulamayı, hangi tür verilerin istendiğini ve geçerli şartları bildiren bir izin ekranı içerir.

  1. Google Developer Console'un API'ler ve Hizmetler bölümündeki OAuth izin ekranı sayfasını açın.
  2. İstenirse yeni oluşturduğunuz projeyi seçin.

  3. "OAuth izin ekranı" sayfasında formu doldurun ve "Kaydet" düğmesini tıklayın.

    1. Uygulama adı: İzin isteyen uygulamanın adı. Ad, uygulamanızı doğru yansıtmalı ve kullanıcıların başka yerlerde gördüğü uygulama adıyla tutarlı olmalıdır.

    2. Uygulama logosu: Bu resim, kullanıcıların uygulamanızı tanımasına yardımcı olmak için izin ekranında gösterilir. Logo, Google ile oturum açma izin ekranında ve hesap ayarlarında gösterilir ancak Tek Dokunuş iletişim kutusunda gösterilmez.

    3. Destek e-posta adresi: Kullanıcı desteği için izin ekranında ve G'ye gösterilir Suite yöneticileri, kullanıcıları için uygulamanıza erişimi değerlendiriyor. Bu e-posta adresi, Google ile Oturum Açma izni olan kullanıcılara gösterilir kullanıcı uygulama adını tıkladığında

    4. Google API'leri için kapsamlar: Kapsamlar, uygulamanızın kullanıcınızın gizli verilerine erişmesine olanak tanır. Kimlik doğrulama için varsayılan kapsam (email, profile, openid) yeterlidir, herhangi bir hassas kapsamları belirleyin. Genellikle en iyi uygulama, kapsam istemektir. adım adım ilerleyerek ilerletilmelidir. Daha fazla bilgi

    5. Yetkili alanlar: Sizi ve kullanıcılarınızı korumak için yalnızca Google OAuth kullanarak kimlik doğrulaması yapan uygulamaların, Yetkilendirilmiş kullanımlarını kullanmasına izin verir Alanlar. Uygulamalarınızın bağlantıları, Yetkili Alanlar'da barındırılmalıdır. Daha fazla bilgi edinin.

    6. Uygulama ana sayfası bağlantısı: Google ile oturum açma kullanıcı rızası ekranında ve "Böyle devam et" düğmesinin altındaki tek dokunuşla GDPR uyumlu sorumluluk reddi beyanında gösterilir. Yetkilendirilen bir alanda barındırılmalıdır.

    7. Uygulama Gizlilik Politikası bağlantısı: Google ile Oturum Açma'da gösterilir. kullanıcı rızası ekranı ve One- Tap GDPR'ye uygun sorumluluk reddi beyanı bilgilerini aşağıda bulabilirsiniz "Şu kullanıcı adıyla devam et:" düğmesini tıklayın. Yetkilendirilen bir alanda barındırılmalıdır.

    8. Uygulama Hizmet Şartları bağlantısı (İsteğe bağlı): Şununla oturum açarken gösterilir: Google izin ekranı ve One- Tap GDPR'ye uygun sorumluluk reddi beyanıyla ilgili bilgiler altında "Kullanıcı adı olarak devam et"in düğmesini tıklayın. Yetkilendirilen bir alanda barındırılmalıdır.

  4. "Doğrulama Durumu"nu kontrol edin. Başvurunuzun doğrulanması gerekiyorsa başvurunuzu doğrulamaya göndermek için "Doğrulama İçin Gönder" düğmesini tıklayın. Referans OAuth doğrulama koşulları inceleyebilirsiniz.

Oturum açma sırasında OAuth ayarlarını gösterme

FedCM kullanarak One Tap

FedCM kullanan Chrome One Tap tarafından gösterilen OAuth izin ayarları

Chrome'da kullanıcı izni sırasında üst düzey Yetkili alan gösterilir.

FedCM olmadan One Tap

One Tap tarafından gösterilen OAuth kullanıcı rızası ayarları

Uygulama adı, kullanıcı rızası sırasında gösterilir.

Şekil 1. Chrome'da Tek Dokunuş tarafından görüntülenen OAuth izin ayarları.

İçerik Güvenliği Politikası

İsteğe bağlı olsa da uygulamanızın güvenliğini sağlamak ve siteler arası komut dosyası çalıştırma (XSS) saldırılarını önlemek için bir İçerik Güvenliği Politikası kullanmanız önerilir. Daha fazla bilgi edinmek için CSP'ye Giriş ile CSP ve XSS.

İçerik Güvenliği Politikanız şunun gibi bir veya daha fazla yönerge içerebilir: connect-src, frame-src, script-src, style-src veya default-src.

İGP'niz şunları içeriyorsa:

  • connect-src yönergesine https://accounts.google.com/gsi/ ekleyin. Böylece sayfa, Google Identity Services sunucu tarafı uç noktalarının üst URL'sini yükleyebilir.
  • frame-src yönergesine https://accounts.google.com/gsi/ ekleyin.
  • script-src yönergesi, https://accounts.google.com/gsi/client öğesini şuraya ekleyin: Google Kimlik Hizmetleri JavaScript kitaplığının URL'sine izin verin.
  • style-src yönergesine https://accounts.google.com/gsi/style ekleyin.
  • default-src yönergesi (kullanılırsa) önceki yönergelerden (connect-src, frame-src, script-src veya style-src) herhangi biri belirtilmezse yedek olarak kullanılır. Bir sayfanın Google Identity Services sunucu tarafı uç noktalarının üst URL'sini yüklemesine izin vermek için https://accounts.google.com/gsi/ ekleyin.

connect-src kullanırken ayrı Coğrafi Bilgi Sistemi URL'leri listelemekten kaçının. Bu sayede, ekip hatalarla karşılaşırsınız. Örneğin, https://accounts.google.com/gsi/status, Coğrafi Bilgi Sistemi üst URL'sini kullanır https://accounts.google.com/gsi/.

Bu örnek yanıt başlığı, Google Kimlik Hizmetleri'nin yüklenmesini ve yürütmesini sağlar (başarıyla):

Content-Security-Policy-Report-Only: script-src
https://accounts.google.com/gsi/client; frame-src
https://accounts.google.com/gsi/; connect-src https://accounts.google.com/gsi/;

Çapraz Kaynak Açıcı Politikası

Google ile Oturum Aç düğmesi ve Google One Tap, Cross-Origin-Opener-Policy (COOP) siparişte başarılı bir şekilde pop-up oluşturuyor.

FedCM etkinleştirildiğinde tarayıcı pop-up'ları doğrudan oluşturur ve herhangi bir değişiklik yapılması gerekmez.

Ancak, FedCM devre dışı bırakıldığında COOP başlığını ayarlayın:

  • same-origin ve
  • same-origin-allow-popups dahildir.

Doğru başlığın ayarlanmaması pencereler arasındaki iletişimi bozar, boş bir pop-up pencereye emin olun.