Question

使用firebase身份验证时，我遇到了一个奇怪的角度4刷新问题。

我能够在一个简单的应用程序中重现该问题，该应用程序应该显示用户是否能够使用firebase auth（Google帐户）登录。

问题是，结果消息会在控制台中打印出来，但它不会立即显示在浏览器中。大约10秒后，屏幕刷新并显示错误消息。

如何避免这种延迟？

app.component.ts

import {Component} from '@angular/core';
import {AuthService} from './auth-service.service';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'app';
  msg: string;

  constructor(private authService: AuthService) {}

  login() {
    this.authService.loginWithGoogle()
      .then(() => {
          console.log('success');
          this.msg = 'success';
        }
      )
      .catch((err) => {
         console.log('error:'+ err);
         this.msg = err.message;
      });
  }
}

app.compontent.html

<div>Error is: {{msg}}</div>
<button (click)="login()">
Login
</button>

auth.service.ts

import {AngularFireAuth} from 'angularfire2/auth';
import * as firebase from 'firebase/app';

@Injectable()
export class AuthService {

constructor(private afAuth: AngularFireAuth) {
}

loginWithGoogle() {
     return this.afAuth.auth.signInWithPopup(new 
firebase.auth.GoogleAuthProvider());
  }
}

您可以在此处查看问题：https://jaidev1-27a1b.firebaseapp.com/

使用任何Google帐户登录。

更新：这只适用于Chrome。使用chrome 59

Answer 1

这是因为缓存。调试时禁用缓存。

Angular / Firebase app~10秒，直到更改显示在浏览器中

1 个答案: