firehouse
v0.0.20
Published
## Documents
Downloads
7
Readme
Firehouse
Documents
- Sample/Exmaple Project. See this project for example.
Requirements
firebase
and@angular/fire
must be installed on the project.chance
is optional for testing.AngularFire
must be initialized on app module like below
@NgModule({
imports: [
...
AngularFireModule.initializeApp( /* ... firebase config ... */ ),
AngularFirestoreModule,
AngularFireAuthModule
...
],
...
})
export class AppModule {}
Sample code
How to get user data
- You need to get data when the user auth changed.
this.firehouse.auth.onAuthStateChanged(async () => {
if (this.firehouse.isLoggedIn) {
const re = await this.firehouse.userGet(this.firehouse.currentUser.uid).then(user => {
this.form = user;
this.a.render();
}).catch(e => e);
if (this.firehouse.isError(re)) {
this.a.error(re);
}
}
});
User registration
- When you put user registration form and profile update form in one componet(tempalte),
- use the following code.
load = false;
subscriber;
form = {};
constructor(
public a: AppService,
public firehouse: FirehouseService
) {
this.subscriber = this.firehouse.auth.onAuthStateChanged(async user => {
if (this.load) {
return;
}
this.load = true;
if (user) {
const re = await this.firehouse.userGet(this.firehouse.currentUser.uid).catch(e => e);
if (this.firehouse.isError(re)) {
this.a.error(re);
return;
}
this.form = re;
this.a.render();
}
});
}
ngOnDestroy() {
if (this.subscriber) {
this.subscriber(); // unsubscribe
this.subscriber = null;
}
}
async onSubmit() {
if (this.firehouse.isLoggedIn) {
const re = await this.firehouse.userUpdate(this.form).catch(e => e);
if (this.firehouse.isError(re)) {
this.a.error(re);
} else {
// profile upload success
}
} else {
const re = await this.firehouse.userRegister(this.form).catch(e => e);
if (re.code === void 0) {
// do something after registration
} else {
this.a.error(re);
}
}
return false;
}
Common pitfalls
- The following shows a common pitfall you may be trapped.
- It first creates account with email/password
- And inside the
firehouse.userRegister
, it will create user profile documentation under/users
collection. - Before it creates a doc undre
/users
, it will try to read it because it listens the user staet change. - So, it reads the user data before it exists.
- That's why you get
premission-denied
error.
this.f.fireAuth.auth.onAuthStateChanged( async () => {
console.log(`auth.onAuthStateChanged() happens right after email/password registration before updated /users collection`);
if ( this.f.isLoggedIn ) {
console.log(`Since the user has logged in already
and it is trying to get user data from /users collection which is not exists yet.`);
const re = await this.f.userGet( this.f.currentUser.uid ).then( user => {
this.form = user;
this.a.render();
}).catch( e => e);
if ( this.f.isError(re) ) {
console.log(`That's why you get permission-denied error here!`);
this.a.error(re);
}
}
/**
* going to register
*/
const re = await this.f.userRegister( this.form ).catch(e => e);
if ( re.code === void 0 ) {
// this.a.alert('Register success');
// this.a.openHome();
} else {
this.a.error( re );
}
});