尝试加载 firebase 时与 Electron 的内容安全冲突

Content Security conflictions with Electron when trying to load firebase

我正在尝试将必要的库从 firebase 加载到电子项目中,目前 header 看起来像这样:

    <head>
    <meta charset="UTF-8">
    <!-- https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP -->
    <meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'">
    <meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval' http://cdnjs.cloudflare.com ">
    <meta http-equiv="X-Content-Security-Policy" content="default-src 'self'; script-src 'self'">
    <title>Hello World!</title>
    <link rel='stylesheet' type='text/css' href="./css/index-style.css">
    <!-- The core Firebase JS SDK is always required and must be listed first -->
    <script src="https://www.gstatic.com/firebasejs/8.2.9/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.2.9/firebase-analytics.js"></script>
    <!--Analytics-->
    <script src="https://www.gstatic.com/firebasejs/8.2.9/firebase-auth.js"></script>
    <!--Authentication-->
    <script src="https://www.gstatic.com/firebasejs/8.2.9/firebase-firestore.js"></script>
    <!--Firestore-->
    <!--<script src="https://www.gstatic.com/firebasejs/8.2.9/firebase-performance.js"></script>
    <!--Performance Monitoring-->-->
    <!--<script src="https://www.gstatic.com/firebasejs/8.2.9/firebase-messaging.js"></script>
    <!--Cloud Messaging-->-->

    <script>
        // Your web app's Firebase configuration
        // For Firebase JS SDK v7.20.0 and later, measurementId is optional
        var firebaseConfig = {
            apiKey: "AIzaSyASwpwU4gScouDb52SgtITzJGlhVlUaAeM",
            authDomain: "bindr-b1182.firebaseapp.com",
            projectId: "bindr-b1182",
            storageBucket: "bindr-b1182.appspot.com",
            messagingSenderId: "834172641970",
            appId: "1:834172641970:web:9ff63deccdc2ac41b7dfab",
            measurementId: "G-26JDS2433R"
        };
        // Initialize Firebase
        firebase.initializeApp(firebaseConfig);
        firebase.analytics();
    </script>

    <script src="../../src/model/database/dbManager.js"></script>
</head>

但是,当我尝试 运行 并测试它们是否正常工作时,我收到以下错误消息:

我对 Electron、JavaScript 和 Firebase 很陌生,所以我不确定我哪里出错了。预先感谢您的帮助。

您有两个 content-security-policy 元标记。最初您应该删除其中一个,除非您有某些特定原因需要重复 content-security-policy,因为任何内容都必须通过所有 CSP。然后你需要将 www.gstatic.com 添加到 script-src 指令中。

还要注意 content-security-policy 作为响应插入 header,因为某些框架可能会将 CSP 作为 header 插入。您可能还想将元标记移动到响应 headers,因为元标记不支持 CSP 的所有指令。