Question

这在开发中工作得很好，但是当我部署了很多我的函数时。例如，我有一个向数据库添加数据的表单，但是当我提交数据时，它只刷新页面，但数据永远不会进入数据库。

onSubmit = () => {
    firebase.auth().onAuthStateChanged((user) => {
        const { phoneNumber, points } = this.state;
        let pointsToAdd = Number(points);
        if(user) {
            const docRef = database.collection('users').doc(user.uid).collection('customers').doc(phoneNumber);
            docRef.set({
                points: pointsToAdd
            })
            .then(() => {
                console.log('success');
            })
            .catch((error) => {
                console.log(error);
            });
        } else {
            window.location.href = '/';
        }
    });
}

Answer 1

如果它正在刷新，则用户变量为null。因此，您不得登录已部署的版本。只需先添加一个firebase登录功能，然后再调用它！

https://firebase.google.com/docs/auth/web/password-auth

Answer 2

我猜你还没有登录非开发环境，当前的实现只会在找不到用户时重定向。

作为对当前提交处理程序的反馈：我认为您希望在组件安装时监听authStateChanged，而不是在调用提交处理程序时。相应地更新状态，并在到达正确的文档时使用状态中的用户。

例如：

componentDidMount () {
  this.unsubscribe = firebase.auth().onAuthStateChanged((user) => {
    if (user) this.setState({ user })
    else window.location.href = '/'
  })
}

componentWillUnmount () {
  this.unsubscribe() // don't forget to unsubscribe when unmounting!
}

onSubmit = () => {
  const { phoneNumber, points, user } = this.state;
  let pointsToAdd = Number(points);

  database.collection('users').doc(user.uid).collection('customers').doc(phoneNumber)
    .set({
      points: pointsToAdd
    })
    .then(() => {
      console.log('success');
    })
    .catch((error) => {
      console.log(error);
    });
}

为什么部署中的表单提交会破坏（React + Firestore）？

2 个答案: