Search code examples
firebase-cloud-messagingbrowser-extensionchrome-extension-manifest-v3

Browser Extension Insecure CSP value "https://www.gstatic.com/" in directive 'script-src'


I am trying to integrate Firebase cloud messaging into my chrome extensions it throw the error

content_security_policy.extension_pages': Insecure CSP value "https://www.gstatic.com/" in directive 'script-src'. Could not load manifest.

extension error

Below is manifest json file and i am using manifest version as 3:

{
  "name": "Getting Started Example",
  "description": "Build an Extension!",
  "version": "1.0",
  "manifest_version": 3,
  "background": {
    "service_worker": "background.js"
  },
  "permissions": ["storage", "activeTab", "scripting"],
   "action": {
    "default_popup": "popup.html",
    "default_icon": {
      "16": "/images/get_started16.png",
      "32": "/images/get_started32.png",
      "48": "/images/get_started48.png",
      "128": "/images/get_started128.png"
    }
  },
  "icons": {
    "16": "/images/get_started16.png",
    "32": "/images/get_started32.png",
    "48": "/images/get_started48.png",
    "128": "/images/get_started128.png"
  },
    "content_scripts": [
    {
    "matches": ["<all_urls>"],
     "css": ["my-styles.css"],
     "js": ["content-script.js"]
        
    }
    ],
    "content_security_policy":{  "extension_pages": "script-src 'self' https://www.gstatic.com/ https://*.firebaseio.com https://www.googleapis.com; object-src 'self'; connect-src 'self' wss://*.firebaseio.com;" },
    "web_accessible_resources": [
    {
    "resources": [
    
    ],
    "matches": [
                "<all_urls>"
            ]   
    }

    ]


}

How can i integrate firebase cloud messaging into my extension?


Solution

  • Download a firebase lib into extension & imported as a local file. Not a perfect fix, but a way to go:

    <html>
      <head>
        <meta charset="utf-8"/>
        <script src="firebase-compat-9-6-0.js"></script>
        ...
      </head>
      <body>
        ...
      </body>
    </html>