如何使用 firebase 嵌入 Google 登录按钮以在网络上进行身份验证

Question

我计划使用 google firebase 来处理我的网站身份验证，但我找不到任何有关如何在我的页面上嵌入 google 登录按钮的文档。我不打算嵌入默认的platform.js脚本，因为它不用于处理身份验证。

所有功能均由 firebase 处理。另外，我计划使用自定义 UI，而不是 Web 版 Firebase UI。

按钮文本还应该可针对不同的注册和登录按钮模式进行自定义。

Answer 1

您是否在 Firebase 中使用 Angularfire，如果您不使用它也没关系，请尝试通过此链接firebase Google Sign In Method。

Firebase Google Sign in 的工作原理如下：如果用户在 Firebase 身份验证中不存在，它会创建一个新用户；如果用户存在，则不会创建用户。因此您无需担心登录和注册的问题。只需提供 Google 登录即可。例如，考虑这种情况。如果我是 Google 登录的新用户，它会要求我登录 Gmail 帐户，一旦我登录，它就不会要求我再次登录，除非我注销，如果我下次注销时按 Google Sign In，它会自动登录。

如果您正在寻找带有“登录”按钮的代码，请按如下所示进行编码，

<input type="button" onclick=callGoogleSignIn() value="Google Sign In"/>
<script>
      function callGoogleSignIn(){
          var provider = new firebase.auth.GoogleAuthProvider();
          firebase.auth().signInWithPopup(provider).then(function(result) {
               // This gives you a Google Access Token. You can use it to access the Google API.
                var token = result.credential.accessToken;
               // The signed-in user info.
               var user = result.user;
               // ...
         }).catch(function(error) {
             // Handle Errors here.
               var errorCode = error.code;
               var errorMessage = error.message;
               // The email of the user's account used.
               var email = error.email;
               // The firebase.auth.AuthCredential type that was used.
               var credential = error.credential;
            // ...
         });
      }
</script>

如果您有任何疑问，请随时询问并通过此网站进行 Firebase Google 登录。这个网站用firebase开发了google登录，看看他们是怎么用的。希望这可以帮助。