javascript - 对象是有值存在的,但是当访问属性时返回 undefined
问题描述
我发现奇怪的事情。我有 AuthService 可以保存我的应用程序的身份验证需求,包括身份验证令牌。
@IonicPage()
@Component({
selector: 'page-login',
templateUrl: 'login.html',
})
export class LoginPage {
constructor(public navCtrl: NavController, public navParams: NavParams, public modalCtrl:ModalController,public auth: AuthService) {
}
ionViewDidLoad() {
console.log(this.auth)
console.log(this.auth.loggedIn)
if(this.auth.loggedIn){
console.log(this.auth);
this.navCtrl.push("TabsPage");
}
}
}
当我打电话时
console.log(this.auth)
当我打电话时它返回了身份验证
console.log(this.auth.loggedIn)
它返回空
这是我的 auth.service.ts
import { Injectable, NgZone, Component } from '@angular/core';
import { Storage } from '@ionic/storage';
// Import AUTH_CONFIG, Auth0Cordova, and auth0.js
import { AUTH_CONFIG } from './auth.config';
import Auth0Cordova from '@auth0/cordova';
import * as auth0 from 'auth0-js';
@Injectable()
export class AuthService {
Auth0 = new auth0.WebAuth(AUTH_CONFIG);
Client = new Auth0Cordova(AUTH_CONFIG);
accessToken: string;
user: any;
loggedIn: boolean;
loading = true;
constructor(
public zone: NgZone,
private storage: Storage
) {
this.storage.get('profile').then(user => this.user = user);
this.storage.get('access_token').then(token => this.accessToken = token);
this.storage.get('expires_at').then(exp => {
this.loggedIn = Date.now() < JSON.parse(exp);
this.loading = false;
});
}
login() {
this.loading = true;
const options = {
scope: 'openid profile offline_access'
};
// Authorize login request with Auth0: open login page and get auth results
this.Client.authorize(options, (err, authResult) => {
if (err) {
throw err;
}
// Set access token
this.storage.set('access_token', authResult.accessToken);
this.accessToken = authResult.accessToken;
// Set access token expiration
const expiresAt = JSON.stringify((authResult.expiresIn * 1000) + new Date().getTime());
this.storage.set('expires_at', expiresAt);
// Set logged in
this.loading = false;
this.loggedIn = true;
// Fetch user's profile info
this.Auth0.client.userInfo(this.accessToken, (err, profile) => {
if (err) {
throw err;
}
this.storage.set('profile', profile).then(val =>
this.zone.run(() => this.user = profile)
);
});
});
}
logout() {
this.storage.remove('profile');
this.storage.remove('access_token');
this.storage.remove('expires_at');
this.accessToken = null;
this.user = null;
this.loggedIn = false;
}
isLoggedIn() :boolean{
return this.loggedIn;
}
}
我正在使用 ionic3 和 auth0 身份验证,以前我认为这是我的错,没有在我的财产上使用公共标识符。但是当我将属性更改为公共,或创建返回属性的 getter 方法时,它仍然无法正常工作。
解决方案
这是由于 chrome 控制台在评估对象时造成的。如果您在控制台中打开该对象,您会看到一个蓝色的小信息图标。这会说:
刚刚评估了价值
基本上发生的情况是对象内容在您记录它的时间和您在控制台中打开它的时间之间发生了变化。
登录操作是异步的,这意味着loggedIn
auth 对象上的属性将在ionViewDidLoad
调用之后设置。也许一件好事是在APP_INITIALIZER
提供者中设置身份验证,或者在您的身份验证上设置一些 Observable,您可以在其上侦听身份验证更改
推荐阅读
- maven - buildnumber-maven-plugin 公开 SVN 密码明文
- angular - 在角度 8 上刷新页面不显示来自后端 api 的数据
- wordpress - 在 Google 地图上设置 SVG 标记大小
- sql - oracle sql连接不正确
- c# - 基于 URL .NET Core 3.0 的本地化
- amazon-web-services - 带胶水的aws emr:如何指定数据库名称?
- python - Python中不同类型操作数的重载运算符
- python - 将数据框的一列转换为 spacy doc
- c++ - 有没有办法在一段时间后将流程从外流中分离出来?
- c - C 错误:赋值给数组类型的表达式