web-dev-qa-db-ja.com

localStorage.setItemがangular 4で終了するまで待つ方法

私はangular 4アプリケーションを開発しています。ユーザーがシステムにログインしたい場合、サーバーにhttpリクエストを送信し、サーバーはユーザーを検証し、認証キーを使用してリポジトリを送信し、他のユーザーの詳細。ローカルストレージを使用してこれらの情報を保存します

_login() {
  if (this.loginForm.valid) {
    this.serviceUserService.authenticate(this.loginForm).subscribe(response => {
      if (response.message != "_err") {
        //saving the current user in localstorage
        localStorage.setItem('currentUser', JSON.stringify(response.body));
        this.router.navigateByUrl('/');
      } else {
        alert("invalid login. Please try again")
      }
    }, err => {
      console.log(err);
    })
  }
}
_

localStorage.setItem()は非同期関数のようです。そのため、現在のユーザーをローカルストレージに保存する前に、メインページにリダイレクトします。ただし、トークンはローカルストレージに保存されないため、httpリクエストは機能しません。 localStorage.setItem()がタスクを終了するまで待ってから、ユーザーをホームページに移動するにはどうすればよいですか。

javascriptangularasynchronouslocal-storage
7
pavithra rox

誰かが同じ種類の問題を抱えている場合...これの理由は、現在のユーザーを保存し、コンストラクター内でその変数の値を設定するために、サービスクラスに変数を作成したためです。したがって、ログインページでは、authenticateメソッドが呼び出されると、変数を初期化しようとしますが、ユーザーはまだログインしていないため、まだnullです。それが問題の原因でした。

0
pavithra rox

あなたは間違っています、すべてのlocalStorage呼び出しは同期です。おそらく、次のページに移動する前にチェックを追加できます。

 localStorage.setItem('currentUser', JSON.stringify(response.body));     
 this.router.navigateByUrl('/');
3
Sajeetharan