在 Expo 中使用 Firebase：如何正确设置和测试 Firebase 配置？

Question

我正在尝试做一个非常简单的可以保存到 firebase 的 expo react native 项目。

按照此处的指南操作：https://docs.expo.io/versions/latest/guides/using-firebase.html

第一步：如何正确设置这些值？在哪里可以找到它们？

const firebaseConfig = {
  apiKey: "<YOUR-API-KEY>",
  authDomain: "<YOUR-AUTH-DOMAIN>",
  databaseURL: "<YOUR-DATABASE-URL>",
  storageBucket: "<YOUR-STORAGE-BUCKET>"
};

我很难弄清楚第 1 步的确切细节，所以我想分享一些指南，以及一个代码来轻松测试第 2 步。

Answer 1

我会告诉你，在哪里可以使用字段旁边的数字找到每个值，然后提供代码来测试它。

const firebaseConfig = {
    projectId: "", // 0
    apiKey: "", // 1
    authDomain: "", // 2
    databaseURL: "", // 3
    storageBucket: "", // 4
    messagingSenderId: "", // 5
};

以下所有步骤都从项目主页开始（可以通过打开您的项目 here 来访问）。

0, 1:
projectId 和 apiKey 都可以通过单击“概述”选项卡旁边的 齿轮图标 找到，然后项目设置。在 常规选项卡 中，您将看到项目 ID 和 Web Api 密钥。

2:
authDomain 是 <projectId>.firebaseapp.com.

3:
databaseURL 可以通过单击“数据库”选项卡找到。应该是：https://<projectId>.firebaseio.com/.

4:
storageBucket 可以通过单击“存储”选项卡找到。应该是：gs://<projectId>.appspot.com/.

5:
messagingSenderId 可以通过单击概述选项卡旁边的 齿轮图标 找到， 然后是项目设置。在云消息选项卡中，您将看到发件人 ID。

这些都设置好后，可以用下面的代码进行测试：

import React from 'react';
import { StyleSheet, View, Button } from 'react-native';
import * as firebase from 'firebase';

// Initialize Firebase
const firebaseConfig = {
    // ...
};
firebase.initializeApp(firebaseConfig);

export default class App extends React.Component {
  render() {
    return (
      <View style={styles.container}>
        <Button
          onPress={() => updateDB(1, 10, 20)}
          title="Update DB on Firebase"
        />
      </View>

    );
  }
}

function updateDB(userID, fieldValue1, fieldValue2) {
  firebase.database().ref(userID).set({
    field1: fieldValue1,
    field2: fieldValue2,
  });
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

在 Expo 中使用 Firebase：如何正确设置和测试 Firebase 配置？

Using Firebase with Expo: how to properly setup and test Firebase config?

firebase

expo