Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Document origins for loaded resources for Content Security Policies #41

Open
PeppeL-G opened this issue Nov 7, 2023 · 2 comments
Open

Comments

@PeppeL-G
Copy link

PeppeL-G commented Nov 7, 2023

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
Copy link
Owner

hi @PeppeL-G 👋

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

@PeppeL-G
Copy link
Author

@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.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants