आईफ्रेम ब्रेकिंग: अपनी सामग्री की अनधिकृत आईफ्रेमिंग को कैसे रोकें
मेरी साइट पर आने वाले एक आगंतुक ने एक बार मुझे सूचित किया जब उसने मेरे एक लिंक पर क्लिक किया ट्विटर; उसे एक बड़े पॉपअप और एक दुर्भावनापूर्ण कोड चेतावनी के साथ मेरी साइट पर लाया गया था। यह किसी को डराने के लिए काफी है, इसलिए मैंने कुछ परीक्षण करना शुरू कर दिया। मेरी साइट में कुछ भी ग़लत नहीं था - समस्या लिंक थी।
किसी अन्य साइट के लिंक ने ऊपर एक टूलबार तैयार किया जिसने लोगों को मेरी साइट को नीचे आईफ्रेम में लोड करते समय एक दुर्भावनापूर्ण लिंक पर क्लिक करने के लिए प्रोत्साहित किया। अधिकांश लोगों को, मेरी साइट दुर्भावनापूर्ण कोड फैलाती हुई प्रतीत हो सकती है। मैं यह नहीं कहूंगा कि मुझे ऐसी कोई साइट पसंद है जो मेरी साइट को एक आईफ्रेम के भीतर लोड करती हो, इसलिए मैंने वही किया जो कोई भी समझदार गीक करेगा... मैंने एक फ्रेम ब्रेकर लोड किया।
हालाँकि, आपकी साइट को आईफ़्रेम करना हमेशा दुर्भावनापूर्ण नहीं होता है। हमने हाल ही में एक टूल साझा किया है, Sniply, कॉल-टू-एक्शन जोड़ने के लिए (CTA) आपके द्वारा साझा किए गए किसी भी वेबसाइट लिंक पर। यह आपकी संपूर्ण साइट को एक iframe में एम्बेड करके और कॉल-टू-एक्शन के साथ आपकी सामग्री पर div लागू करके ऐसा करता है।
लेकिन मैं अपनी सामग्री और अपने द्वारा किए गए प्रयासों को लेकर काफी सतर्क हूं Martech Zone, इसलिए मैं नहीं चाहता कि कोई भी मेरी सामग्री को आईफ्रेम करे, यहां तक कि लिंक-शेयर प्लेटफ़ॉर्म के साथ भी। कुछ शोध करने पर, इसे संभालने के कई तरीके हैं।
जावास्क्रिप्ट के साथ अपनी सामग्री को आईफ्रेम करना कैसे रोकें
यह जावास्क्रिप्ट कोड जाँचता है कि क्या वर्तमान विंडो (self
) सबसे ऊपरी विंडो नहीं है (top
). यदि ऐसा नहीं है, तो इसका मतलब है कि पृष्ठ एक फ्रेम, आईफ्रेम या समान में है, और स्क्रिप्ट सबसे ऊपरी विंडो को रीडायरेक्ट करती है यूआरएल वर्तमान विंडो का. यह प्रभावी ढंग से जेल से भागता है आईफ्रेम का.
<script type='text/javascript'>
if (top !== self) top.location.href = self.location.href;
</script>
इस दृष्टिकोण के कई नुकसान हैं:
- जावास्क्रिप्ट पर निर्भरता: यदि उपयोगकर्ता ने जावास्क्रिप्ट अक्षम कर दिया है, तो यह विधि काम नहीं करेगी।
- विलंब: जावास्क्रिप्ट निष्पादित होने में थोड़ी देरी हो सकती है, जिसके दौरान आपकी साइट का फ़्रेमयुक्त संस्करण अभी भी दिखाई दे सकता है।
- क्रॉस-उत्पत्ति प्रतिबंध: कुछ स्थितियों में, समान मूल नीति इस स्क्रिप्ट को इच्छानुसार काम करने से रोक सकती है। यदि मूल दस्तावेज़ किसी भिन्न डोमेन पर है, तो हो सकता है कि उस तक पहुंच न हो सके
top.location.href
. - फ़्रेम-बस्टिंग-बस्टर्स की संभावना: ऐसी स्क्रिप्ट भी हैं (जिन्हें फ़्रेम-बस्टिंग-बस्टर कहा जाता है) जो फ़्रेम-बस्टिंग स्क्रिप्ट को काम करने से रोक सकती हैं।
HTTP प्रतिक्रिया हेडर का उपयोग करना बेहतर तरीका है।
एक्स-फ़्रेम-विकल्प और सामग्री-सुरक्षा-नीति
दोनों X-Frame-Options
और Content-Security-Policy
(सीएसपी) HTTP प्रतिक्रिया हेडर हैं जिनका उपयोग किसी वेबसाइट की सुरक्षा बढ़ाने के लिए किया जाता है। वे प्रत्येक थोड़े अलग उद्देश्यों को पूरा करते हैं और उनमें लचीलेपन के विभिन्न स्तर होते हैं।
X-Frame-Options
एक पुराना HTTP हेडर है जिसे विशेष रूप से यह नियंत्रित करने के लिए डिज़ाइन किया गया है कि आपकी साइट को इसमें एम्बेड किया जा सकता है या नहीं <frame>
, <iframe>
, <embed>
या, <object>
किसी अन्य साइट पर. इसके तीन संभावित निर्देश हैं:
DENY
- पेज को एक फ्रेम में प्रदर्शित नहीं किया जा सकता, भले ही साइट ऐसा करने का प्रयास कर रही हो।SAMEORIGIN
- पृष्ठ को केवल पृष्ठ के समान मूल पर एक फ्रेम में प्रदर्शित किया जा सकता है।ALLOW-FROM uri
- पृष्ठ को केवल निर्दिष्ट मूल पर एक फ्रेम में प्रदर्शित किया जा सकता है।
हालांकि, X-Frame-Options
सीमित है क्योंकि यह अधिक जटिल परिदृश्यों को संभाल नहीं सकता है, जैसे कई अलग-अलग मूल से फ़्रेमिंग की अनुमति देना या उपडोमेन के लिए वाइल्डकार्ड का उपयोग करना। सभी ब्राउज़र इसका समर्थन नहीं करते ALLOW-FROM
निर्देश.
Content-Security-Policy
दूसरी ओर, यह बहुत अधिक लचीला और शक्तिशाली HTTP हेडर है। जबकि यह सब कुछ कर सकता है X-Frame-Options
और भी बहुत कुछ कर सकता है, इसका प्राथमिक उद्देश्य क्रॉस-साइट स्क्रिप्टिंग सहित कोड इंजेक्शन हमलों की एक विस्तृत श्रृंखला को रोकना है (XSS) और क्लिकजैकिंग। यह सामग्री के विश्वसनीय स्रोतों (स्क्रिप्ट, शैली, चित्र, आदि) की एक श्वेतसूची निर्दिष्ट करके काम करता है।
फ़्रेम को नियंत्रित करने के लिए, CSP का उपयोग करता है frame-ancestors
निर्देश. आप अनेक डोमेन और वाइल्डकार्ड उपडोमेन सहित अनेक स्रोत निर्दिष्ट कर सकते हैं। यहाँ एक उदाहरण है:
cssCopy codeContent-Security-Policy: frame-ancestors 'self' yourdomain.com *.domain2.com;
इससे पेज को अपनी साइट पर फ्रेम किया जा सकेगा ('self'
), पर yourdomain.com
, और किसी भी उपडोमेन पर domain2.com
.
इसके प्रतिस्थापन के रूप में सीएसपी की अनुशंसा की जा रही है X-Frame-Options
, क्योंकि यह सब कुछ संभाल सकता है X-Frame-Options
कर सकते हैं, और भी बहुत कुछ। जबकि अधिकांश आधुनिक ब्राउज़र सीएसपी का समर्थन करते हैं, फिर भी कुछ पुराने या कम सामान्य ब्राउज़र भी हो सकते हैं जो इसका पूरी तरह से समर्थन नहीं करते हैं।
HTML के साथ अपनी सामग्री को Iframe करना कैसे रोकें
अब एक सामग्री-सुरक्षा-नीति मेटा टैग है जिसे तैनात किया जा सकता है जो आपकी सामग्री को आईफ्रेम करने की क्षमता को अक्षम कर देता है:
<meta http-equiv="Content-Security-Policy" content="frame-ancestors 'self' yourdomain.com">
HTML मेटा टैग की प्रभावशीलता सीमित है क्योंकि सभी ब्राउज़र इसका सम्मान नहीं करते हैं Content-Security-Policy
जब मेटा टैग का उपयोग करके सेट किया जाता है।
HTTP हेडर के साथ अपनी सामग्री को Iframe करना कैसे रोकें
HTTP हेडर का उपयोग करना बेहतर है X-Frame-Options
or Content-Security-Policy
फ़्रेमिंग को नियंत्रित करने के लिए. ये विकल्प अधिक विश्वसनीय और सुरक्षित हैं, और जावास्क्रिप्ट अक्षम होने पर भी काम करते हैं। जावास्क्रिप्ट विधि का उपयोग केवल अंतिम उपाय के रूप में किया जाना चाहिए यदि आपके पास HTTP हेडर सेट करने के लिए सर्वर पर नियंत्रण नहीं है। प्रत्येक उदाहरण के लिए, बदलें yourdomain.com
आपके वास्तविक डोमेन के साथ.
अपाचे - अपना संशोधन करें .htaccess
फ़ाइल इस प्रकार है:
Header always set X-Frame-Options SAMEORIGIN
Header always set Content-Security-Policy "frame-ancestors 'self' yourdomain.com"
nginx - अपने सर्वर ब्लॉक को निम्नानुसार संशोधित करें:
add_header X-Frame-Options SAMEORIGIN;
add_header Content-Security-Policy "frame-ancestors 'self' yourdomain.com";
आईआईएस - निम्नलिखित को अपने में जोड़कर ऐसा करें web.config
फ़ाइल:
<system.webServer>
<httpProtocol>
<customHeaders>
<add name="Content-Security-Policy" value="frame-ancestors 'self' yourdomain.com" />
</customHeaders>
</httpProtocol>
</system.webServer>
WordPress - इस कोड को अपनी function.php फ़ाइल में जोड़कर ऐसा करें:
function add_security_headers() {
header('X-Frame-Options: SAMEORIGIN');
header("Content-Security-Policy: frame-ancestors 'self' yourdomain.com");
}
add_action('send_headers', 'add_security_headers');
ये कॉन्फ़िगरेशन आपके पेज को केवल आपके द्वारा निर्दिष्ट सटीक डोमेन पर आईफ्रेम के भीतर एम्बेड करने की अनुमति देंगे, किसी डोमेन उपडोमेन पर नहीं। यदि आप कुछ उपडोमेन को अनुमति देना चाहते हैं, तो आपको उन्हें स्पष्ट रूप से सूचीबद्ध करना होगा, जैसे subdomain1.yourdomain.com
subdomain2.yourdomain.com
, और इतने पर.
एकाधिक डोमेन से अपनी सामग्री को आईफ़्रेम करने की अनुमति दें
आप सामग्री-सुरक्षा-नीति HTTP प्रतिक्रिया शीर्षलेख और फ़्रेम-पूर्वजों निर्देश के साथ एकाधिक डोमेन निर्दिष्ट कर सकते हैं। प्रत्येक डोमेन को एक स्थान से अलग करना चाहिए। यहाँ एक उदाहरण है:
Content-Security-Policy: frame-ancestors 'self' domain1.com domain2.com domain3.com;
अपाचे - अपना संशोधन करें .htaccess
फ़ाइल इस प्रकार है:
Header always set X-Frame-Options SAMEORIGIN
Header always set Content-Security-Policy "frame-ancestors 'self' domain1.com domain2.com domain3.com"
nginx - अपने सर्वर ब्लॉक को निम्नानुसार संशोधित करें:
add_header X-Frame-Options SAMEORIGIN;
add_header Content-Security-Policy "frame-ancestors 'self' domain1.com domain2.com domain3.com";
आईआईएस - निम्नलिखित को अपने में जोड़कर ऐसा करें web.config
फ़ाइल:
<system.webServer>
<httpProtocol>
<customHeaders>
<add name="X-Frame-Options" value="SAMEORIGIN" />
<add name="Content-Security-Policy" value="frame-ancestors 'self' domain1.com domain2.com domain3.com" />
</customHeaders>
</httpProtocol>
</system.webServer>
वाइल्डकार्ड डोमेन से अपनी सामग्री को आईफ़्रेम करने की अनुमति दें
आप इसके साथ सभी उपडोमेन के लिए वाइल्डकार्ड भी निर्दिष्ट कर सकते हैं Content-Security-Policy
HTTP प्रतिक्रिया शीर्षलेख और फ़्रेम-पूर्वजों का निर्देश। यहां इसके उदाहरण दिए गए हैं Content-Security-Policy
कोड जिसे अद्यतन करने की आवश्यकता है:
Content-Security-Policy: frame-ancestors 'self' *.yourdomain.com;
अपाचे - अपना संशोधन करें .htaccess
फ़ाइल इस प्रकार है:
Header always set Content-Security-Policy "frame-ancestors 'self' *.yourdomain.com"
nginx - अपने सर्वर ब्लॉक को निम्नानुसार संशोधित करें:
add_header Content-Security-Policy "frame-ancestors 'self' *.domain1.com *.domain2.com *.domain3.com";
आईआईएस - निम्नलिखित को अपने में जोड़कर ऐसा करें web.config
फ़ाइल:
<system.webServer>
<httpProtocol>
<customHeaders>
<add name="Content-Security-Policy" value="frame-ancestors 'self' *.yourdomain.com" />
</customHeaders>
</httpProtocol>
</system.webServer>