Google登录Chrome扩展错误,如何不违反CSP?

时间:2017-03-23 19:15:48

标签: html json firebase google-chrome-extension

我正在尝试创建一个基本的Chrome扩展程序,使用Firebase登录谷歌,但我一直收到此错误:

Refused to load the script 'https://apis.google.com/js/api.js?onload=__iframefcb441380' because it violates the following Content Security Policy directive: "script-src 'self' https://www.gstatic.com/firebasejs/3.7.3/firebase.js".

这是我的popup.html(您可以忽略登录和退出按钮下的所有内容):

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

  </head>

  <body>

    <div id="banner">
        <div id="banner-content">
        Frogger
        </div>

        <div id="banner-button">
          <button id="gSign">Google Signin</button>
          <button id="gOut">Google Signout</button>
        </div>
      </div>


    <div class="container" style="display: none;">

      <input id="txtEmail" type="email" placeholder="Email">
      <input id="txtPassword" type="password" placeholder="Password">

      <button id="btnLogin" class="btn btn-action">
        Log In
      </button>

      <button id="btnSignUp" class="btn btn-secondary">
        Sign Up
      </button>

      <button id="btnLogOut" class="btn btn-action hide">
        Log Out
      </button>
    </div>

    <script src="app.js"></script>

  </body>

</html>

这是我的app.js:

(function(){

  // Initialize Firebase
  var config = {
    apiKey: "My key is here",
    authDomain: "my domain is here",
    databaseURL: "I have all this filled out properely",
    storageBucket: "bucket",
    messagingSenderId: "senderId"
  };
  firebase.initializeApp(config); 

  function googleSignin() {
     firebase.auth()

     .signInWithPopup(provider).then(function(result) {
        var token = result.credential.accessToken;
        var user = result.user;

        console.log(token)
        console.log(user)
     }).catch(function(error) {
        var errorCode = error.code;
        var errorMessage = error.message;

        console.log(error.code)
        console.log(error.message)
     });
   }

   function googleSignout() {
     firebase.auth().signOut()

     .then(function() {
        console.log('Signout Succesfull')
     }, function(error) {
        console.log('Signout Failed')
     });
 }

  document.getElementById("gSign").addEventListener("click", e=>{
    firebase.auth()

    .signInWithPopup(provider).then(function(result) {
       var token = result.credential.accessToken;
       var user = result.user;

       console.log(token)
       console.log(user)
    }).catch(function(error) {
       var errorCode = error.code;
       var errorMessage = error.message;

       console.log(error.code)
       console.log(error.message)
    });

  });



}())

最后这是我的manifest.json(我认为我做错了):

{
  "manifest_version": 2,

  "name": "Getting started example",
  "description": "This extension shows a Google Image search result for the current page",
  "version": "1.0",

  "content_security_policy": "script-src 'self' https://www.gstatic.com/firebasejs/3.7.3/firebase.js; object-src 'self'",
  "browser_action": {
    "default_popup": "popup.html"
  },
  "permissions": [
    "activeTab",
    "https://www.gstatic.com/firebasejs/3.7.3/firebase.js"

  ]
}

注意:请尝试用我可以做的具体来解决这个问题,以防止发生此错误。我看过很多不同的帖子和网站但是它们不够具体,他们给的都是阅读链接。

编辑:

我想出了如何将链接列入白名单,但随着我继续列入白名单,越来越多的链接不断出现,说它们违反了CSP。所以我的问题是;有没有办法知道我需要列入白名单的所有链接?我怎样才能做到这一点?感谢。

0 个答案:

没有答案