Google is committed to advancing racial equity for Black communities. See how.
Bu sayfa, Cloud Translation API ile çevrilmiştir.
Switch to English

JavaScript'te E-posta Bağlantısını Kullanarak Firebase ile Kimlik Doğrulama

Firebase Authentication'ı, bir kullanıcıya oturum açmak için tıklayabilecekleri bir bağlantı içeren bir e-posta göndererek oturum açmak için kullanabilirsiniz. Bu işlemde kullanıcının e-posta adresi de doğrulanır.

E-posta ile oturum açmanın sayısız avantajı vardır:

  • Düşük sürtünmeli kayıt ve oturum açma.
  • Uygulamalar arasında şifrenin yeniden kullanılması riskinin daha düşük olması, iyi seçilmiş şifrelerin bile güvenliğini tehlikeye atabilir.
  • Bir kullanıcının kimliğini doğrulama yeteneği, aynı zamanda kullanıcının bir e-posta adresinin yasal sahibi olduğunu doğrular.
  • Bir kullanıcının oturum açmak için yalnızca erişilebilir bir e-posta hesabına ihtiyacı vardır. Telefon numarası veya sosyal medya hesabı sahibi olmak gerekmez.
  • Bir kullanıcı, bir mobil cihazda kullanışsız olabilecek bir parola sağlamaya (veya hatırlamaya) gerek kalmadan güvenli bir şekilde oturum açabilir.
  • Daha önce bir e-posta tanımlayıcısıyla (parola veya federe) oturum açan mevcut bir kullanıcı, yalnızca e-posta ile oturum açmak için yükseltilebilir. Örneğin, şifresini unutan bir kullanıcı, şifresini sıfırlamaya gerek kalmadan yine de oturum açabilir.

Sen başlamadan önce

Henüz yapmadıysanız, başlatma snippet'ini Firebase konsolundan projenize Firebase'i JavaScript projenize ekleme bölümünde açıklandığı gibi kopyalayın.

Kullanıcıları e-posta bağlantısıyla oturum açmak için önce Firebase projeniz için E-posta sağlayıcısını ve E-posta bağlantısı oturum açma yöntemini etkinleştirmelisiniz:

  1. In Firebase konsoluna , Auth bölümünü açın.
  2. Oturum açma yöntemi sekmesinde, E-posta / Şifre sağlayıcısını etkinleştirin. E-posta bağlantısı oturum açmayı kullanmak için e-posta / şifre oturum açma özelliğinin etkinleştirilmesi gerektiğini unutmayın.
  3. Aynı bölümde, E-posta bağlantısı (şifresiz oturum açma) oturum açma yöntemini etkinleştirin.
  4. Kaydet'i tıklayın .

