FEAT: Support Content-Security-Policy

[aimeos]

To reduce the possible attack surface if the editor is used in "hostile" environments (e.g. in SaaS platforms) support for CSP is required. This will also prevent problems like https://github.com/artf/grapesjs/issues/3082

At the moment, the only problem that prevents effective CSP rules is the use of new Function() in the GrapesJS code, which requires a CSP rule of unsafe-eval.

Is there a different way to implement that?

[artf]

mmm I'm not sure exactly how I'm able to fix it and what do you mean by is the use of new Function() in the GrapesJS code as there is no such a thing in the source?

[aimeos]

Found out that it's in the dist files due to underscore.js template() method which uses new Function(). I think this will make it hard to replace or remove that dependency to enforce a CSP without 'unsafe-eval'.

[ronaldohoch]

Maybe this can be changed by using it: https://github.com/silvermine/undertemplate Find it looking into this issue in underscore repo: https://github.com/jashkenas/underscore/issues/2273

Can you share your CSP config to test it?

[aimeos]

<meta http-equiv="Content-Security-Policy" content="default-src 'self'; img-src 'self' data:">

[artf]

@aimeos I'm wondering how the detection is performed. If it's based on execution it's not a big deal to replace all references of the template function (at least not if there is a security concern)

[aimeos]

@artf Guess, browsers block certain dynamic function declarations (new Function('<string>')) and function calls / language constructs (e.g. eval) when CSP is activated.

[artf]

ok then, I'll try to fix it for the next release.