How to configure Content-Security-Policy of Helmet package in express to allow cross site iframe and cross site scripting? - express

Question

Updating details to understand more: *In my project, user uploads html themes. For each user, if they authenticate, I am creating a public static folder for authenticated user in the same theme folder they are requesting. Then there is a editor in the front end where they can edit html theme contents. I am trying to show html themes in the editor using a iframe using the static link from backend. But the problem is I can't add script to the html theme in the iframe. It's saying permission denied. How can I solve this problem?
I am using express in backend and nextjs in frontend. I have added this code in helmet middleware.
app.use(
helmet({
contentSecurityPolicy: {
directives: {
'connect-src': ["'self'", 'http://localhost:3000'],
'default-src': "'self'",
'frame-ancestors': ["'self'", 'http://localhost:3000'],
sandbox: ['allow-forms', 'allow-scripts'],
'script-src': ["'self'", 'http://localhost:3000'],
},
},
})
);
For cross site scripting,
app.use(xss())
But still getting error in iframe.
From Backend I am trying to allow a route to be use in iframe in the frontend. Since, both server have different port in localhost, it's violating cross site embed and scripting. So, I am using helmet and xss package. I need help to configure it.
I am using iframe's onload attribute to check if it is loaded and then injecting another script to the iframe from frontend.

Answer 1

You have an issue of Same Origin Policy, not with Content Security Policy. Helmet package can't help you.
Set the value document.domain = 'example.com'; (example.com = 'localhost' in your case) both in the iframe and in the main page. It will reset port number to null and subdomain any.example.com to domain example.com, see test.
If both iframe and main page are on the same domain, you can just set document.domain = document.domain;.
Both variants leads resetting port number to null. therefore yoy'll be able to acces iframe with a different port number.