如何在 Chrome Extension Manifest.json 中设置内容安全策略以使 Firebase 工作

Question

I made a Chrome Extension and used Firebase to collect data into a database. It worked fine for some time, but it seems there were some changes to Chrome. Now I get the following error in the javascript console when using Inspect Element on my Extension:

Refused to load the script ' https://(myID).firebaseio.com/(otherprivatedata) ' because it violates the following Content Security Policy directive: "script-src 'self' chrome-extension-resource:".

This script is written at firebase.js:171, it's not script that I added.

I attempted to follow this guide and add the "content_security_policy" tag to my manifest.json as instructed: https://github.com/firebase/firebase-chrome-extension

I added the following line to my manifest.json as instructed:

"content_security_policy": "script-src 'self' https://cdn.firebase.com https://*.firebaseio.com; object-src 'self'"

However when I add this line, I now get an error when trying to load my script in chrome://extensions

Error Loading Extension

Failed to load extension from: ~\XXX\my_ext

Manifest is not valid JSON. Line: 14, column: 5, Syntax error.

And it highlights the line I just added above (content_security_policy). What am I doing wrong? It seems anything after "content_security_policy" is completely refused by Chrome.

Even when I try the sample code from Google, it doesn't work. developer.chrome.com/extensions/contentSecurityPolicy

"content_security_policy": "script-src 'self' https://example.com; object-src 'self'"

How can I set the content_security_policy in order for Firebase to work in an Extension?

(My firebase.jp is already downloaded and packaged in with my Extension since Chrome won't let me call it as remote.)

Answer 1

Yep, thanks rsanchez... totally forgot a comma...

...   
  "options_page": "option.html",
  "manifest_version": 2, <- THIS COMMA
  "content_security_policy": "script-src 'self' https://cdn.firebase.com https://*.firebaseio.com; object-src 'self'"
}

Works now, thanks for your help!

Answer 2

Update 2022

Manifest V3 has changed the way content security policy is specified. Please have a look at the doc . So according to V3, the above policy should be now be specified in this manner:

{
  ...
  "manifest_version": 3,
  "content_security_policy": {
    "extension_pages": "script-src 'self' https://cdn.firebase.com https://*.firebaseio.com; object-src 'self'"
  }
  ...
}