Hacktoberfest 2026：メンテナが10月に向けて印を付けた、オープンで初心者向けの issue。 Hacktoberfest の issue を見る

Link anonymous user with logged in user, possible bug. componentDidMount not called anymore.

オープン
  • 何か問題がありますか？
#64 コメント 0 件 リアクション 0 件 担当者 0 名 GitHub で見る

まだ誰も着手していません。

評価

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

調査の方向性

autoUpgradeAnonymousUsers を有効にした状態で、Login コンポーネント、LoginProvider、StyledFirebaseAuth、および示されている uiConfig コールバックを使用して clean-account フローを再現する。loginProvider.register コールバックと isSignedIn 状態の遷移を追跡し、componentDidUpdate がトリガーされなくなった理由を特定する。原因と期待されるリダイレクト動作が文書化または検証されれば完了とする。

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

説明

Hello,
first of all Happy Easter.

I think there is a bug when using autoUpgradeAnonymousUsers: true in uiConfig.

I will paste my code and I'll explain how to reproduce.

initialization code:

const uiConfig = {
  signInFlow: 'popup',
  c
  signInOptions: [
    firebase.auth.GoogleAuthProvider.PROVIDER_ID,
  ],
  callbacks: {
    signInSuccessWithAuthResult: () => {
      console.log('signInSuccessWithAuthResult')
      return false
    },
    signInFailure: (error: any) => {
      console.log('sign')
      if (error.code != 'firebaseui/anonymous-upgrade-merge-conflict') {
        return Promise.resolve();
      }
      var cred = error.credential;
      return firebase.auth().signInWithCredential(cred);
    }

  },
};

const loginProvider = new FirebaseLoginProvider(
  firebaseApp, uiConfig
);

loginProvider.register((user) => {
  if (user == null) {
    console.log('null')
    firebaseApp.auth().signInAnonymously().catch((error) => {
      console.log(error);
    })
  } else {
    console.log("Anony " + user.isAnonymous)
  }
})

And this is my react component:

import 'firebase/auth';
import './firebase-global.css';

import * as React from 'react';

import { RouteComponentProps, withRouter } from "react-router-dom";

import LoginProvider from './LoginProvider';
import StyledFirebaseAuth from 'react-firebaseui/StyledFirebaseAuth';

interface Props {
};

interface State {
  isSignedIn: boolean
}

interface HomeProps extends RouteComponentProps<Props> {
  loginProvider: LoginProvider
}

class Login extends React.Component<HomeProps, State> {

  state = {
    isSignedIn: false
  }

  constructor(props: HomeProps) {
    super(props);
  }

  componentDidMount() {
    console.log('componentDidMount')
    this.props.loginProvider.register((user) => {
      if (user != null && !user.isAnonymous) {
        this.setState({ isSignedIn: true } as State);
      } else {
        this.setState({ isSignedIn: false } as State);
      }
    })
  }

  componentDidUpdate() {
    console.log('componentDidUpdate')
    this.goBackWhenLoggedIn();
  }

  componentWillUnmount() {
    console.log('componentWillUnmount')
    this.props.loginProvider.unregister();
  }

  render() {
    const signedIn = this.state.isSignedIn

    return (
      <div className='container'>
        {!signedIn &&
          <div>
            <StyledFirebaseAuth
              className='firebaseUi'
              uiConfig={this.props.loginProvider.actualConfig()}
              firebaseAuth={this.props.loginProvider.actualProvider()} />
          </div>
        }
      </div>
    );
  }

  private goBackWhenLoggedIn() {
    if (this.state.isSignedIn) {
      // this.props.loginProvider.promoteAccount()
      this.props.history.goBack()
    }
  }

}
export default withRouter(Login);

After login, before adding the option autoUpgradeAnonymousUsers: true for which I also had to add

    signInFailure: (error: any) => {
      console.log('sign')
      if (error.code != 'firebaseui/anonymous-upgrade-merge-conflict') {
        return Promise.resolve();
      }
      var cred = error.credential;
      return firebase.auth().signInWithCredential(cred);
    }

based on documentation from Handling anonymous user upgrade merge conflicts paragraph on https://firebase.google.com/docs/auth/web/firebaseui

I don't get redirected successfully WHEN I have a clean situation for my user meaning I delete my anonymous user and my logged in user from firebase console (Manage users).

Before, after logging in on Google, componentDidUpdate was called and I could succesfully be redirected to the last page using react router. Now I can't anymore.

What I did to solve the issue is to use window.history.back(); inside signInSuccessWithAuthResult function.

Am I doing something wrong with the configuration? I can't understand why componentDidUpdate is not fired anymore.

主要言語
JavaScript
スター
1.3k
フォーク
246
30日以内にマージされた PR はありません

環境構築

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

firebase/firebaseui-web-react のほかの issue

firebase/firebaseui-web-react の issue をすべて見る

似ている issue

JavaScript の issue をもっと見る

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

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