Imagine opening this page on a slow phone connection. The media should still be worth the wait and have a sensible fallback.
What You Need to Know
A third-party embed can send requests to another server and may run code with its own permissions. Decide what information the provider receives, sandbox where appropriate, and offer a fallback if it does not load.
In this example: compare permissive and restricted iframe attributes.
Try the Example
Take a look at the example. We’ll explain the important lines right below it.
<iframe src="/embeds/untrusted-preview.html" title="Untrusted code preview"
sandbox="allow-scripts" loading="lazy" referrerpolicy="no-referrer"></iframe>
<p>Keep embedded content isolated unless you have a specific reason to grant permissions.</p>Let’s Read the Code
- <iframe>: An iframe embeds a separate document with its own URL and security context.
- src: Src identifies a resource path for images, frames, or media.
- sandbox: Sandbox places restrictions on what an embedded frame is allowed to do.
What the example shows: The iframe sandbox allows scripts but does not grant the embedded document an unrestricted same-origin context.
What Happens in the Browser?
When the form reaches a server, the server must check the information again. A nice-looking HTML field is not a security control.
Remember the boundary. Embedded content may be a separate document, sometimes provided by another company. Give it a readable title or alternative, and check what permissions and information its request may expose.
Your Turn
List the permissions this preview needs and remove any unnecessary tokens.
Common Beginner Mistakes
- Leaving out real media files or understandable text alternatives.
- Combining permissive sandbox tokens can weaken isolation. Never give untrusted embeds more access than necessary.
Key Takeaways
- A third-party embed can send requests to another server and may run code with its own permissions.
- <iframe>: An iframe embeds a separate document with its own URL and security context.
- Treat personal information carefully. The HTML example cannot replace HTTPS, server-side security checks, or safe storage.