📜  Firebase-Facebook身份验证

📅  最后修改于: 2020-10-25 11:25:53             🧑  作者: Mango


在本章中,我们将使用Firebase Facebook身份验证对用户进行身份验证。

第1步-启用Facebook身份验证

我们需要打开Firebase仪表板,然后单击侧面菜单中的“身份验证” 。接下来,我们需要在标签栏中选择“登录方式” 。我们将启用Facebook身份验证并将其保持打开状态,因为完成第2步时需要添加App IDApp Secret

第2步-创建Facebook应用

要启用Facebook身份验证,我们需要创建Facebook应用。单击此链接开始。创建应用程序后,我们需要将App IDApp Secret复制到Firebase页面,该页面在步骤1中保持打开状态。我们还需要将OAuth Redirect URI从此窗口复制到Facebook应用程序中。您可以在Facebook应用信息中心的侧面菜单中找到+添加产品

选择“ Facebook登录” ,它将显示在侧面菜单中。您将在输入字段“有效OAuth重定向URI”中找到需要从Firebase复制OAuth重定向URI的位置

第3步-连接到Facebook SDK

将以下代码复制到index.htmlbody标记的开头。确保从Facebook信息中心将“ APP_ID”替换为您的应用ID。

让我们考虑以下示例。


第4步-创建按钮

我们在前三个步骤中设置了所有内容,现在我们可以创建两个用于登录和注销的按钮。

index.html



第5步-创建身份验证功能

这是最后一步。打开index.js并复制以下代码。

index.js

var provider = new firebase.auth.FacebookAuthProvider();

function facebookSignin() {
   firebase.auth().signInWithPopup(provider)
   
   .then(function(result) {
      var token = result.credential.accessToken;
      var user = result.user;
        
      console.log(token)
      console.log(user)
   }).catch(function(error) {
      console.log(error.code);
      console.log(error.message);
   });
}

function facebookSignout() {
   firebase.auth().signOut()
   
   .then(function() {
      console.log('Signout successful!')
   }, function(error) {
      console.log('Signout failed')
   });
}