Angular 10 : ngOnInit 两个承诺

Question

我目前正在尝试在我的 Angular 应用程序中实现与 Strava API 的连接。

要快速恢复：

用户点击按钮连接到 Strava
重定向到 Strava 进行身份验证（使用 PKCE）
Strava 使用代码重定向到我的应用程序
在 ngoninit 中，我正在检查路由参数，如果我有代码，我将启动两个链接的承诺：第一个从 Strava 获取访问令牌，然后记录到 DB(Firebase) 中。

问题是有时数据会记录在 firebase 中，有时不会。行为不系统。奇怪的是，我每次都进入我的 postNewToken，因为控制台会记录它。

如果我只是在 ngOnInit() 中记录到 firebase（没有 strava 令牌请求），它会在 100% 的情况下创建。
如果我有一个启动令牌请求并记录到 firebase 的按钮，它似乎每次都有效。

我不知道怎么解决。这似乎更像是一个将 promises 链接到 ngOnInit 的问题，但我什至不知道如何绕过它。

来自我的组件的代码：

  ngOnInit() {
        const stravaCode = this.route.snapshot.queryParamMap.get('code');
        if (stravaCode !== undefined) {
          this.stravaService.handleStravaAuthorizationCode(stravaCode);
}

并在关联的服务中：

 // Handle Strava Code received
 handleStravaAuthorizationCode(authorizationCode: string) {
     this.getStravaToken(authorizationCode).then(res => {
       this.postNewToken(res).then(res => {
         this.router.navigate(['encoding']);
       });
     });
 }

 // Get Strava access token to make the requests to the API -> only done once
 getStravaToken(authorizationCode: string){
   if (authorizationCode !== undefined){
     console.log('Authorization code: ' + authorizationCode);

     const data = {
       client_id: environment.strava.client_id,
       client_secret: environment.strava.client_secret,
       code: authorizationCode,
       grant_type: 'authorization_code'
     };

     return this.http.post<StravaToken>(this.stravaTokenURL, data)
     .pipe(catchError(this.errorService.handleHttpError)).toPromise();
   }
 }

 postNewToken(stravaToken: StravaToken) {
   if (this.authService.isLoggedIn) {
       console.log('Recording strava token into Firebase');
       console.log(stravaToken);
       return this.afs.collection('strava_tokens')
       .add(stravaToken).then(res => console.log(res), err => console.log(err));
   } else {
       return Promise.reject(new Error('No User Logged In!'));
   }
 }

Answer 1

终于明白了。我只是没有等待与 firebase 的连接建立。因此，我无法 post 任何新数据，因为我未通过身份验证。

Angular 10 : ngOnInit 两个承诺

Angular 10 : ngOnInit two promises

javascript

promise

firebase

angularfire2

angular