Kimlik doğrulama akışını başlatmak için kullanıcıya, kullanıcıdan e-posta adresini vermesini isteyen bir arayüz sendSignInLinkToEmail ve ardından sendSignInLinkToEmail kimlik doğrulama bağlantısını kullanıcının e-postasına göndermesini istemek için arayın.

  1. ActionCodeSettings e-posta bağlantısının nasıl oluşturulacağına ilişkin talimatlar sağlayan ActionCodeSettings nesnesini oluşturun. Aşağıdaki alanları ayarlayın:

    • url : Yerleştirilecek derin bağlantı ve iletilecek ek durum. Bağlantının etki alanı, Oturum açma yöntemi sekmesine (Kimlik Doğrulama -> Oturum açma yöntemi) gidilerek bulunabilen Firebase Konsolu yetkili etki alanları listesine eklenmelidir.
    • android ve ios : Oturum açma bağlantısı bir Android veya iOS cihazda açıldığında kullanılacak uygulamalar. Firebase Dynamic Links'in mobil uygulamalar aracılığıyla e-posta eylem bağlantılarını açacak şekilde nasıl yapılandırılacağı hakkında daha fazla bilgi edinin.
    • handleCodeInApp : True olarak ayarlayın. Diğer bant dışı e-posta işlemlerinden (parola sıfırlama ve e-posta doğrulamaları) farklı olarak oturum açma işlemi her zaman uygulamada tamamlanmalıdır. Bunun nedeni, akışın sonunda kullanıcının oturum açması ve Yetki durumunun uygulama içinde kalmasıdır.
    • dynamicLinkDomain : Bir proje için birden çok özel dinamik bağlantı etki alanı tanımlandığında, bağlantı belirli bir mobil uygulama aracılığıyla açıldığında hangisinin kullanılacağını belirtin (örneğin, example.page.link ). Aksi takdirde ilk alan otomatik olarak seçilir.

      var actionCodeSettings = {
        // URL you want to redirect back to. The domain (www.example.com) for this
        // URL must be in the authorized domains list in the Firebase Console.
        url: 'https://www.example.com/finishSignUp?cartId=1234',
        // This must be true.
        handleCodeInApp: true,
        iOS: {
          bundleId: 'com.example.ios'
        },
        android: {
          packageName: 'com.example.android',
          installApp: true,
          minimumVersion: '12'
        },
        dynamicLinkDomain: 'example.page.link'
      };

    ActionCodeSettings hakkında daha fazla bilgi edinmek için E-posta Eylemlerinde Geçiş Durumu bölümüne bakın.

  2. Kullanıcıdan e-postasını isteyin.

  3. Kimlik doğrulama bağlantısını kullanıcının e-postasına gönderin ve kullanıcının e-posta oturumunu aynı cihazda tamamlaması durumunda kullanıcının e-postasını kaydedin.

    firebase.auth().sendSignInLinkToEmail(email, actionCodeSettings)
      .then(() => {
        // The link was successfully sent. Inform the user.
        // Save the email locally so you don't need to ask the user for it again
        // if they open the link on the same device.
        window.localStorage.setItem('emailForSignIn', email);
        // ...
      })
      .catch((error) => {
        var errorCode = error.code;
        var errorMessage = error.message;
        // ...
      });

Güvenlik endişeleri

Bir oturum açma bağlantısının istenmeyen bir kullanıcı olarak veya istenmeyen bir cihazda oturum açmak için kullanılmasını önlemek için Firebase Auth, oturum açma akışını tamamlarken kullanıcının e-posta adresinin sağlanmasını gerektirir. Oturum açmanın başarılı olması için, bu e-posta adresi, oturum açma bağlantısının orijinal olarak gönderildiği adresle eşleşmelidir.

Oturum açma bağlantısını, bağlantı istedikleri cihazda açan kullanıcılar için, oturum açma e-postasını gönderirken e-posta adreslerini yerel olarak saklayarak (örneğin localStorage veya çerezler kullanarak) bu akışı kolaylaştırabilirsiniz. Ardından, akışı tamamlamak için bu adresi kullanın. Kullanıcının e-postasını yönlendirme URL parametrelerinde iletmeyin ve oturum enjeksiyonlarını etkinleştirebileceği için yeniden kullanmayın.

Oturum açma işlemi tamamlandıktan sonra, önceki doğrulanmamış oturum açma mekanizmaları kullanıcıdan kaldırılacak ve mevcut oturumlar geçersiz kılınacaktır. Örneğin, bir kişi daha önce aynı e-posta ve parolayla doğrulanmamış bir hesap oluşturduysa, sahipliğini talep eden ve bu doğrulanmamış hesabı oluşturan kimliğe bürünenin doğrulanmamış e-posta ve parola ile tekrar oturum açmasını önlemek için kullanıcının parolası kaldırılır.

Bağlantınızın potansiyel olarak aracı sunucular tarafından ele geçirilmesini önlemek için üretimde bir HTTPS URL'si kullandığınızdan emin olun.

Bir web sayfasında oturum açmayı tamamlama

