2017-01-12 6 views
0

ログインページでユーザー名とパスワードを認証するための認証サービスを作成しました。以下のコードはサービスです。Ionic2 - http getが機能していない

public login(credentials) { 
    if (credentials.username === null || credentials.password === null) { 
     return Observable.throw("Please insert credentials"); 
    } else { 

    let apiURL = 'http://localhost/timeclock/api/login?usercode=' + credentials.username + 
    '&password=' + credentials.password ; 

    return Observable.create(observer => {  
    this.http.get(apiURL).map(res => res.json()).subscribe(data => {   
    if (data.success === 'true') 
    { 
     this.currentUser.name = data.data.user_name; 
     this.currentUser.email = data.data.user_email; 
     observer.next(true); 
     observer.complete(); 
    } else { 
     observer.next(false); 
     observer.complete(); 
     }  
    }); 
    }); 
} 
} 

ユーザー名とパスワードが送信されると、正しいパラメータでURLが正しく呼び出されます。

httpコールには非常に時間がかかります。また、応答は返されません。

ブラウザで同じパラメータでURLを呼び出すと、応答を取得するのにわずか2〜3秒かかります。

これを修正する方法はありますか?

+0

あなたはヘッダーの設定を試しましたか。また、エラーのキャッチを設定していません。 –

+1

ログインに 'POST'を使用することをお勧めします。この方法では、パスワードがURLにはっきりと見えず、戻り値を引き出すことができます。今、あなたの問題。あなたの 'GET'リクエストが実際に送信され、そのレスポンスが何であるかをクローム開発者ツールで確認できますか? – Ivaro18

+0

ご意見ありがとうございます。私はapiが最初に呼び出されたときに呼び出しに時間がかかることを発見しました。後続の呼び出しで正常に動作します。 nullレスポンスに関しては、レスポンスを送信する前にAPIレスポンスにヘッダを設定する必要があることがわかりました。今、私はAPIから値を受け取りました。 –

答えて

0

このようにリファクタリングできる新しいObservableを作成する必要はありません。

public login(credentials) : Observable<boolean> { 
    if (credentials.username === null || credentials.password === null) { 
    return Observable.throw("Please insert credentials"); 
    } else { 

    let apiURL = 'http://localhost/timeclock/api/login?usercode=' + credentials.username + 
     '&password=' + credentials.password ; 

    return this.http.get(apiURL).map(res => res.json()) 
     .map(data => 
     { 
     if(data.success){ 
      this.currentUser.name = data.data.user_name; 
      this.currentUser.email = data.data.user_email; 
      return true; 
     }else{ 
      return false; 
     } 
     }); 
    } 
} 
+0

私はイオン性が新しいです。いつObservable.createを使用しますか?上記のようにコードを動作させることができました。 –

+0

独自のカスタムオブザーバブルを作成したいとき。 ObservablesはRxJSライブラリのhttp://reactivex.io/rxjs/から公式ドキュメントを入手しています。このサイトでhttps://www.learnrxjs.io/をご覧ください。 Ionic 2とAngular 2は観測値に多くの焦点を当てているので、あなたはそれを学ぶことをお勧めします。 –

関連する問題