IFrames & Sandboxed Security

🌐 HTML Basics Lesson 12 Intermediate

IFrames embed external web pages inside the current document. To protect against malicious external scripts, you must configure security attributes carefully.

1 iframe elements and the sandbox attribute

IFrames serve as windows to external URLs: `<iframe src="url"></iframe>`.

Sandbox Security: Embedding external content poses security risks. Attackers can execute malicious scripts or redirect pages. To prevent this, always include the **`sandbox`** attribute to restrict execution rights, selectively allowing features like form submissions (`allow-forms`) or scripts (`allow-scripts`).

2 IFrame Code

Let's see an iframe embed setup:

HTML — Secure IFrame

<!-- Secure iframe embedding external map with restrictions -->
<iframe 
    src="https://example.com/map" 
    width="600" 
    height="400" 
    sandbox="allow-scripts allow-same-origin"
    title="Interactive map embed">
    Your browser does not support IFrames.
</iframe>

3 Code Challenge

Challenge: Embed an external YouTube video iframe using the `sandbox` attribute, and explain which configuration options are required to let the video play.