Question

这是我的Javascript代码。只需从firebase文档中复制

<script src="https://www.gstatic.com/firebasejs/5.4.2/firebase.js"/></script>
<script src="https://www.gstatic.com/firebasejs/5.3.0/firebase-firestore.js"></script>
<script>
  // Initialize Firebase
    var config = {
        apiKey: ".",
        authDomain: ".",
        databaseURL: ".",
        projectId: ".",
        storageBucket: ".",
        messagingSenderId: ".[enter image description here][1]"
    };
  firebase.initializeApp(config);

    // Initialize Cloud Firestore through Firebase

    var db = firebase.firestore();
    function submitCountry(){
    console.log('in funtion');
    db.collection("cities").doc("asdasLA").set({
        name: "Los Angeles",
        state: "CasdasA",
        stasdaate: "CasdasdasA",
        stasaasddaate: "CAasd",
        country: "USA"
    })
    .then(function() {
        console.log("Document successfully written!");
    })
    .catch(function(error) {
        console.error("Error writing document: ", error);
    });
}
</script>

当我刷新页面时，它会显示未捕获的错误。

{代码：“应用程序/重复服务”，消息：“ Firebase：Firebase服务   已注册的名为“ firestore”（应用程序/复制服务）。”，名称：   “ firestore”，堆栈：“ firestore：Firebase：名为Firebase的服务   'fires…m / firebasejs / 5.3.0 / firebase-firestore.js：1：326255“} firebase @   index.esm.js：17591（匿名）@ index.esm.js：41 index.esm.js：17591

未捕获的错误：无法实例化firebase-firestore-请确保   首先加载firebase-app.js。

在单击我的保存按钮后，它显示以下错误。

当我在没有任何JS或Bootstrap的简单项目上使用相同的代码时，它可以正常工作，但与我在带有Bootstrap的真实项目中放置的代码相同，则会显示错误

[干预]检测到慢速网络。请参阅以获取更多详细信息。后备字体将在加载时使用：

Answer 1

这样做

<script src="https://www.gstatic.com/firebasejs/5.4.2/firebase.js"/></script>
<script src="https://www.gstatic.com/firebasejs/5.3.0/firebase-firestore.js"></script>

您两次加载“ firestore” Firebase服务，请参阅文档：https://firebase.google.com/docs/web/setup

您应该这样做

<script src="https://www.gstatic.com/firebasejs/5.4.2/firebase.js"></script>

或

<!-- Firebase App is always required and must be first -->
<script src="https://www.gstatic.com/firebasejs/5.4.2/firebase-app.js"></script>

<!-- Add additional services that you want to use -->
<script src="https://www.gstatic.com/firebasejs/5.4.2/firebase-firestore.js"></script>

还要注意，您的代码中混合使用了多种版本（即5.4.2和5.3.0）。很有可能要避免。

在下面的注释中，为了检查其是否正确写入了数据库，请按如下所示修改您的代码，然后打开HTML页面（set()方法将自动触发）

<script src="https://www.gstatic.com/firebasejs/5.4.2/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/5.4.2/firebase-firestore.js"></script>

<script>
  // Initialize Firebase
    var config = {
        apiKey: ".",
        authDomain: ".",
        databaseURL: ".",
        projectId: ".",
        storageBucket: ".",
        messagingSenderId: ".[enter image description here][1]"
    };
    firebase.initializeApp(config);

    // Initialize Cloud Firestore through Firebase

    var db = firebase.firestore();

    db.collection("cities").doc("asdasLA").set({
        name: "Los Angeles",
        state: "CasdasA",
        stasdaate: "CasdasdasA",
        stasaasddaate: "CAasd",
        country: "USA"
    })
    .then(function() {
        console.log("Document successfully written!");
    })
    .catch(function(error) {
        console.error("Error writing document: ", error);
    });
}
</script>

在Firebase Firestore中保存数据时在控制台上出现错误

1 个答案: