如果在head标记外使用，firebase javascript会显示错误。
如果在head标记外使用，firebase javascript会显示错误。
提问于 2022-10-04 20:39:39
我正在使用Firebase来处理Firestore数据库。我只是通过方法document在collection中插入setDoc。如果我在head标记中使用它，它就能工作。但是如果我在head标记之外使用它，它会显示错误。完整的守则如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Firebase app</title>
<script type="module">
import { initializeApp } from "https://www.gstatic.com/firebasejs/9.10.0/firebase-app.js";
import { getFirestore,collection, addDoc, getDocs, doc, setDoc } from "https://www.gstatic.com/firebasejs/9.10.0/firebase-firestore.js";
const firebaseConfig = {
apiKey: ".....",
authDomain: "......firebaseapp.com",
projectId: "flutter0000",
storageBucket: "flutter777.appspot.com",
messagingSenderId: "8888115",
appId: "1:9888......"
};
const app = initializeApp(firebaseConfig);
const db = getFirestore(app);
await setDoc(doc(db, "cities", "Cus11"), {
name: "111Los Angeles",
state: "CA",
country: "USA"
});
</script>
</head>
<body>
<h1>FIREBASE APP</h1>
<!-- <script type="module"> -->
<script>
await setDoc(doc(db, "cities", "Cus222"), {
name: "111Los Angeles",
state: "CA",
country: "USA"
});
</script>
</body>
</html>setDoc方法在head标记中工作。但是在body标记中，setDoc在控制台中显示了以下错误：
Uncaught SyntaxError: await is only valid in async functions, async generators and modules test.php:50:2如果我使用<script type="module">而不是仅在body标记内使用<script>，控制台中将显示以下错误：
Uncaught ReferenceError: setDoc is not defined如何使代码在body标记内工作，即在head标记之外？
回答 1
Stack Overflow用户
发布于 2022-10-07 23:24:06
当在模块中声明变量时，它们不会自动被全局声明，所以您必须自己将它们附加到窗口对象。
因此，您有两个选项，将每个firebase方法附加到窗口中；或者更好的选项是创建调用这些firebase方法的特定函数。我给你举个例子：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Firebase app</title>
<script type="module">
import { initializeApp } from "https://www.gstatic.com/firebasejs/9.10.0/firebase-app.js";
import { getFirestore, collection, addDoc, getDocs, doc, setDoc } from "https://www.gstatic.com/firebasejs/9.10.0/firebase-firestore.js";
const firebaseConfig = {
apiKey: ".....",
authDomain: "......firebaseapp.com",
projectId: "flutter0000",
storageBucket: "flutter777.appspot.com",
messagingSenderId: "8888115",
appId: "1:9888......"
};
const app = initializeApp(firebaseConfig);
const db = getFirestore(app);
window.storeCities = async function (name, state, country) {
await setDoc(doc(db, "cities", "Cus11"), {
name,
state,
country
});
}
await storeCities("111Los Angeles", "CA", "USA")
</script>
</head>
<body>
<h1>FIREBASE APP</h1>
<script type="module">
await storeCities("111Los Angeles", "CA", "USA")
</script>
</body>
</html>注意，这两个脚本都是“模块”类型。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/73953421
复制相关文章
相似问题
腾讯云开发者
