【发布时间】：2018-07-04 01:04:16
【问题描述】：
我正在尝试通过 AngularFire2 将 firebase 与 Nebular 集成。
我正在我的应用程序模块中初始化 AngularFire2，当我检查时，它似乎正在配置 firebase 应用程序，但由于某种原因，未附加 auth 模块或类似的原因，因为 firebase.auth() 为 null 并且应该是一个函数。
调试输出
似乎 firebase 正在初始化。
https://user-images.githubusercontent.com/60548/35354017-c198eee2-00fd-11e8-8030-95654ebb2d5f.png
但随后它会引发 TypeError。 https://user-images.githubusercontent.com/60548/35353848-50c7e506-00fd-11e8-9563-b29efef69e2c.png
core.module.ts
const NB_CORE_PROVIDERS = [
...DataModule.forRoot().providers,
...NbAuthModule.forRoot({
providers: {
email: {
service: NbFirebaseAuthProvider,
config: {
},
},
},
}).providers,
AnalyticsService,
NbFirebaseAuthProvider,
];
@NgModule({
imports: [
CommonModule,
],
exports: [
NbAuthModule,
],
declarations: [],
})
export class CoreModule {
constructor(@Optional() @SkipSelf() parentModule: CoreModule) {
throwIfAlreadyLoaded(parentModule, 'CoreModule');
}
static forRoot(): ModuleWithProviders {
return <ModuleWithProviders>{
ngModule: CoreModule,
providers: [
...NB_CORE_PROVIDERS,
],
};
}
}
app.module.ts
@NgModule({
declarations: [AppComponent],
imports: [
BrowserModule,
BrowserAnimationsModule,
HttpModule,
AngularFireModule.initializeApp({
apiKey: "<removed>",
authDomain: "<removed>",
databaseURL: "<removed>",
projectId: "<removed>",
storageBucket: "<removed>",
messagingSenderId: "65580220719"
}),
AngularFireAuthModule,
AppRoutingModule,
NgbModule.forRoot(),
ThemeModule.forRoot(),
CoreModule.forRoot(),
],
bootstrap: [AppComponent],
providers: [
{ provide: APP_BASE_HREF, useValue: '/' },
],
})
export class AppModule {
}
firebase-auth.provider.ts
@Injectable()
export class NbFirebaseAuthProvider extends NbAbstractAuthProvider {
constructor(
private afa : AngularFireAuth
) {
super();
console.log(this.afa);
}
protected defaultConfig: NgEmailPassAuthProviderConfig = {
login: {
redirect: {
success: '/',
failure: null,
},
},
register: {
redirect: {
success: '/',
failure: null,
},
},
requestPass: {
redirect: {
success: '/auth/login',
failure: null,
},
},
resetPass: {
redirect: {
success: '/auth/login',
failure: '/auth/reset-password',
},
},
logout: {
redirect: {
success: '/auth/login',
failure: null,
},
},
};
/**
* Firebase authentication.
*
* @param data any
* @returns Observable<NbAuthResult>
*/
authenticate(data?: any): Observable<NbAuthResult> {
console.log(this.afa);
return Observable.fromPromise(this.afa.auth.signInWithEmailAndPassword(data.email, data.password))
.map((res) => {
return this.processSuccess(res, this.getConfigValue('login.redirect.success'), [res.message]);
})
.catch((res) => {
return Observable.of(
this.processFailure(res, this.getConfigValue('login.redirect.failure'), [res.message]),
);
});
}
/**
* Firebase registration.
*
* @param data any
* @returns Observable<NbAuthResult>
*/
register(data?: any): Observable<any> {
return Observable.fromPromise(this.afa.auth.createUserWithEmailAndPassword(data.email, data.password))
.map((res) => {
return Observable.fromPromise(this.afa.auth.currentUser.updateProfile({
displayName: data.fullName,
photoURL: '',
})).map((update) => {
return this.processSuccess(res, this.getConfigValue('register.redirect.success'), [res.message]);
});
})
.catch((res) => {
return Observable.of(
this.processFailure(res, this.getConfigValue('register.redirect.failure'), [res.message]),
);
});
}
/**
* Firebase restore password.
*
* @param data any
* @returns Observable<NbAuthResult>
*/
requestPassword(data?: any): Observable<NbAuthResult> {
return Observable.fromPromise(this.afa.auth.sendPasswordResetEmail(data.email))
.map((res) => {
return this.processSuccess(res, this.getConfigValue('requestPass.redirect.success'), []);
})
.catch((res) => {
return Observable.of(this.processFailure(res, this.getConfigValue('requestPass.redirect.failure'),
[res.message]));
});
}
/**
* Firebase reset password.
*
* @param data any
* @returns Observable<NbAuthResult>
*/
resetPassword(data?: any): Observable<NbAuthResult> {
if (this.afa.auth.currentUser) {
return Observable.fromPromise(this.afa.auth.currentUser.updatePassword(data.password))
.map((res) => {
return this.processSuccess(res, this.getConfigValue('resetPass.redirect.success'), []);
})
.catch((res) => {
return Observable.of(this.processFailure(res, this.getConfigValue('resetPass.redirect.failure'),
[res.message]));
});
}
return Observable.of(this.processFailure([], this.getConfigValue('resetPass.redirect.failure'),
['Please, sign in to be able to reset your password']));
}
/**
* Firebase logout.
*
* @param data any
* @returns Observable<NbAuthResult>
*/
logout(data?: any): Observable<NbAuthResult> {
return Observable.fromPromise(this.afa.auth.signOut())
.map((res) => {
return this.processSuccess(res, this.getConfigValue('logout.redirect.success'), []);
})
.catch((res) => {
return Observable.of(this.processFailure(res, this.getConfigValue('logout.redirect.failure'),
[res.message]));
});
}
private processSuccess(response?: any, redirect?: any, messages?: any): NbAuthResult {
return new NbAuthResult(true, response, redirect, [], messages);
}
private processFailure(response?: any, redirect?: any, errors?: any): NbAuthResult {
return new NbAuthResult(false, response, redirect, errors, []);
}
}
【问题讨论】：
-
这些图片中的文字非常小，难以阅读。强烈建议您简单地将代码和错误消息复制到问题文本中，而不是发布图像。这样更容易阅读和搜索。
-
@DougStevenson 是的，我现在明白了。不幸的是，SO 没有链接到图像本身，因为它们是全尺寸屏幕截图并且不难阅读。
-
删除
CoreModule并重新定位模块。考虑让CoreModule成为一个没有声明的纯服务模块。 -
你能把你的项目上传到 GitHub 或类似的地方吗？
-
@lolsborn 你解决了吗？