क्या है एक iframe?
Scrapeless Scraping Browser स्वचालन कार्यप्रवाहों के लिए प्रबंधित क्रोमियम सत्र प्रदान करता है जिन्हें एम्बेडेड फ्रेम के साथ नेविगेट और इंटरैक्ट करना होता है।
TL;DR
- एक iframe वर्तमान पृष्ठ के अंदर एक अलग दस्तावेज़ को एम्बेड करता है। फ्रेम किया गया दस्तावेज़ का अपना ब्राउज़िंग संदर्भ, विंडो, दस्तावेज़, URL, और जीवन चक्र है।
- समान-मूल नीति फ्रेम सीमाओं के पार स्क्रिप्ट पहुंच को नियंत्रित करती है। क्रॉस-मूल फ्रेम दृश्य में रहते हैं लेकिन उनके आंतरिक DOM को माता-पृष्ठ द्वारा स्वतंत्र रूप से पढ़ा नहीं जा सकता।
- सैंडबॉक्स विशेषता क्षमताओं को हटा सकती है। व्यक्तिगत टोकन चयनात्मक रूप से स्क्रिप्ट, फ़ॉर्म, नेविगेशन, पॉपअप और संबंधित व्यवहार को पुनर्स्थापित करते हैं।
- हर iframe की अपनी लोड और नेविगेशन स्थिति होती है। माता-पिता का तैयार होना इस बात का प्रमाण नहीं है कि बच्चे के फ्रेम का लक्षित सामग्री तैयार है।
- स्वचालन को तत्वों का चयन करने से पहले सही फ्रेम चुनना चाहिए। एक दस्तावेज़-स्तरीय लोकेटर सीधे किसी अन्य ब्राउज़िंग संदर्भ द्वारा स्वामित्व वाले DOM नोड्स को संबोधित नहीं कर सकता।
डॉक्यूमेंट सीमाएँ क्यों महत्वपूर्ण हैं
एक iframe प्रभावित करता है कि ब्राउज़र स्थिति को कैसे उजागर करते हैं, सामग्री को कैसे प्रदर्शित करते हैं, या कब एक स्वचालित क्रिया सुरक्षित है। एक सटीक परिभाषा टीमों को तंग संकेत को एक सार्वभौमिक उत्तर मानने से रोकती है। यह परीक्षण विफलताओं का निदान करना भी आसान बनाता है क्योंकि अपेक्षित ब्राउज़र व्यवहार एक दस्तावेज़ित जीवन चक्र, API, या सिस्टम सीमा से बंधा होता है।
वेब स्वचालन के लिए व्यावहारिक प्रश्न हमेशा “क्या पृष्ठ तैयार है?” या “क्या ब्राउज़र असली दिखता है?” से संकुचित होता है। अगला कदम एक नियंत्रण को सक्षम करने, एक फ्रेम को नेविगेशन खत्म करने, एक घटक को अपने आंतरिक पेड़ को जोड़ा रखने, या एक रेंडरिंग सतह को स्थिर रखने की आवश्यकता हो सकती है। नीचे अनुभाग इस अवधारणा को पर्यवेक्षित जांचों में बदल देते हैं बजाय कि लोककथाओं पर निर्भर रहने के।
iframe की परिभाषा
एक iframe, या इनलाइन फ्रेम, एक HTML तत्व है जो वर्तमान दस्तावेज़ के भीतर एक अन्य दस्तावेज़ को एम्बेड करता है। एम्बेड की गई सामग्री का अपना ब्राउज़िंग संदर्भ Window, दस्तावेज़, URL, नेविगेशन इतिहास, और जीवन चक्र के साथ होता है। माता-पृष्ठ उस आयताकार क्षेत्र को नियंत्रित करता है जहां बच्चा दस्तावेज़ प्रस्तुत किया जाता है।
यह HTML मानक iframe परिभाषा तत्व, इसकी सामग्री विशेषताएँ, नेविगेशन व्यवहार, सैंडबॉक्स फ़्लैग्स, लोडिंग, और ब्राउज़िंग संदर्भों के साथ एकीकरण को निर्दिष्ट करती है। बच्चा माता-पिता के साथ समान-मूल हो सकता है या पूरी तरह से अलग मूल से आ सकता है।
सामान्य उपयोगों में भुगतान फ़ॉर्म, वीडियो प्लेयर, मानचित्र, विज्ञापन, समर्थन विजेट, दस्तावेज़ पूर्वावलोकन, और एम्बेडेड आवेदन शामिल हैं। अलगाव एकीकरण को सरल बना सकता है और दस्तावेज़ों को अलग कर सकता है, लेकिन यह सुरक्षा, प्रदर्शन, पहुंच, और स्वचालन पर विचारों को भी जन्म देता है जो सामान्य नेस्टेड HTML में नहीं होते।
एक अलग ब्राउज़िंग संदर्भ
iframe तत्व माता-पिता DOM का हिस्सा है, लेकिन इसके अंदर प्रदर्शित दस्तावेज़ उस DOM का एक सामान्य उप-पेड नहीं बनता। बच्चा अपनी खुद की वैश्विक वस्तु रखता है और स्वतंत्र रूप से नेविगेट कर सकता है। माता-पिता और बच्चे के जीवन चक्र अलग-अलग गति से प्रगति कर सकते हैं, और बच्चा स्वयं नेस्टेड फ्रेम रख सकता है।
समान-मूल सामग्री के लिए, माता-पिता की स्क्रिप्ट बच्चों के विंडो और दस्तावेज़ तक प्लेटफ़ॉर्म API के माध्यम से पहुंच सकते हैं। क्रॉस-मूल सामग्री के लिए, समान-मूल नीति दोनों दिशाओं में सीधे DOM पहुंच को ब्लॉक करती है। दस्तावेज़ अभी भी नियंत्रित क्रॉस-दस्तावेज़ संदेशिंग के माध्यम से समन्वय कर सकते हैं जब दोनों पक्ष एक सहमति वाले प्रोटोकॉल को लागू करते हैं।
यह MDN iframe तत्व संदर्भ विशेषताओं जैसे src, srcdoc, नाम, लोडिंग, referrerpolicy, allow, और sandbox को दस्तावेज करता है। ये नियंत्रण यह प्रभावित करते हैं कि क्या लोड होता है, यह कब लोड होता है, कौन सी जानकारी भेजी जाती है, और किस क्षमताओं को फ्रेम किया गया पृष्ठ प्राप्त करता है।
समान-मूल नीति और संदेशिंग
दो दस्तावेज़ों का समान-मूल तब होता है जब उनकी स्कीम, होस्ट, और पोर्ट प्लेटफ़ॉर्म के मूल नियमों के तहत मेल खाते हैं। समान-मूल फ्रेम करीबी सहयोग कर सकते हैं। क्रॉस-मूल फ्रेम स्वतंत्र रूप से एक-दूसरे के DOM, कुकीज़, स्टोरेज, या जावास्क्रिप्ट वस्तुओं को पढ़ नहीं सकते क्योंकि इससे किसी भी पृष्ठ को एक उपयोगकर्ता की प्रमाणित सामग्री को किसी अन्य साइट पर जांचने की अनुमति मिल जाएगी।
यह MDN समान-मूल नीति गाइड सीमा और क्रॉस-मूल इंटरैक्शन की सीमित श्रेणियों को समझाते हैं। Window.postMessage जानबूझकर संचार चैनल प्रदान करता है। रिसीवर्स को प्रेषक मूल की पुष्टि करनी चाहिए और संदेश संरचना को मान्य करना चाहिए बजाय इसके कि किसी भी स्रोत से संदेश स्वीकार करें।
मूल साइट ब्रांडिंग या दृश्य डोमेन पाठ के समान नहीं है। रीडायरेक्ट्स फ्रेम के अंतिम मूल को बदल सकते हैं। एक फ्रेम जो समान-मूल से शुरू होता है वह बाद में क्रॉस-मूल नेविगेट कर सकता है, सीधे पहुंच को अमान्य कर सकता है। स्वचालन को वर्तमान फ्रेम URL की जांच करनी चाहिए और नेविगेशन को एक स्थिति परिवर्तन के रूप में मानना चाहिए।
सैंडबॉक्स और अनुमतियाँ
सैंडबॉक्स विशेषता फ्रेम संदर्भ पर एक प्रतिबंधात्मक सेट के झंडे लागू करती है। बिना टोकन के, यह स्क्रिप्ट, फ़ॉर्म सबमिशन, पॉपअप, शीर्ष-स्तरीय नेविगेशन, डाउनलोड, और समान-मूल उपचार को अक्षम कर सकती है। allow से शुरू होने वाले टोकन चयनात्मक रूप से क्षमताओं को पुनर्स्थापित करते हैं। एक न्यूनतम टोकन सेट डिफ़ॉल्ट द्वारा हर क्षमता को देने की तुलना में अधिक सुरक्षित है।
allow विशेषता और अनुमतियों की नीति सुविधाओं जैसे कैमरा, माइक्रोफ़ोन, भू-स्थान, और पूर्ण स्क्रीन तक पहुंच को नियंत्रित करती है। ये नियंत्रण सैंडबॉक्सिंग के साथ पूरक होते हैं; यह मूल जांचों या आवेदन प्राधिकरण को प्रतिस्थापित नहीं करते। एक एम्बेडेड थर्ड पार्टी को केवल उन क्षमताओं की अनुमति मिलनी चाहिए जिनकी उसे आवश्यकता है।
एक खतरनाक कॉन्फ़िगरेशन उत्पन्न हो सकता है जब समान-मूल एम्बेडेड सामग्री को सैंडबॉक्स के तहत स्क्रिप्ट अनुमति और पुनर्स्थापित समान-मूल उपचार दोनों मिलते हैं। संदर्भ के आधार पर, फ्रेम किया गया पृष्ठ प्रतिबंधों को हटा या बच सकता है। सुरक्षा समीक्षा को प्रत्येक विशेषता को अलगाव में पढ़ने के बजाय वास्तविक मूल, सामग्री नियंत्रण, और टोकन संयोजन पर विचार करना चाहिए।
लोडिंग, प्रदर्शन, और पहुंच
प्रत्येक iframe स्क्रिप्ट, शैलियों, चित्रों, फोंट और उपफ्रेम के साथ एक पूर्ण दस्तावेज़ लोड शुरू कर सकता है। कई एम्बेड मेमोरी, सीपीयू और नेटवर्क लागत बढ़ाते हैं। लोडिंग विशेषता ऑफस्क्रीन फ्रेम को टाल सकती है, लेकिन लेज़ी लोडिंग का अर्थ है कि उनका सामग्री उस समय मौजूद नहीं हो सकती जब माता-पिता का प्रारंभिक लोड इवेंट फायर होता है।
हर महत्वपूर्ण iframe को एक संक्षिप्त शीर्षक विशेषता की आवश्यकता होती है जो सहायक तकनीक उपयोगकर्ताओं को बताती है कि एम्बेडेड सामग्री का क्या प्रतिनिधित्व है। फ्रेम वाला दस्तावेज़ भी अपनी स्वयं की सुलभ संरचना की आवश्यकता है। बिना स्पष्ट मार्ग के एम्बेड में कीबोर्ड फ़ोकस को बलात्कृत करने से बचें, और सीमा के पार टैब आदेश का परीक्षण करें।
अंतराल का आकार समन्वय की आवश्यकता है क्योंकि माता-पिता iframe बॉक्स को नियंत्रित करते हैं जबकि बच्चा इसके सामग्री को नियंत्रित करता है। क्रॉस-ओरिजिन बच्चे सीधे DOM एक्सेस के माध्यम से अपने दस्तावेज़ की ऊंचाई को सरलता से उजागर नहीं कर सकते। एक संदेश प्रोटोकॉल आकार परिवर्तनों की रिपोर्ट कर सकता है, लेकिन माता-पिता को संदेशों का मान्यकरण करना चाहिए और लेआउट लूप को रोकना चाहिए।
iframe स्वचालन पैटर्न
स्वचालन सबसे पहले उस फ्रेम को एक स्थिर संपत्ति जैसे URL, नाम, शीर्षक, या इसके स्वामित्व वाले iframe तत्व के द्वारा पहचानता है। यह तब एक फ्रेम-स्कोप वाला लोकेटर बनाता है और उस ब्राउज़िंग संदर्भ के अंदर खोजता है। बिना फ्रेम में प्रवेश किए माता-पिता दस्तावेज़ से दृश्य बच्चे के तत्व का चयन असफल होगा क्योंकि नोड दूसरे दस्तावेज़ का है।
फ्रेम के जुड़े होने, नेविगेट करने और लक्ष्य नियंत्रण को रेंडर करने का अलग से इंतजार करें। माता-पिता का DOMContentLoaded या लोड इवेंट यह साबित नहीं करता है कि बच्चा अनुप्रयोग तैयार है, विशेष रूप से जब फ्रेम लेज़ी लोड होता है या क्लाइंट-साइड डेटा फेचिंग करता है। फ्रेम के अंदर एक लक्ष्य स्थिति का उपयोग करें।
फ्रेम नेविगेशन के दौरान अलग हो सकते हैं और बदले जा सकते हैं। लोकेटर्स को लचीला बनाए रखें और संक्रमण के दौरान एक फ्रेम ऑब्जेक्ट को कैश करने से बचें जब तक कि ढांचा उस पहचान की गारंटी न दे। नेस्टेड फ्रेम के लिए, एक समय में एक सीमा पार करें। जब एक क्रॉस-ओरिजिन फ्रेम सीधे पृष्ठ-स्क्रिप्ट एक्सेस को अस्वीकार करता है, तो स्वचालन ढांचा अभी भी ब्राउज़र-स्तरीय फ्रेम प्राइमिटिव्स के माध्यम से इंटरैक्ट कर सकता है, जो कि ब्राउज़र और साइट के सामान्य सुरक्षा मॉडल के अधीन है।
फ्रेम-स्तरीय जांच का चयन करना
उस सबसे छोटे स्थिति या कॉन्फ़िगरेशन से शुरुआत करें जो साबित करती है कि कार्य आगे बढ़ सकता है। मानकों के अनुकूल ब्राउज़र व्यवहार को बनाए रखें, फिर प्रोफ़ाइल नियंत्रण केवल तभी जोड़ें जब कार्यप्रवाह को उनकी आवश्यकता हो। ब्राउज़र बिल्ड और प्रासंगिक स्थिति को रिकॉर्ड करें ताकि बाद में भिन्नताएँ बताई जा सकें। एक पुनरावृत्ति अवलोकन एक व्यापक दावे की तुलना में अधिक उपयोगी है कि पृष्ठ, फ्रेम, प्रदर्शन, या फिंगरप्रिंट केवल "समाप्त" या "सुरक्षित" है।
- अगली कार्रवाई को परिभाषित करें। सटीक रूप से बताएं कि स्क्रिप्ट या उपयोगकर्ता को प्रतीक्षा या कॉन्फ़िगरेशन चरण के बाद क्या करना चाहिए।
- एक अवलोकनीय संकेत चुनें। एक ब्राउज़र संपत्ति, जीवनचक्र स्थिति, तत्व स्थिति, या रेंडरिंग परिणाम को पसंद करें जो सीधे उस क्रिया का समर्थन करता है।
- संबंधित मानों को संगत रखें। ब्राउज़र, ऑपरेटिंग-सिस्टम, स्क्रीन, क्षेत्र, ग्राफिक्स, और सत्र सेटिंग्स को एक संभावित वातावरण का वर्णन करना चाहिए।
- सामान्य अनुप्रयोग व्यवहार को मान्य करें। एक गोपनीयता या स्वचालन हस्तक्षेप को API या घटक को चुपचाप तोड़ने में सक्षम नहीं होना चाहिए जिसे यह बदलता है।
- नैदानिक साक्ष्य को कैप्चर करें। जब एक चेक असफल होता है, तो प्रासंगिक URLs, स्थितियों, कंसोल संदेशों, और कॉन्फ़िगरेशन नामों को सहेजें।
निष्कर्ष
एक iframe एक अलग एम्बेडेड दस्तावेज़ है, साधारण बच्चे नोड्स के चारों ओर एक स्टाइल किए गए कंटेनर नहीं। उत्पत्ति नियम, सैंडबॉक्स फ़्लैग, अनुमतियां, स्वतंत्र लोडिंग, और सुलभता की आवश्यकताएँ इसके व्यवहार को परिभाषित करती हैं। विश्वसनीय स्वचालन स्पष्ट रूप से फ्रेम का चयन करता है, उस संदर्भ के अंदर स्थिति के लिए प्रतीक्षा करता है, और उम्मीद करता है कि फ्रेम अपने माता-पिता से स्वतंत्र रूप से नेविगेट या अलग होता है।
यह स्क्रेपलेस स्क्रेपिंग ब्राउज़र दस्तावेज़ बताता है कि प्रबंधित ब्राउज़र के सत्रों को कैसे कॉन्फ़िगर किया जाता है, जबकि स्क्रेपिंग ब्राउज़र उत्पाद अवलोकन ब्राउज़र स्वचालन सतह का वर्णन करता है। ये संसाधन अधिकृत कार्यप्रवाह में अवधारणा लागू करने के लिए उत्पाद संदर्भ प्रदान करते हैं।
एम्बेडेड दस्तावेज़ों को स्वचालित करने के लिए तैयार?
ब्राउज़र रेंडरिंग, सत्र कॉन्फ़िगरेशन, और स्वचालन अवसंरचना को एक प्रबंधित क्रोमियम वातावरण में ले जाएँ।
आज ही साइन अप करें और पाएं $5 का मुफ्त क्रेडिट — कोई क्रेडिट कार्ड आवश्यक नहीं.
अपने $5 क्रेडिट का दावा करें →अक्सर पूछे जाने वाले प्रश्न
क्या iframe माता-पिता DOM का हिस्सा है?
iframe तत्व माता-पिता DOM में है, लेकिन एम्बेडेड दस्तावेज़ एक अलग ब्राउज़िंग संदर्भ में अपने DOM के साथ रहता है।
क्या JavaScript एक क्रॉस-ओरिजिन iframe पढ़ सकता है?
स्वतंत्र रूप से नहीं। समान-उत्सर्जन नीति सीधे DOM एक्सेस को ब्लॉक करती है, जबकि नियंत्रित संचार पोस्टमैसेज का उपयोग कर सकता है जिसमें सख्त उत्पत्ति और पेलोड मान्यता होती है।
iframe सैंडबॉक्स विशेषता क्या करती है?
सैंडबॉक्स एम्बेडेड संदर्भ पर प्रतिबंध लागू करता है, और अनुमति टोकन विशेष क्षमताओं जैसे स्क्रिप्ट या फॉर्म को चुनिंदा रूप से पुनर्स्थापित करता है।
स्वचालन iframe को क्यों देख सकता है लेकिन इसके बटन को नहीं?
बटन बच्चे दस्तावेज़ का है, इसलिए स्वचालन को तत्वों के अंदर स्थित करने से पहले सही फ्रेम में प्रवेश करना या लक्षित करना होगा।