我需要在成功登录后在本地存储中存储一些值。
我的API返回此
{
"auth": {
"name": "FooBar",
"username: 'foobaz",
},
"token": "1234567890abcdefghijklmnop"
}
我在authentication.service.ts
中尝试过在login()
中这样做,但我无法理解。我在pipe()
中多次尝试使用switchMap
,但没有成功。
验证.服务.ts
login(credentials: { email: any, password: any }): Observable<any> {
return this.http.post('https://mysite.test/api/login', credentials)
.pipe(
map((data: any) => data.token),
switchMap(token => {
return from(Preferences.set({ key: 'token', value: token }));
}),
tap(_ => {
this.isAuthenticated.next(true);
})
)
}
所以我想我应该在login.page.ts
中的.subscribe()
内尝试它,但是我一直收到错误,比如TypeError: undefined is not an object (evaluating 'res.auth.name')
。
显然是存在的;我正在使用await
,而且我能够获得res.error.message
,并在出现错误时从API中读取消息,所以我真的很困惑我到底做错了什么?
我想也许我需要再次map()
结果,但我就是不能让它工作。我找不到例子来说明如何做我想做的事情。
登录.页面.ts
async login() {
const loading = await this.loadingController.create();
await loading.present();
this.authService.login(this.myForm.value)
.subscribe(
async (res:any) => {
// THIS IS WHAT I'M TRYING TO ACCOMPLISH
await Preferences.set({ key: 'authName', value: res.auth.name });
await Preferences.set({ key: 'authUsername', value: res.auth.username });
await loading.dismiss();
this.menu.enable(true);
this.router.navigateByUrl('/tabs/home', { replaceUrl: true });
},
async (res) => {
await loading.dismiss();
const alert = await this.alertController.create({
header: 'Login Failed',
message: res.error.message,
buttons: ['OK'],
});
await alert.present();
}
);
}
1条答案
按热度按时间uyhoqukh1#
我相信问题出在
switchMap
操作符上,你创建了这个操作符并返回了另一个新的Observable,它覆盖了原来的Observable。建议在
tap
运算符中执行Preferences.set
操作,以保持原始可观察值。