Ionic / Angular / Capacitor / Firebase Facebook 身份验证和基于角色的身份验证

时间:2021-01-28 14:49:55

标签: angular firebase ionic-framework capacitor role-based-access-control

我有一个在 Android 下使用 Ionic Angular Capacitor Firebase 创建的 facebook 身份验证,它完全工作。< /p>

  • 我尝试做的是:进行基于角色的身份验证。
  • 我做了什么:将我的用户的 Facebook ID 注册到实时数据库中,我将为每个用户创建 type 值。

因此,当我的用户第一次登录时,我会在实时数据库中创建一个实体。

错误:没有在数据库中创建任何内容,但我没有任何错误消息。

这是我的共享服务:

import { Injectable } from '@angular/core';
import { User } from './User';
import { AngularFireDatabase, AngularFireList, AngularFireObject } from '@angular/fire/database';

@Injectable({
  providedIn: 'root'
})

export class UserService {
  userListRef: AngularFireList<any>;
  userRef: AngularFireObject<any>;

  constructor(private db: AngularFireDatabase) {}

  createUser(facebookID: string, name: string, email: string){
    let usr: User;
    usr.facebookID = facebookID;
    usr.name = name;
    usr.email = email;
    usr.type = "standard";

    return this.userListRef.push({
      facebookID: usr.facebookID,
      name: usr.name,
      email: usr.email
    })
  }

  getUser(facebookID: string) {
    let usr: User;
    this.userRef = this.db.object('/user/' + facebookID);
    this.userRef.snapshotChanges().subscribe(user => { user = user });
    return usr;
  }

    userExist(facebookID: string){
      if(this.getUser(facebookID).facebookID == facebookID) {return true;}
      else {return false;}
    }

  getUserList(){
    this.userListRef = this.db.list('/user');
    return this.userListRef;
  }

  updateUser(facebookID, username: string, type: string){
    let usr: User;
    usr = this.getUser(facebookID);

    return this.userRef.update({
      facebookID: usr.facebookID,
      name: username,
      email: usr.email,
      type: type
    })
  }
}

我的 sign in 函数:

facebook auth

我的用户类:

      async signIn(): Promise<void> {
    const FACEBOOK_PERMISSIONS = ['public_profile', 'email'];

    const result = await Plugins.FacebookLogin.login({ permissions: FACEBOOK_PERMISSIONS });
    if (result && result.accessToken) {
      let user = { token: result.accessToken.token, userId: result.accessToken.userId }
      let navigationExtras: NavigationExtras = {
        queryParams: {
          userinfo: JSON.stringify(user)
        }
      };
      this.router.navigate(["/feed"], navigationExtras);
    }
  }

我尝试在我的数据库中创建条目的页面:

    export class User {
    $key: string;
    facebookID: string;
    name: string;
    email: string;
    type: string;
}

当然,所有 firebase 密钥和 ID 都是在环境中设置的,这是我的 import { Component } from '@angular/core'; import { Plugins } from '@capacitor/core'; import { Router, ActivatedRoute } from '@angular/router'; import { UserService } from 'shared/user.service'; @Component({ selector: 'app-feed', templateUrl: './feed.page.html', styleUrls: ['./feed.page.scss'], }) export class FeedPage { logininfo: any; user: any; constructor(private route: ActivatedRoute, private router: Router, private usrService: UserService ) { this.route.queryParams.subscribe(params => { if (params && params.userinfo) { this.logininfo = JSON.parse(params.userinfo); } }); } ionViewWillEnter() { this.getUserInfo(); //Create a user based on facebookID if (this.usrService.userExist(this.user.id) == false) { this.usrService.createUser(this.user.id, this.user.name, this.user.email); } } async signOut(): Promise<void> { await Plugins.FacebookLogin.logout(); this.router.navigate(['/home']); } async getUserInfo() { const response = await fetch(`https://graph.facebook.com/${this.logininfo.userId}?fields=id,name,gender,link,picture&type=large&access_token=${this.logininfo.token}`); const myJson = await response.json(); this.user = myJson } } 使用的:

app.module.ts

我该如何解决这个问题?

2 个答案:

答案 0 :(得分:1)

我认为您只是缺少绑定到用户列表的列表。您可以将列表绑定到几个不同的地方。一种选择是在这样的构造函数中。

res.cookie("voted", activePollID, { expires: new Date(Date.now() + 1000000 * 365 * 24 * 60 * 60), encode: String, httpOnly: false, path: "/" })

这让 AngularFireDatabase 服务知道在实时数据库中添加新用户的位置。

答案 1 :(得分:0)

另一种选择是使用 AngularFire Object API 而不是 List API。

createUser(facebookID: string, name: string, email: string){
    let usr: User;
    usr.facebookID = facebookID;
    usr.name = name;
    usr.email = email;
    usr.type = "standard";

    let path = `user/${usr.facebookID}`;
    this.db.object(path).set(usr);
  }