HTML Iframe सिक्योरिटी
In this page:
<iframe src="url" sandbox="allow-scripts allow-same-origin"></iframe>
sandbox एट्रिब्यूट
sandbox attribute किसी iframe के लिए डिफ़ॉल्ट रूप से सभी permissions disable कर देता है। फिर आप selectively सिर्फ वही permissions फिर से enable करते हैं जिनकी ज़रूरत है। यह embedded content पर पूरी तरह भरोसा करने से कहीं ज़्यादा सुरक्षित है।
- sandbox से शुरू करें और जब तक embedded content काम न करे, permissions एक-एक करके जोड़ते जाएं।
- Accepted values:
- sandbox (empty) — apply all restrictions
- allow-scripts — permit JavaScript
- allow-same-origin — keep the origin
- allow-forms — permit form submission
- allow-popups — permit popups
- allow-top-navigation — permit navigating the top page
- allow-modals — permit alert, confirm, prompt
उदाहरण: The sandbox Attribute
<iframe src="https://example.com" sandbox></iframe>
allow एट्रिब्यूट
allow attribute यह control करता है कि कोई iframe कौन-से browser features access कर सकता है — camera, microphone, geolocation, fullscreen। सिर्फ वही दें जिसकी embedded content को असल में ज़रूरत है।
- YouTube embeds को allow=fullscreen चाहिए होता है — इसके बिना fullscreen button कुछ नहीं करता।
- Accepted values:
- allow — semicolon-separated Permissions Policy features
- camera; microphone; geolocation; fullscreen; autoplay; payment; clipboard-write
- Each feature may take an origin list, e.g. geolocation self
उदाहरण: The allow Attribute
<iframe src="https://youtube.com/embed/xyz" allow="fullscreen"></iframe>
referrerpolicy एट्रिब्यूट
referrerpolicy यह control करता है कि आपके page के बारे में कितनी जानकारी Referer header के ज़रिए embedded iframe के destination तक भेजी जाए, और no-referrer जैसी सख्त values आपकी site के URL structure को third-party embeds तक leak होने से रोकती हैं।
- Accepted values:
- no-referrer
- no-referrer-when-downgrade
- origin
- origin-when-cross-origin
- same-origin
- strict-origin
- strict-origin-when-cross-origin
- unsafe-url
उदाहरण: The referrerpolicy Attribute
<iframe src="https://example.com" referrerpolicy="no-referrer"></iframe>
कंटेंट सिक्योरिटी पॉलिसी और frame-src
किसी page के Content-Security-Policy header में frame-src directive यह restrict करता है कि कौन-से domains iframe के ज़रिए embed किए जा सकते हैं, जिससे malicious या unexpected iframe sources block हो जाते हैं, भले ही कोई attacker page में iframe tag inject करने में सफल हो जाए।
उदाहरण: Content Security Policy and frame-src
<meta http-equiv="Content-Security-Policy" content="frame-src https://trusted.com">
X-Frame-Options से क्लिकजैकिंग से बचाव
X-Frame-Options response header दूसरी sites को आपका page अपने खुद के iframe में embed करने से रोकता है, जिससे clickjacking attack रुक जाता है जहाँ कोई attacker आपके असली page के ऊपर invisible buttons overlay करके users को कुछ ऐसा click करने के लिए धोखा देता है जो वे नहीं करना चाहते थे।
उदाहरण: Avoiding Clickjacking with X-Frame-Options
<!-- Server response header: X-Frame-Options: DENY -->
<iframe src="https://example.com"></iframe>
Chapter Quiz — Complete all 20 topics to unlock
0/20 topics done
Complete these topics first:
- HTML Keyboard Shortcuts
- HTML Browser Support
- HTML Character Sets
- HTML Doctypes
- HTML Audio/Video Reference
- HTML Meta Tags
- HTML ARIA Roles
- HTML Input Validation
- HTML Iframe Security
- HTML Responsive Images
- HTML Web Fonts
- HTML Icon Fonts
- HTML Progress & Meter
- HTML Output Element
- HTML Datalist
- HTML Image Maps
- HTML Browser DevTools
- HTML Validation
- HTML Quiz
- HTML Interview Prep