Question

在我的应用程序中，我使用react，redux和redux-observable。我添加了一个史诗，可以监听react-router的“ LOCATION_CHANGE”动作，并根据该有效负载触发ajax请求。

对于每个请求，后端都需要一个包含apiKey的标头。这个apiKey是我通过firebase auth getIdToken()方法获得的。

所以我用这种方式包装了我的ajax调用：

function getApiKey() {
  const currentUser = window.firebase.auth().currentUser
  return from(currentUser.getIdToken()).pipe(take(1))
}

export const getJson = url =>
  getApiKey().pipe(
    filter(apiKey => apiKey),
    mergeMap(apiKey =>
      ajax.get(url, {
        apiKey
      })
    )
  )

我每次需要从firebase API而不是简单地将其存储在本地存储中获取令牌的原因是，如果密钥过期，则此方法将刷新它并返回新的有效密钥。

问题是在应用启动后的几毫秒内currentUser为null，但是史诗试图在初始化Firebase身份验证模块之前根据路由位置获取数据，所以我最终遇到了：

“找不到未定义的currentUser”或类似的消息。

Firebase文档建议使用“ onAuthStateChanged”，一旦用户可用，就会调用它的回调，但是我不知道如何将其嵌入当前流程。

非常感谢您的协助！谢谢。

Answer 1

尝试以下操作，用户流将始终具有最后保存的授权用户可用

const user=new Observable(obs=>{
firebase.auth().onAuthStateChanged(function(user) {
  if (user) {
    obs.next(user)
  } else {
    // No user is signed in.
    // depends what you want to do
    obs.error('unauthorized')
  }
})
}).pipe(shareReplay())

function getApiKey() {
  return user.pipe(switchMap(currentUser=>currentUser.getIdToken(),take(1))
}

在初始化Firebase用户之前，会发出readux可观察的史诗

1 个答案: