如何在我自己的 chrome 扩展中使用 firebase auth

Question

我想使用 Angular 创建简单的 chrome 扩展。我创建了一个主页，用户可以通过谷歌帐户登录。这很容易，因为我使用了 AngularFire2。当我想在我自己的扩展的上下文菜单中使用 firebase 时出现问题：f.e:

context-menu.js

var clickedFunc = function(info, tab) {
    console.log(info, tab)
    alert('click');
};

var parent = chrome.contextMenus
  .create(
    {
      "title": "check click",
      "contexts": ["selection"],
      "onclick": function(info, tab) {
        clickedFunc(info);
      }
    }
  );

这些代码工作正常，但如果我尝试以这种方式在上下文菜单中使用 firebase：

context-menu.js

var firebase = require('firebase/app');

var config = {
  apiKey: 'secret',
  authDomain: 'secret', // you know what I mean
};

var app = firebase.initializeApp(config);
var clickedFunc = function(info, tab) {
    console.log(info, tab)
    alert(firebase.app().name);
};

var parent = chrome.contextMenus
  .create(
    {
      "title": "check click",
      "contexts": ["selection"],
      "onclick": function(info, tab) {
        clickedFunc(info);
      }
    }
  );

chrome 扩展程序安装在我的浏览器中。 我可以打开主页，但没有显示原始上下文菜单。谁能帮帮我？

我添加了其他文件的其他部分，这会产生错误：

ma​​nifest.json 的一部分

  "background": {
    "persistent": true,
    "scripts": ["home.js", "context-menu.js", "firebase.js"]
  },
  "permissions": [
    "tabs",
    "contextMenus"
  ],
  "content_security_policy": "script-src 'self' 'unsafe-eval'; https://cdn.firebase.com https://*.firebaseio.com; object-src 'self'",

Answer 1

您需要下载 firebase.js 并将其放入您的扩展程序中，然后使用相对 url 加载它。不允许您的扩展程序访问外部脚本。