React Native+Firestore添加文档Promise未返回问题求助

我正在使用React Native结合Expo及@react-native-firebase/firestore库，尝试向Firestore集合添加文档，但对应的Promise始终不返回，导致没有数据插入到Firestore。预期用户对象能保存到Firestore并输出日志console.log('Result:', result);，以下是我的完整代码、Firestore规则及依赖版本：

代码 #

import React, { useEffect } from 'react';
import { View, Text, Button } from 'react-native';
import firebase from '@react-native-firebase/app';
import firestore from '@react-native-firebase/firestore';

// Firebase配置
const firebaseConfig = {
  apiKey: "xxx",
  authDomain: "xxx",
  projectId: "xxx",
  storageBucket: "xxx",
  messagingSenderId: "xxx",
  appId: "xxx",
  measurementId: "xxx"
};

// 初始化Firebase
if (!firebase.apps.length) {
  console.log('Initializing Firebase');
  firebase.initializeApp(firebaseConfig);
} else {
  console.log('Firebase already initialized');
}

export default function App() {
  useEffect(() => {
    console.log('Firestore instance:', firestore());
  }, []);

  const addUser = async () => {
    try {
      console.log('Adding user...');
      const userRef = firestore().collection('Users');
      console.log('User collection reference:', userRef);

      // 尝试添加用户
      const result = await userRef.add({
        name: 'Ada Lovelace',
        age: 30,
      });

      console.log('Result:', result);
      console.log('User added!');
    } catch (error: any) {
      console.error('Error adding user: ', error);

      // HTTP错误捕获
      if (error.response) {
        console.log('Error data:', error.response.data);
        console.log('Error status:', error.response.status);
        console.log('Error headers:', error.response.headers);
      } else if (error.request) {
        console.log('Error request:', error.request);
      } else {
        console.log('Error message:', error.message);
      }
      console.log('Error config:', error.config);

      alert(`Error adding user: ${error.message}`);
    }
  };

  return (
    <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
      <Text>Add User to Firestore</Text>
      <Button title="Add User" onPress={addUser} />
    </View>
  );
}

Firestore规则 #

rules_version = '2';

service cloud.firestore {
  match /databases/{database}/documents {
    match /{document=**} {
      allow read, write: if true;
    }
  }
}

依赖版本 #

"@react-native-firebase/app": "^20.3.0",
    "@react-native-firebase/auth": "^20.3.0",
    "@react-native-firebase/firestore": "^20.3.0",
    "@react-native-firebase/messaging": "^20.3.0",

1. 替换为Expo官方Firebase集成库 #

@react-native-firebase系列库为原生React Native项目设计，在Expo托管工作流中存在兼容性问题，会导致请求挂起无响应。建议改用Expo官方的Firebase集成方案：

• 安装依赖：

npx expo install expo-firebase-core expo-firebase-firestore

• 修改代码适配Expo环境：

import React, { useEffect } from 'react';
import { View, Text, Button } from 'react-native';
import { initializeApp } from 'firebase/app';
import { getFirestore, collection, addDoc } from 'firebase/firestore';
import { getFirebaseApp } from 'expo-firebase-core';

// Firebase配置
const firebaseConfig = {
  apiKey: "xxx",
  authDomain: "xxx",
  projectId: "xxx",
  storageBucket: "xxx",
  messagingSenderId: "xxx",
  appId: "xxx",
  measurementId: "xxx"
};

// 初始化Firebase
let app;
if (!getFirebaseApp()) {
  app = initializeApp(firebaseConfig);
} else {
  app = getFirebaseApp();
}
const db = getFirestore(app);

export default function App() {
  useEffect(() => {
    console.log('Firestore instance:', db);
  }, []);

  const addUser = async () => {
    try {
      console.log('Adding user...');
      const userRef = collection(db, 'Users');
      console.log('User collection reference:', userRef);

      // 尝试添加用户
      const result = await addDoc(userRef, {
        name: 'Ada Lovelace',
        age: 30,
      });

      console.log('Result:', result);
      console.log('User added!');
    } catch (error) {
      console.error('Error adding user: ', error);
      alert(`Error adding user: ${error.message}`);
    }
  };

  return (
    <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
      <Text>添加用户到Firestore</Text>
      <Button title="添加用户" onPress={addUser} />
    </View>
  );
}

2. 验证基础配置与网络 #

• 核对firebaseConfig中的projectId是否与Firebase控制台项目ID完全一致，避免配置错误导致请求失败。
• 确认设备网络正常，能够访问Firebase服务（可尝试访问Firebase控制台验证网络连通性）。

3. 调试请求超时问题 #

在原代码中添加超时机制，确认请求是否真的处于挂起状态：

const addUser = async () => {
  try {
    console.log('Adding user...');
    const userRef = firestore().collection('Users');
    console.log('User collection reference:', userRef);

    // 设置10秒超时
    const result = await Promise.race([
      userRef.add({ name: 'Ada Lovelace', age: 30 }),
      new Promise((_, reject) => setTimeout(() => reject(new Error('请求超时')), 10000))
    ]);

    console.log('Result:', result);
    console.log('User added!');
  } catch (error: any) {
    console.error('Error adding user: ', error);
    alert(`Error adding user: ${error.message}`);
  }
};

内容的提问来源于stack exchange，提问作者faguilera85