Chrome extension Content Security Policy directive error

Question

I\'m trying to make radio stream chrome extension but there is a problem. When I run my script in browser like normal JS+HTML+CSS it works, but when I try runing it like Chr

Answer 1

Adding CSP in manifest.json file removes the error. It worked for my react app. I guess missing ' , ' is the issue for your code, otherwise add the below line and then try.

"csp": "script-src 'self' 'unsafe-inline'; object-src 'self'"

content security policy

Answer 2

I know I'm a bit late to this, but based on OP's comments to Xan's answer, another component of solving the issue would be to adjust the AJAX call that is implied.

I was getting the same error and adjusted my API call to be:

dataType: 'json'

instead of:

dataType: 'jsonp'

(Solved the issue, granted, one will still need to remove any inline scripting.)

Answer 3

For me, the reason is that I'm using an older version (such as v1.7) of jQuery that has CSP problems, choose a new version (v2.1.3).

Answer 4

Your problems are as follows:

1. Chrome CSP forbids inline code, and this is not subject to override. Your 'unsafe-eval' does not address the issue, and 'unsafe-inline' that would've helped will be ignored by Chrome.

   You need to get rid of inline code:

   <script>$(function(){$("#radioplayere").plate({playlist: [{file:"http://RADIO_STATION_STREAM_URL/;"}], phpGetter: "http://hostingshoutcast.com/stream/plate/php/plate.php"});});</script>
   

   This needs to be moved in a js file.

2. There is a typo in your manifest.json, you forgot a comma:

   "version": "1.0",
   

   In general, using a JSON validator can help you catch those errors.