search

suren-atoyan / monaco-loader

The utility to easy setup monaco-editor into your browser
MIT License
177 stars 37 forks source link

Document origins for loaded resources for Content Security Policies #41

Open PeppeL-G opened 10 months ago

PeppeL-G commented 10 months ago

This package works great, but I needed to add a CSP to my webpage that runs the editor, and in the CSP I need to list the resources the editor loads as exceptions to the CSP. My CSP contains some additional exceptions, but I think these are the ones needed for the editor to be able to load its resources:

// Start by forbidding most stuff by default...

default-src 'none';
form-action 'none';
connect-src 'none';

// ...
// And then allow the following resources to be loaded by the editor (you probably need to allow your own JS and CSS code here too):

img-src data:;
script-src https://cdn.jsdelivr.net blob:;
style-src-elem https://cdn.jsdelivr.net;
font-src https://cdn.jsdelivr.net;

I don't know if I've managed to allow all resources the editor will ever attempt to load. For one, data: for img-src I noticed was needed first when the editor tried to load it, which was when I triggered the autocomplete box to open, so there might be more that needs to be allowed I haven't discovered yet. Anyway, would be nice to have this documented somewhere.

(it's also the first time I'm using a CSP, so there might be a better way of achieving the same result)

suren-atoyan commented 9 months ago

hi @PeppeL-G 👋

Sorry for the late reply. Is your issue still actual?

PeppeL-G commented 9 months ago

@suren-atoyan, no worries, I'm in no hurry ^^ Thanks for taking your time.

The CSP I have seems to work good for me, so I don't have any problem. But I imagine many programmers will use Monaco/Monaco Loader the same way as I do:

  1. User enters some JS code in the editor
  2. The entered JS code gets executed by the user's web browser

Then it's good to have a CSP to make it more secure for the web browser to execute the entered JS code, and knowing what CSP directives one need to allow to make the editor work would be good.

But perhaps this is not an enough common use-case to be worth mentioning in the docs (and possibly hard to keep up-to-date anyway), so maybe trial-and-error and this issue is helpful enough for other programmers in my situation.