E-posta bağlantısı derin bağlantısının biçimi, bant dışı e-posta eylemleri (e-posta doğrulama, parola sıfırlama ve e-posta değişikliği iptali) için kullanılan biçimle aynıdır. Firebase Auth, bir bağlantının e-posta bağlantısıyla oturum açma olup olmadığını kontrol etmek için isSignInWithEmailLink API'si sağlayarak bu kontrolü basitleştirir.

Giriş sayfasında oturum açma işlemini tamamlamak için, kullanıcının e-postası ve tek seferlik kodu içeren gerçek e-posta bağlantısı ile signInWithEmailLink arayın.

// Confirm the link is a sign-in with email link.
if (firebase.auth().isSignInWithEmailLink(window.location.href)) {
  // Additional state parameters can also be passed via URL.
  // This can be used to continue the user's intended action before triggering
  // the sign-in operation.
  // Get the email if available. This should be available if the user completes
  // the flow on the same device where they started it.
  var email = window.localStorage.getItem('emailForSignIn');
  if (!email) {
    // User opened the link on a different device. To prevent session fixation
    // attacks, ask the user to provide the associated email again. For example:
    email = window.prompt('Please provide your email for confirmation');
  }
  // The client SDK will parse the code from the link for you.
  firebase.auth().signInWithEmailLink(email, window.location.href)
    .then((result) => {
      // Clear email from storage.
      window.localStorage.removeItem('emailForSignIn');
      // You can access the new user via result.user
      // Additional user info profile not available via:
      // result.additionalUserInfo.profile == null
      // You can check if the user is new or existing:
      // result.additionalUserInfo.isNewUser
    })
    .catch((error) => {
      // Some error occurred, you can inspect the code: error.code
      // Common errors could be invalid email and invalid or expired OTPs.
    });
}

Bir mobil uygulamada oturum açma işlemini tamamlama

Firebase Authentication, e-posta bağlantısını bir mobil cihaza göndermek için Firebase Dynamic Links'i kullanır. Mobil uygulama aracılığıyla oturum açmanın tamamlanması için, uygulamanın gelen uygulama bağlantısını algılayacak, temeldeki derin bağlantıyı ayrıştıracak ve ardından web akışı aracılığıyla yapıldığı gibi oturum açmayı tamamlayacak şekilde yapılandırılması gerekir.

Bir Android uygulamasında e-posta bağlantısıyla oturum açma işleminin nasıl yapılacağı hakkında daha fazla bilgi edinmek için Android kılavuzuna bakın.

Bir iOS uygulamasında e-posta bağlantısıyla oturum açma işleminin nasıl yapılacağı hakkında daha fazla bilgi edinmek için iOS kılavuzuna bakın.

Bu kimlik doğrulama yöntemini mevcut bir kullanıcıya da bağlayabilirsiniz. Örneğin, daha önce telefon numarası gibi başka bir sağlayıcıyla kimliği doğrulanmış bir kullanıcı, bu oturum açma yöntemini mevcut hesabına ekleyebilir.

Aradaki fark operasyonun ikinci yarısında olacaktır:

// Construct the email link credential from the current URL.
var credential = firebase.auth.EmailAuthProvider.credentialWithLink(
  email, window.location.href);

// Link the credential to the current user.
firebase.auth().currentUser.linkWithCredential(credential)
  .then((usercred) => {
    // The provider is now successfully linked.
    // The phone user can now sign in with their phone number or email.
  })
  .catch((error) => {
    // Some error occurred.
  });

Bu, hassas bir işlemi çalıştırmadan önce bir e-posta bağlantısı kullanıcısının kimliğini yeniden doğrulamak için de kullanılabilir.

// Construct the email link credential from the current URL.
var credential = firebase.auth.EmailAuthProvider.credentialWithLink(
  email, window.location.href);

