Flutter web：Firestore 在運行調試模式下工作，在 bilud 發布模式下不工作

Question

**我正在嘗試使用 firestore 更新數據，它在手機上運行良好並運行 web 但是當我進行構建並將文件上傳到我的服務器時它不起作用 - index.html >> **

<script type="module">
          import { initializeApp } from "https://www.gstatic.com/firebasejs/9.9.3/firebase-app.js";
          import { getFirestore, collection, getDocs } from 'https://www.gstatic.com/firebasejs/9.9.3/firebase-firestore.js';
        // TODO: Add SDKs for Firebase products that you want to use
        // https://firebase.google.com/docs/web/setup#available-libraries
        
        // Your web app's Firebase configuration
        // For Firebase JS SDK v7.20.0 and later, measurementId is optional
        const firebaseConfig = {
          apiKey: -----,
          authDomain: ------,
          projectId: ------,
          storageBucket: ------,
          messagingSenderId: ------,
          appId: ------,
          measurementId: ------
        };
        
        // Initialize Firebase
        const app = initializeApp(firebaseConfig);
        const db = getFirestore(app);
        </script>

更新 Firestore 代碼>>

FirebaseFirestore.instance
            .collection('orderDetails')
            .doc(id)
            .update({
          'status': status,
        }).catchError((e) {
          print(e);
        });

並在瀏覽器控制台中收到此錯誤

Refused to load the script 'https://www.gstatic.com/firebasejs/9.9.3/firebase-app.js' because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-inline' 'unsafe-eval' http://myserverurl.com https://myserverurl.com http://www.myserverurl.com https://www.myserverurl.com". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.

還有這個錯誤

VM86:3 Uncaught (in promise) TypeError: Failed to fetch dynamically imported module: https://www.gstatic.com/firebasejs/9.9.0/firebase-app.js

Answer 1

將文件夾 web 中的 index.html 更新為：

<script src="https://www.gstatic.com/firebasejs/8.10.1/firebase-app.js"></script>
        <script src="https://www.gstatic.com/firebasejs/7.17.1/firebase-firestore.js"></script>
        <script src="https://www.gstatic.com/firebasejs/8.4.1/firebase-messaging.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.5/firebase-analytics.js"></script>
        <script src="https://maps.googleapis.com/maps/api/js?key=yourKey"></script>
        <script>
        
        // TODO: Add SDKs for Firebase products that you want to use
        // https://firebase.google.com/docs/web/setup#available-libraries
        
        // Your web app's Firebase configuration
        // For Firebase JS SDK v7.20.0 and later, measurementId is optional
        const firebaseConfig = {
                  apiKey: -----,
                  authDomain: ------,
                  projectId: ------,
                  storageBucket: ------,
                  messagingSenderId: ------,
                  appId: ------,
                  measurementId: ------
                };
        
        /// Initialize Firebase
          firebase.initializeApp(firebaseConfig);
          firebase.analytics();
        </script>

and on your server Edit your file .htaccess if you use set Header set Content-Security-Policy "script-src 'self' 'unsafe-inline' 'unsafe-eval' https://example.com remove it