如何为 Codelab 配置 Firebase SDK？

Question

根据我的理解，我已经遵循了 FriendlyChat 应用程序的代码实验室教程中的每条说明。

我将通过单击控制台中的Add firebase to your web app图标生成的代码粘贴到索引页面中。

但是，当我运行firebase serve并在localhost:5000加载页面时，我收到一条警报，告诉我我尚未配置和导入 Firebase SDK。

我究竟如何配置和导入 SDK？

Answer 1

您只需粘贴以下初始化代码片段：Firebase 控制台 > 概览 > 将 Firebase 添加到 web-start 文件夹中 index.html 文件中的 Web 应用程序。

Answer 2

我发现上面的答案有点不清楚，但设法用这种方法解决了它，以防它对任何人有帮助：

• 转到 Firebase 主页
• 右上角（在您的个人资料图片旁边）您会找到“转到控制台”，点击它
• 在那里你会找到你的“FriendlyChat”项目，点击它
• 在左侧的 Firebase 图标下，您会找到一个齿轮图标（设置），转到那里
• 向下滚动，您将找到一个包含您的网络应用程序的窗口
• 有一个标题“SDK 设置和配置”
• 如果您还没有，请确保在 index.html 中包含“自动”代码。 它看起来类似于：

<script src="/__/firebase/8.6.3/firebase-app.js"></script>

<!-- TODO: Add SDKs for Firebase products that you want to use
     https://firebase.google.com/docs/web/setup#available-libraries -->
<script src="/__/firebase/8.6.3/firebase-analytics.js"></script>

<script src="/__/firebase/init.js"></script>

• 如果还没有，请确保在 index.html 中包含“CDN”代码（记住将其放在任何 firebase 脚本调用之前）。 它看起来像这样：

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

<!-- TODO: Add SDKs for Firebase products that you want to use
     https://firebase.google.com/docs/web/setup#available-libraries -->
<script src="https://www.gstatic.com/firebasejs/8.6.3/firebase-analytics.js"></script>

<script>
  // Your web app's Firebase configuration
  // For Firebase JS SDK v7.20.0 and later, measurementId is optional
  var firebaseConfig = {
    apiKey: "...",
    authDomain: "...",
    projectId: "...",
    storageBucket: "...",
    messagingSenderId: "...",
    appId: "...",
    measurementId: "..."
  };
  // Initialize Firebase
  firebase.initializeApp(firebaseConfig);
  firebase.analytics();
</script>

注意：如果您不包括分析，我想您不应该包括分析脚本（只需复制并粘贴网站上提供给您的代码）

这阻止了警报显示给我。