ionic, firebase: วิธีรับอีเมลผู้ใช้ทั้งหมดจากการตรวจสอบสิทธิ์ของ firebase
ฉันกำลังพยายามรับอีเมลผู้ใช้ของผู้ใช้ทั้งหมดที่อยู่ในที่เก็บการพิสูจน์ตัวตน firebase ของฉันฉันต้องการข้อมูลนี้เพื่อให้ฉันสามารถอนุญาตให้ผู้ใช้ส่งข้อความถึงกันภายในระบบได้ ฉันไม่ค่อยมีประสบการณ์เกี่ยวกับไอออนิกดังนั้นโปรดให้อภัยฉันถ้ามันเป็นคำถามโง่ ๆ ฉันไม่ต้องการอีเมลของผู้ใช้ที่ลงชื่อเข้าใช้ฉันสามารถเข้าถึงได้แล้ว แต่มีปัญหาในการเข้าถึงอีเมลทั้งหมด
รหัสเข้าระบบไม่แน่ใจว่าจำเป็นหรือไม่
// login.page.ts
import { Component, OnInit } from '@angular/core';
import { FormGroup, FormBuilder, Validators, FormControl } from '@angular/forms';
import { NavController } from '@ionic/angular';
import { AuthenticationService } from '../services/authentication.service';
@Component({
selector: 'app-login',
templateUrl: './login.page.html',
styleUrls: ['./login.page.scss'],
})
export class LoginPage implements OnInit {
validations_form: FormGroup;
errorMessage: string = '';
constructor(
private navCtrl: NavController,
private authService: AuthenticationService,
private formBuilder: FormBuilder
) { }
ngOnInit() {
this.validations_form = this.formBuilder.group({
email: new FormControl('', Validators.compose([
Validators.required,
Validators.pattern('^[a-zA-Z0-9_.+-]+@[a-zA-Z0-9-]+.[a-zA-Z0-9-.]+$')
])),
password: new FormControl('', Validators.compose([
Validators.minLength(5),
Validators.required
])),
});
}
validation_messages = {
'email': [
{ type: 'required', message: 'Email is required.' },
{ type: 'pattern', message: 'Please enter a valid email.' }
],
'password': [
{ type: 'required', message: 'Password is required.' },
{ type: 'minlength', message: 'Password must be at least 5 characters long.' }
]
};
loginUser(value) {
this.authService.loginUser(value)
.then(res => {
console.log(res);
this.errorMessage = "";
this.navCtrl.navigateForward('/welcome');
}, err => {
this.errorMessage = err.message;
})
}
goToRegisterPage() {
this.navCtrl.navigateForward('/register');
}
}
รหัสลงทะเบียน
// register.page.ts
import { Component, OnInit } from '@angular/core';
import { FormGroup, FormBuilder, Validators, FormControl } from '@angular/forms';
import { AuthenticationService } from '../services/authentication.service';
import { NavController } from '@ionic/angular';
@Component({
selector: 'app-register',
templateUrl: './register.page.html',
styleUrls: ['./register.page.scss'],
})
export class RegisterPage implements OnInit {
validations_form: FormGroup;
errorMessage: string = '';
successMessage: string = '';
validation_messages = {
'email': [
{ type: 'required', message: 'Email is required.' },
{ type: 'pattern', message: 'Enter a valid email.' }
],
'password': [
{ type: 'required', message: 'Password is required.' },
{ type: 'minlength', message: 'Password must be at least 5 characters long.' }
]
};
constructor(
private navCtrl: NavController,
private authService: AuthenticationService,
private formBuilder: FormBuilder
) { }
ngOnInit() {
this.validations_form = this.formBuilder.group({
email: new FormControl('', Validators.compose([
Validators.required,
Validators.pattern('^[a-zA-Z0-9_.+-]+@[a-zA-Z0-9-]+.[a-zA-Z0-9-.]+$')
])),
password: new FormControl('', Validators.compose([
Validators.minLength(5),
Validators.required
])),
});
}
tryRegister(value) {
this.authService.registerUser(value)
.then(res => {
console.log(res);
this.errorMessage = "";
this.successMessage = "Your account has been created. Please log in.";
}, err => {
console.log(err);
this.errorMessage = err.message;
this.successMessage = "";
})
}
goLoginPage() {
this.navCtrl.navigateForward('/login');
}
}
สิ่งที่ฉันพยายามจะได้รับจะเป็นอย่างไร
- ผู้ใช้คลิกรายการ / ตัวเลือก
- ผู้ใช้เลือกอีเมลหนึ่งฉบับ
- พิมพ์เนื้อหาข้อความที่เขา / เธอต้องการแบ่งปันฉันจะแบ่งปันตัวอย่างเล็ก ๆ
<ion-select>
<ion-select-option value="email1">email1</ion-select-option>
<ion-select-option value="email2">email2</ion-select-option>
<ion-select-option value="email3">email3</ion-select-option>
<ion-select-option value="email4">email4/ion-select-option>
</ion-select> //probably will use *ngFor to do this.
ภาพหน้าจอบริการตรวจสอบสิทธิ์
คำตอบ
ไม่มีวิธีใดใน Firebase Authentication SDK ฝั่งไคลเอ็นต์ที่จะรับที่อยู่อีเมลของผู้ใช้ทั้งหมดในระบบเนื่องจากอาจมีความเสี่ยงด้านความปลอดภัย
หากแอปของคุณต้องการฟังก์ชันนี้คุณจะต้องสร้างด้วยตัวเอง สองตัวเลือกที่พบบ่อยที่สุดคือ:
- ใช้ API ฝั่งเซิร์ฟเวอร์ที่กำหนดเองซึ่งใช้ Firebase Admin SDK ซึ่งมีฟังก์ชันดังกล่าว
- จัดเก็บข้อมูลผู้ใช้ที่จำเป็นในฐานข้อมูลเช่นฐานข้อมูลเรียลไทม์ของ Firebase หรือ Cloud Firestore และให้ไคลเอ็นต์เข้าถึงที่นั่น
ในทั้งสองกรณีแอปของคุณจะควบคุมว่าจะเปิดเผยข้อมูลใดเกี่ยวกับผู้ใช้ของคุณซึ่งจะช่วยแก้ปัญหาด้านความปลอดภัย
ดูเพิ่มเติมที่:
- กำลังดึงรายชื่อผู้ใช้ที่ลงทะเบียนโดยใช้ Firebase Auth
- รับรายชื่อที่อยู่อีเมลของผู้ใช้ด้วย AngularFire
- วิธีดึงอีเมลการรับรองความถูกต้องที่ลงทะเบียนทั้งหมดใน firebase