Question

我正在使用Ionic 2应用程序开发一个简单的登录。

我有一个登录组件，用于呈现我的登录视图，然后向auth服务发送电子邮件和密码，该服务将验证，保存令牌并向登录组件返回true或false。

我的登录组件：

export class LoginPage {

    email: string;
    password: string;

    constructor(public navCtrl: NavController, public navParams: NavParams, public authentifiction: Authentification) {}

    login() {
        this.authentifiction.login(this.email, this.password);
    }

    loginSuccess() {
        console.log('Success');
    }

    loginError() {
        console.log('Failed');
    }

}

我的身份验证服务：

export class Authentification {

    public authorized: boolean;

    constructor(public http: Http, private alertCtrl: AlertController, public storage: Storage) {}

    login(email, password) {
        var params = 'email=' + email + '&password=' + password;
        var headers = new Headers();
        headers.append('Content-Type', 'application/x-www-form-urlencoded');

        return this.http.post('URL', params, {
            headers: headers})
            .map(res => res.json())
            .subscribe(
                data => this.loginSuccess(data.auth_token),
                error => this.loginError()
        );
    }

    loginSuccess(auth_token) {
        this.storage.set('auth_token', auth_token);
        ???
    }

    loginError() {
        ???
    }

}

如果登录成功与否，我如何让auth服务返回true或false？

这整个可观察的事情对我来说仍然有点混乱......

Answer 1

您不直接返回布尔值，因为http请求不会立即回复。相反，你将一个观察者返回给来电者，告诉他＆＃34;我还没有答案，但这里有一个可观察到的，一旦我拥有它就会注意到答案＆＃34;。然后调用者只是订阅这个observable（如邮件列表），并收到一个信号（如接收电子邮件）和答案。

login(email, password): Observable<boolean> {
...
return this.http.post('URL', params, {
  headers: headers
}).map(res => {
  this.storage.set('auth_token', res.json().auth_token);
  return true;
});

来自来电者：

login() {
 this.authentifiction.login(this.email, this.password).subscribe(res => {
   console.log('success');
 }, error => {
   console.log('error');
 });

Ionic 2登录组件和Auth服务

1 个答案: