chrome扩展中的firebase答案

【问题标题】：firebase in chrome extensionchrome扩展中的firebase
【发布时间】：2017-10-15 03:02:57
【问题描述】：

我已将其放入清单中：

"content_security_policy":"script-src 'self' https://www.gstatic.com/ https://*.firebaseio.com https://www.googleapis.com; object-src 'self'"

在popup.html中：

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

但是每次我都没有定义firebase变量（控制台这么说）

【问题讨论】：

标签： firebase google-chrome-extension

【解决方案1】：

您需要在 javascript 中使用您的 api 配置初始化 firebase

var config = {
apiKey: "AIzaSyAqFmfmNWi95nt6TemvBMjPepulwV5WyZg",
authDomain: "define-web-ext.firebaseapp.com",
databaseURL: "https://define-web-ext.firebaseio.com",
projectId: "define-web-ext",
storageBucket: "",
messagingSenderId: "217235378805"
};
firebase.initializeApp(config);

如果您使用的是 npm 包，请根据您的要求获取 firebase 包框架。

【讨论】：

【解决方案2】：

您可以参考这个related SO post。您遇到该错误可能是因为您使用 document.body.append(...) 注入 Firebase 库。然后，您尝试从扩展程序内部访问 Firebase 库，但 chrome 扩展程序被沙盒化远离网页。您将 Firebase 库注入到网页中，因此您的扩展程序无法直接访问它。您可以尝试下载 Firebase 库 JavaScript，并将 Firebase 代码添加到您的 chrome 扩展清单中。

还说在 GitHub 中有一个带有 Firebase 的示例 chrome 扩展，您可以参考：https://github.com/firebase/firebase-chrome-extension。

【讨论】：