bokeh / bokeh

Interactive Data Visualization in the browser, from Python
https://bokeh.org
BSD 3-Clause "New" or "Revised" License
19.31k stars 4.18k forks source link

Using bokehjs under strict content security policies #12875

Closed clemgaut closed 1 year ago

clemgaut commented 1 year ago

Problem description

I would like to be able to embed bokeh plots in a webapp having strict CSP rules. This is currently not possible because the js code of bokeh uses unsafe-eval which is not tolerated by a strict CSP policy

Feature description

I would like to have bokeh to not use unsafe-eval so that it can be used within strict CSP policies.

Potential alternatives

I considered adding unsafe-eval to the CSP policy, but this largely weakens the purpose of a CSP policy. Given the security constraints of the webapp, I could not add this more permissive policy.

Additional information

No response

bryevdv commented 1 year ago

cc @bokeh/dev

@clemgaut Bokeh may simply not be the right tool for you. A major reason for Bokeh's existence is to afford Python devs and data scientists to quickly create interactive web visualization from Python. One of the most useful (and used) features for that are "CustomJS callbacks" where the developers of the Bokeh content can include snippets of JS (from Python) to respond to events. Naturally, these have to be eval'd in order to function. We are definitely not getting rid of CustomJS callbacks.

The only idea I can think of is that perhaps we can segregate all instances of CustomJS type models into their own separate bundle e.g. bokeh-customjs.js, so that there are no eval calls unless that bundle is explicitly included.

mattpap commented 1 year ago

Unless I'm missing something, unsafe-eval only triggers when code is actually evaluated. Thus bokehjs should load fine as-is. A document can contain CustomJS, but it most not get evaluated, otherwise an exception will be raised.

I tested this on our examples, by adding the following rule to <head>:

<meta
  http-equiv="Content-Security-Policy"
  content="default-src http://localhost:5006 'self' 'unsafe-inline'; img-src data: w3.org/svg/2000;"
/>

This is a bare minimum to load examples that use the default file template from localhost and have tool icons.

clemgaut commented 1 year ago

Thank you both for your answers, I now understand why I am triggering the unsafe-eval, not authorized by the CSP policy: I am indeed using a customJS in one of my plots.

My use of bokeh is probably not too common: I use it inside a jupyter notebook, that is exported to html and this html is then rendered in a web app (in an i-frame). It then the CSP of the web-app that blocks the use of some of the customJS function defined originally from python. I can see that this behavior is expected because customJS functions have ot use unsafe-eval. I'll look into other ways of doing what I'm doing now, thank you for clarifying the issue :)

stedann93 commented 5 months ago

Thank you both for your answers, I now understand why I am triggering the unsafe-eval, not authorized by the CSP policy: I am indeed using a customJS in one of my plots.

My use of bokeh is probably not too common: I use it inside a jupyter notebook, that is exported to html and this html is then rendered in a web app (in an i-frame). It then the CSP of the web-app that blocks the use of some of the customJS function defined originally from python. I can see that this behavior is expected because customJS functions have ot use unsafe-eval. I'll look into other ways of doing what I'm doing now, thank you for clarifying the issue :)

Hi, Were you able to find another way to avoid using unsafe-eval with this Bokeh library?

clemgaut commented 5 months ago

Thank you both for your answers, I now understand why I am triggering the unsafe-eval, not authorized by the CSP policy: I am indeed using a customJS in one of my plots. My use of bokeh is probably not too common: I use it inside a jupyter notebook, that is exported to html and this html is then rendered in a web app (in an i-frame). It then the CSP of the web-app that blocks the use of some of the customJS function defined originally from python. I can see that this behavior is expected because customJS functions have ot use unsafe-eval. I'll look into other ways of doing what I'm doing now, thank you for clarifying the issue :)

Hi, Were you able to find another way to avoid using unsafe-eval with this Bokeh library?

No, we ended up removing the customJS code to remove some of our customization.