Redux-saga firebase onAuthStateChanged eventChannel

Question

如何处理残存传奇中的火源状态观测器？

firebase.auth().onAuthStateChanged((user) => {

});

当我的应用程序启动时，我想运行APP_START传奇，它将运行firebase.auth().onAuthStateChanged观察者，并根据回调运行其他saga。

据我所知，eventChannel是正确的做法。但我不知道如何使它与firebase.auth().onAuthStateChanged一起工作。

有人能告诉我如何把firebase.auth().onAuthStateChanged放进eventChannel吗？

Answer 1

您可以使用eventChannel。下面是一个示例代码：

function getAuthChannel() {
  if (!this.authChannel) {
    this.authChannel = eventChannel(emit => {
      const unsubscribe = firebase.auth().onAuthStateChanged(user => emit({ user }));
      return unsubscribe;
    });
  }
  return this.authChannel;
}

function* watchForFirebaseAuth() {
  ...
  // This is where you wait for a callback from firebase
  const channel = yield call(getAuthChannel);
  const result = yield take(channel);
  // result is what you pass to the emit function. In this case, it's an object like { user: { name: 'xyz' } }
  ...
}

完成后，可以使用this.authChannel.close()关闭通道。

Answer 2

创建自己的函数onAuthStateChanged()，它将返回一个Promise

function onAuthStateChanged() {
  return new Promise((resolve, reject) => {
    firebase.auth().onAuthStateChanged((user) => {
      if (user) {
        resolve(user);
      } else {
        reject(new Error('Ops!'));
      }
    });
  });
}

然后使用打电话方法同步获取user

const user = yield call(onAuthStateChanged);

Answer 3

这可以在Saga中处理，例如Redux的以下内容：

// Redux Saga: Firebase Auth Channel
export function* firebaseAuthChannelSaga() {
  try {
    // Auth Channel (Events Emit On Login And Logout)
    const authChannel = yield call(reduxSagaFirebase.auth.channel);

    while (true) {
      const { user } = yield take(authChannel);

      // Check If User Exists
      if (user) {
        // Redux: Login Success
        yield put(loginSuccess(user));
      }
      else {
        // Redux: Logout Success
        yield put(logoutSuccess());
      }
    }
  }
  catch (error) {
    console.log(error);
  }
};