sandbox

The sandbox attribute on the <iframe> element improves security by restricting actions like running scripts and submitting forms, while still allowing specific features to provide more control over embedded content.

sandbox attribute

The sandbox attribute on an <iframe> enhances security by limiting features such as scripts and forms. Certain permissions can be granted by using space-separated tokens.

Syntax

index.html
<iframe src="url" sandbox="value1 value2"></iframe>

Example

Here’s an example of how to apply the sandbox attribute to an <iframe>:

index.html
<iframe src="https://institute.qarpeo.com" sandbox="allow-scripts allow-popups"></iframe>
  • In this example, the <iframe> allows scripts and popups, while other actions are restricted to ensure security.

Values

Here’s a concise list of possible values for the sandbox attribute.:

  • allow-forms: Allows form submissions.
  • allow-modals: Permits modal windows.
  • allow-orientation-lock: Allows screen orientation locking.
  • allow-pointer-lock: Allows pointer lock requests.
  • allow-popups: Allows popups to open.
  • allow-popups-to-escape-sandbox: Allows new windows to open without restrictions.
  • allow-presentation: Allows the initiation of presentations.
  • allow-same-origin: Treats the content as same origin.
  • allow-scripts: Enables JavaScript execution.
  • allow-top-navigation: Allows navigation to the top-level context.
  • allow-top-navigation-by-user-activation: Top-level navigation only with user interaction.
  • allow-presentation: Starts presentation sessions.
  • allow-same-origin: Treats content as same origin.
  • allow-scripts: Runs JavaScript.
  • allow-top-navigation: Navigates top-level context.
  • allow-top-navigation-by-user-activation: Top-level navigation with user interaction.

Conclusion

The sandbox attribute in HTML is a crucial security feature for <iframe> elements, enabling developers to restrict actions such as running scripts or opening popups. It improves web security by limiting potentially harmful content. Developers can grant specific permissions using tokens, balancing security with necessary functionality.