san
san

Reputation: 333

Chrome Extension CSP - unsafe-eval and unsafe-inline in 3rd party js library and stylesheet

Browser - Chrome Version 85.0.4183.102

There are lot of threads around this topic but I could not find what is the safest and correct way to deal with 3rd party libraries. I am using kendo grid (jQuery) in my chrome extension.. it has "unsafe-eval" and "unsafe-inline"... unless I set the below entry in manifest.json its not working.

"content_security_policy": "font-src data:; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-eval'; object-src 'self';"

Since its not safest practice.. how can I bypass this with hash or nonce.

Note: The Kendo library is downloaded and referred from local machine. (No CDN references)

'unsafe-line'

When I remove 'unsafe-inline' as expected its giving out 5 errors in my case and providing 5 different sha-256 hashes. I replaced 'unsafe-inline' with 5 hashes but still getting the same error.

Below is the error when I tried only with 1 hash.

Refused to apply inline style because it violates the following Content Security Policy directive: "style-src 'self' 'sha256-lzhPGNqxpwmBda/ftMrdga7dSTDWPq2rpjz66R6TVFw='". Either the 'unsafe-inline' keyword, a hash ('sha256-lzhPGNqxpwmBda/ftMrdga7dSTDWPq2rpjz66R6TVFw='), or a nonce ('nonce-...') is required to enable inline execution.

'unsafe-eval'

When I remove 'unsafe-eval' as expected giving out errors with no generated hash to replace.

'font-src data:'

yet to attempt to bypass.

I even tried nonce but did not work.

am I missing something? or do I need to live with 'unsafe-inline' and 'unsafe-eval'. If yes, what is the potential risk? I am planning to release this extension to public.

EDIT: I tried sandbox as suggested below.

Here is what I did.

index.html

<html>
    <head>
        <link href="css/iframe.css" rel="stylesheet">
    </head>
    <body>
        <iframe id="iframe" src="sandbox.html"></iframe>
    </body>
</html>

sandbox.html has kendo reference <script src="js/kendo.all.min.js"></script>

Here is the manifest.json change

"sandbox": {
"pages:": [
  "sandbox.html"
]},"content_security_policy": "sandbox allow-scripts allow-same-origin allow-popups;"

I am still getting errors with kendo. Any suggestions?

Upvotes: 1

Views: 4160

Answers (2)

Goutham J.M
Goutham J.M

Reputation: 2194

For Chrome Manifest 3 you can add

{
  "content_security_policy":{
  "extension_page": "script-src 'self' 'wasm-unsafe-eval'; object-src 'self'" ,
  "sandbox": "extension_page": "script-src 'self' 'wasm-unsafe-eval'; object-src 'self'" ,
  }               
}

Upvotes: -1

granty
granty

Reputation: 8496

'unsafe-inline' in scripts and styles

Chrome unintentionally misleads you with hashes for inline styles. The same is with hashes for inline scripts:

  1. <script>...</script> consiedres as inline and can be allowed with 'nonce-value' or/and 'hash-value' tokens.
  2. <tag onEvent='event_handler_script'> and <a href='javascript:click_handler_script'> both considers as inlnie script but cannot be allowed by 'nonce-value' or/and 'hash-value' tokens. But Chrome calculates sha256 for them, because it prepares to implement 'unsafe-hashes' token (spec section is not normative so implementation is delayed support is implemented already).

Therefore is case (1) you could easily ged rid of 'unsafe-inline', in case (2) - you need to modify code first.

'unsafe-eval' in scripts

Content Security Policy spec does not provide way to allow unsafe scripts constructions via 'nonce/hash' tokens. Changes of the script code will be required, in some cases - purely "cosmetic".

CSP considers as eval-constructs:

  • eval()
  • setTimeout('string')
  • setInterval('string')
  • Function()
  • setImmediate()
  • execScript()

Note that setTimeout()/setInterval() are "eval" only when callback function passed as a string. If callback is an anonymous funct or "function by name" - those not fall under eval. In this case, you can easily get rid of eval without changing the logic of the script.

Upvotes: 2

Related Questions