Question

我有这个React + Redux + Firebase应用程序。

在商店中，我们有一个userReducer只有一个名为authed的状态属性，如果用户是否被记录则是一个布尔值。

我有这个config.js文件，用于配置firebase功能和内容。

export const ref = firebase.database().ref();

export const firebaseAuth = firebase.auth;

export function login (email, pw) {
  return firebaseAuth().signInWithEmailAndPassword(email, pw)
}

逻辑如下＆gt;在开头authed值为false，然后我们使用

创建一个帐户

export function auth(email, pw) {
  return firebaseAuth().createUserWithEmailAndPassword(email, pw)
    .then(saveUser);
}

然后在App.js我们

componentDidMount() {
    this.removeListener = firebaseAuth().onAuthStateChanged((user) => {
      if (user) this.props.authed_true();
      else this.props.authed_false();
    })
  }

  componentWillUnmount () {
    this.removeListener()
  }

来自redux的

this.props.authed_true/false函数只需更改状态的authed prop，具体取决于是否有用户。

如果authed为true，则表示我们有一个用户，有一个重定向到某个路由。

现在让我们明白这一点。

注册用户非常有效，但是当我尝试使用Login

时

export function login (email, pw) {
  return firebaseAuth().signInWithEmailAndPassword(email, pw)
}

我得到了

错误：网络错误（例如超时，中断连接或已经发生了无法访问的主机。

我的网址栏变为

来自

http://localhost:3000/login

到

http://localhost:3000/login?email=anorak%40abv.bg&password=anorak97

那么为什么login（）不起作用？有什么想法吗？

Answer 1

操作应该是对象，但是您的login操作创建函数正在返回异步处理的promise。这是redux-thunk的一个很好的用例。使用该库，您可以将其更改为：

export function login (email, pw) {
  return (dispatch) => {
    firebaseAuth().signInWithEmailAndPassword(email, pw)
    .then(user => dispatch({ type: SIGNIN_SUCCESSFUL, payload: user }))
    .catch(err => dispatch({ type: SIGNIN_ERROR, payload: err })
  }
}

Answer 2

您的代码不好，您应该考虑使用

firebaseAuth().onAuthStateChanged((user) => {
  if (user) this.props.authed_true();
  else this.props.authed_false();
})

在中间件中，因为它是登录后的副作用，你可以试试这样的东西

const loginMiddleware = store => next => (action) => {
  if (action.type === GET_USER_LOGIN) {
    login(action.payload.login, action.payload.pw);
    firebaseAuth().onAuthStateChanged((user) => {
      if (user) store.dispatch(authed_true());
      store.dispatch(authed_false())
    })
  }
  return next(action);
};

export default loginMiddleware;

但这不是您的问题，很可能您的标记中只有一个元素，并且在提交后更改了网址，因此您应该尝试删除第一个

Firebase登录似乎不起作用

2 个答案: