Angular Firestore身份验证（在凭据中接收空值）

Question

我正在尝试在Angular上添加身份验证（使用云firestore作为数据库）。我改变了数据库的规则

service cloud.firestore {
match /databases/{database}/documents {
match /{document=**} {
allow read, write: if request.auth != null;
}
}
}

现在当我登录时，我在控制台中收到这个作为输出

https://ibb.co/DKzDqhd

我在我的凭证中收到空值，然后我转到我的组件，我从数据库中读取数据并显示它们我收到错误

core.js：12501错误FirebaseError：权限丢失或不足。在新的FirestoreError（http://localhost:4200/vendor.js:89506:28）

.component.ts

import { ActivatedRoute } from '@angular/router';
import { Subscription } from 'rxjs';
import { Component, OnInit} from '@angular/core';
import { ProductsService } from '../services/products.service';
import { ItemsService } from '../services/items.service';

@Component({
selector: 'app-home',
templateUrl: './home.component.html',
styleUrls: ['./home.component.scss']
})

export class HomeComponent implements OnInit {
products;
categories;
query;
filteredproducts;
subscription: Subscription;

constructor(private prservice: ProductsService, private iservice: 
ItemsService, private activatedrouter: ActivatedRoute) { }

ngOnInit() {
   this.subscription = this.iservice.getdata().subscribe(data => {
   this.products = data;
   this.activatedrouter.queryParams.subscribe(p => {
   this.query = p['category'];
   this.filteredproducts = this.categories?this.products.filter(p => 
   p.select === this.query):this.products;
  });
 });
 this.subscription = this.iservice.getitems().subscribe(categ => {
 this.categories = categ;
 });
 }

 OnDestroy() {
    this.subscription.unsubscribe();
 }
 }

注册组件

import { AuthService } from './../auth.service';
import { NgForm } from '@angular/forms';
import { Component, OnInit, ViewChild } from '@angular/core';
@Component({
selector: 'app-signup',
templateUrl: './signup.component.html',
styleUrls: ['./signup.component.scss']
})

export class SignupComponent implements OnInit {
@ViewChild('f') form:NgForm
constructor(private authservice:AuthService) { }

ngOnInit() {

}



onsubmit(f){
const email=f.email
const pass=f.password
this.authservice.signupuser(email,pass)


}

}

登录组件

import { AuthService } from './../auth.service';
import { Component, OnInit } from '@angular/core';

@Component({
selector: 'app-signin',
templateUrl: './signin.component.html',
styleUrls: ['./signin.component.scss']
 })


export class SigninComponent implements OnInit {
constructor(private authservice:AuthService){}
ngOnInit() {
}
onsubmit(f){
const email=f.email
const pass=f.password
this.authservice.signinuser(email,pass)
} 
}

身份验证服务

import { Injectable } from '@angular/core';
import * as firebase from 'firebase';
@Injectable({
providedIn: 'root'
})

export class AuthService {
constructor() {  }

signupuser(email:string,pass:string){
firebase.auth().createUserWithEmailAndPassword(email,pass).catch(
  err=>console.log(err)
)

}
signinuser(email:string,pass:string){
firebase.auth().signInWithEmailAndPassword(email,pass).then(
  response=>console.log(response)
)
.catch(
  err=>console.log(err)
)
}
}

但是如果改变我的数据库规则

service cloud.firestore {
match /databases/{database}/documents {
match /{document=**} {
allow read, write;
}
}
}

我成功地从数据库中读取数据

Answer 1

您似乎无法正确访问，因为credential返回的auth.service值为null。检查一下，问题可能就在那里。