angular / angular/angularfire

getRedirectResult() always returns null - Unable to retrieve idToken after signInWithRedirect()

オープン
#3,335 コメント 19 件 リアクション 6 件 担当者 0 名 GitHub で見る
comp: auth needs: recheck type: bug version: legacy (v7-v16)
主要言語
TypeScript
スター
7.8k
フォーク
2.2k
平均マージ
22時間 28分
マージ済み PR(30日)
6

説明

### Version info

**Angular:** 15

**Firebase:** 9

**AngularFire:** 7.5.0

### How to reproduce these conditions

**Steps to set up and reproduce**

> Note: I am testing this locally and on a mobile device. In both cases I am using Chrome. The application is hosted locally running `ng serve --watch --ssl --host 0.0.0.0` which means the SSL certificate is not valid. I mention this in case it is relevant.

I'm simply calling `signInWithRedirect()` and install an `APP_INITIALIZER` provider to make sure the `idToken` is loaded as the app starts.

However, the `idToken` (as well as the `credentials`) are always `null`/`undefined` and I have no idea why. Could be related to (https://github.com/angular/angularfire/issues/3208).

```typescript
public signInWithGoogle() {
return signInWithRedirect(this.auth, new GoogleAuthProvider());
}
```

```typescript
export const AUTH_ID_TOKEN_INITIALIZER_PROVIDER: Provider = {
provide: APP_INITIALIZER,
deps: [NGXLogger, AuthService],
multi: true,
useFactory: (logger: NGXLogger, authService: AuthService) => {
return async () => {
logger.info("Initializing App: Waiting for (API) idToken");
const credentials = await getRedirectResult(authService.auth);
console.log(credentials); // Is already null
const idToken = await credentials?.user.getIdToken();
console.log(idToken);
if (idToken) {
return idToken;
}
await authService.init(); // <-- Implementation below (put it here for testing)
return firstValueFrom(authService.idToken$);
}
},
};
```

I tried a different approach after reading that we have to wait for `onAuthStateChanged()` to fire and only after that we're supposed to fetch the `idToken`. The implementation looked like this (with the same result however):

```typescript
async init() {
this.logger.debug("Checking for token from redirect");
const credentials = await getRedirectResult(this.auth);
this.idToken = await credentials?.user.getIdToken();

await this.auth.onAuthStateChanged(
async () => {
const credentials = await getRedirectResult(this.auth);
this.idToken = await credentials?.user.getIdToken();
console.log("inner");
console.log(this.idToken);
}
);
console.log("outer");
console.log(this.idToken);
}
```

### Expected behavior

Receive a valid `idToken` after beind redirected.

### Actual behavior

Credentials & token are `null` / `undefined`.

コントリビューションガイド

コントリビューションガイドを開く

調査の方向性

まず、Angular 15、Firebase 9、AngularFire 7.5.0 を使用して redirect フローを再現し、signInWithRedirect()、getRedirectResult()、APP_INITIALIZER、onAuthStateChanged() に焦点を当てます。getRedirectResult() がいつ呼び出されるかを追跡し、redirect 後に有効な credential と idToken を受け取って完了を確認します。

索引モデルが issue の本文から書いたものです。

評価

技術スタック
angular, firebase, typescript
領域
authentication
issue の種類
バグ
難易度
3/5
見積もり時間
1〜2日
活発さ
静か
明瞭さ
おおむね明確
初心者へのやさしさ
48/100

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。