@live-codes/playground-sandbox

1.0.0 • Public • Published

Playground Sandbox

This repo contains a web page that can be used as a sandbox for running untrusted code in playgrounds (similar to livecodes.io).

Usage

The page "index.html" is used as the src for a sandboxed iframe in which untrusted code can be executed. This page has to be on a different domain than the playground. That's why it is published to npm, so that it can be hosted on CDNs (e.g. unpkg).

The html is sent to the iframe using postMessage in an object with the html key.

Example:

const iframe = document.createElement("iframe");
iframe.src =
  "https://unpkg.com/@live-codes/playground-sandbox@1.0.0/index.html";
iframe.setAttribute(
  "sandbox",
  "allow-same-origin allow-forms allow-scripts allow-modals" // and whatever else you need
);
iframe.onload = function () {
  iframe.contentWindow.postMessage(
    {
      html: `
        <h1>hello world!</h1>
        I do not have access to the parent window except through \`postMessage\`.
    `,
    },
    "*"
  );
};
document.body.appendChild(iframe);

License

MIT License

Package Sidebar

Install

npm i @live-codes/playground-sandbox

Weekly Downloads

1

Version

1.0.0

License

MIT

Unpacked Size

3.9 kB

Total Files

6

Last publish

Collaborators

  • hatemhosny