2017-02-10 1 views
0

Ionic 2 앱에서 간단한 로그인을 개발 중입니다.이온 2 로그인 구성 요소 및 인증 서비스

로그인 구성 요소를 사용하여 로그인보기를 렌더링 한 다음 전자 메일과 암호를 인증 서비스에 보내고 토큰을 저장하고 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() { 
     ??? 
    } 

} 

어떻게 로그인이 성공인지 아닌지 참 또는 거짓 정식 서비스 수익은 따라 할 수 있습니까?

이 전체 관찰 것은 아직도 나에게 약간의 혼란

...

답변

4

HTTP 요청이 immediatly 응답하지 않기 때문에 당신은 부울 직접 반환하지 않습니다. 대신, 당신은 관찰자를 호출자에게 되 돌리고, "나는 아직 해답이 없지만 여기에는 내가 그것을 얻은 후에 당신에게 해답을 알 수있는 관측자가 있습니다."라고 말합니다. 그러면 발신자가이 관찰 가능 항목 (메일 링리스트와 같은)을 구독하고 응답과 함께 (이메일 수신과 같은) 신호를받습니다.

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'); 
}); 
+0

첫째. 귀하의 코드를 구현했지만 인증 서비스에 다음과 같이 표시됩니다. '관찰 가능'을 찾을 수 없습니다. 다른 lib를 가져와야합니까? – almo

+0

예, 'rxjs'의 import {Observable}을 사용할 수 있습니다. – kdev

+0

또한 로그인시 true 또는 false와 같은 원하는 응답 유형을 추가하고 싶습니다.이 HTTP POST 호출을 수행하는 서버의 POST 서비스에서 구현할 수 있습니다. –