I'm creating a service for creating web tools. The tool is a generated web page with some JS engine. The user can interact with the JS engine through the user interface. The user interface can be either ready-made or custom.

The idea of ​​using a custom user interface is dangerous. This approach creates possible security issues (eg XSS).

Please advise a more efficient solution for the implementation of the HTML playground.

  • 1
    "more efficient"? what in power usage? lines of code? why does a custom interface create security risks? I dont understand the question
    – Ewan
    Commented Sep 19, 2022 at 16:41

1 Answer 1


In a HTML playground, you want users to be able to execute arbitrary code, also when visited by others – persistent XSS by design. However, you will want to ensure that the user's code runs in a different security context from your site's user interface. You can achieve this by using an iframe:

  • The user-generated content can run on a different Origin than the rest of your site.
    • main site cookies are inaccessible
    • main site can use a restrictive Content Security Policy
    • but you'll still need the usual XSRF defenses
  • The iframe can declare an appropriate allow="..." feature policy and sandbox="..." attribute.
    • For example, you can disable fullscreen access.

Note that a HTML playground is in many ways indistinguishable from a hosting service. Aside from technical security measures, you will likely also want to think about anti-abuse measures.

  • 1
    The UCG shouldn't just be on a different origin to the rest of the site - each user's UCG should be on a different origin to content from other users (unless they have some good reason to trust each other)
    – bdsl
    Commented Sep 19, 2022 at 19:26

Not the answer you're looking for? Browse other questions tagged or ask your own question.