// Re-authenticate the user with this credential.
firebase.auth().currentUser.reauthenticateWithCredential(credential)
  .then((usercred) => {
    // The user is now successfully re-authenticated and can execute sensitive
    // operations.
  })
  .catch((error) => {
    // Some error occurred.
  });

Ancak akış, orijinal kullanıcının oturum açmadığı farklı bir cihazda sona erebileceğinden, bu akış tamamlanamayabilir. Bu durumda, kullanıcıya bağlantıyı aynı cihazda açmaya zorlamak için bir hata gösterilebilir. İşlem türü ve kullanıcı kimliği hakkında bilgi sağlamak için bağlantıda bazı durumlar geçirilebilir.

E-posta ile hem şifre hem de bağlantı tabanlı oturum açmayı destekliyorsanız, bir şifre / bağlantı kullanıcısı için oturum açma yöntemini farklılaştırmak için fetchSignInMethodsForEmail kullanın. Bu, kullanıcıdan önce e-postasını vermesinin istendiği ve ardından oturum açma yönteminin sunulduğu önce tanımlayıcı akışları için kullanışlıdır:

// After asking the user for their email.
var email = window.prompt('Please provide your email');
firebase.auth().fetchSignInMethodsForEmail(email)
  .then((signInMethods) => {
    // This returns the same array as fetchProvidersForEmail but for email
    // provider identified by 'password' string, signInMethods would contain 2
    // different strings:
    // 'emailLink' if the user previously signed in with an email/link
    // 'password' if the user has a password.
    // A user could have both.
    if (signInMethods.indexOf(
            firebase.auth.EmailAuthProvider.EMAIL_PASSWORD_SIGN_IN_METHOD) != -1) {
      // User can sign in with email/password.
    }
    if (signInMethods.indexOf(
            firebase.auth.EmailAuthProvider.EMAIL_LINK_SIGN_IN_METHOD) != -1) {
      // User can sign in with email/link.
    }
  })
  .catch((error) => {
    // Some error occurred, you can inspect the code: error.code
  });

Yukarıda açıklandığı gibi e-posta / şifre ve e-posta / bağlantı, farklı oturum açma yöntemleriyle aynı firebase.auth.EmailAuthProvider (aynı PROVIDER_ID ) olarak kabul edilir.

Sonraki adımlar

Bir kullanıcı ilk kez oturum açtıktan sonra, yeni bir kullanıcı hesabı oluşturulur ve oturum açan kullanıcı kimlik bilgilerine (yani kullanıcı adı ve parolası, telefon numarası veya kimlik doğrulama sağlayıcı bilgileri) bağlanır. Bu yeni hesap, Firebase projenizin bir parçası olarak depolanır ve kullanıcının nasıl oturum açtığına bakılmaksızın projenizdeki her uygulamada bir kullanıcıyı tanımlamak için kullanılabilir.

  • Uygulamalarınızda, kullanıcınızın kimlik doğrulama durumunu öğrenmenin önerilen yolu, Auth nesnesine bir gözlemci ayarlamaktır. Daha sonra kullanıcının temel profil bilgilerini User nesnesinden alabilirsiniz. Kullanıcıları Yönetme konusuna bakın.

  • Firebase Realtime Database ve Cloud Storage Güvenlik Kurallarınızda , oturum auth kullanıcının benzersiz kullanıcı kimliğini auth değişkeninden alabilir ve bir kullanıcının hangi verilere erişebileceğini kontrol etmek için kullanabilirsiniz.

Yetkilendirme sağlayıcı kimlik bilgilerini mevcut bir kullanıcı hesabına bağlayarak , kullanıcıların birden çok kimlik doğrulama sağlayıcısı kullanarak uygulamanızda oturum açmasına izin verebilirsiniz .

Bir kullanıcının oturumunu kapatmak için signOut arayın:

firebase.auth().signOut().then(() => {
  // Sign-out successful.
}).catch((error) => {
  // An error happened.
});