🧀 👨🏼‍🔬 🧑🏾‍🤝‍🧑🏻 किसी अन्य डोमेन से iFrame सामग्री एक्सेस करें 🥘 🙍🏽 🕓

आज मैं इस बारे में बात करना चाहता हूं कि हमने अपने प्रोजेक्ट indexisto.com में Google वेबमास्टर मार्कर उपकरण का एक एनालॉग कैसे बनाया। आपको याद दिला दूं कि मार्कर आपके Google वेबमास्टर खाते का एक उपकरण है जो आपको टैग्स के साथ अपने ओपन ग्राफ़ पृष्ठों को एनोटेट करने की अनुमति देता है। ऐसा करने के लिए, आप बस माउस को पृष्ठ पर पाठ के एक टुकड़े के साथ चुनें और इंगित करें कि यह एक शीर्षक है, और यह एक रेटिंग है। आपका पेज वेबमास्टर कार्यालय में इफ्रेम में भरा हुआ है।

अब Google, आपकी साइट पर एक समान पेज से मिल रहा है, पहले से ही जानता है कि उस पर किस तरह की सामग्री प्रकाशित हुई है, और इसे खूबसूरती से सार में कैसे लिखा जाए (लेख, उत्पाद, वीडियो ..)

हमें एक समान कार्यक्षमता की आवश्यकता थी। कार्य सरल और विशेष रूप से ग्राहक पक्ष लगता था। हालांकि, व्यवहार में, समाधान क्लाइंट पक्ष और सर्वर साइड के जंक्शन पर स्थित है ("स्वच्छ" जेएस प्रोग्रामर विभिन्न प्रॉक्सी सर्वरों के बारे में कुछ भी नहीं जानते हैं और प्रोजेक्टाइल को प्राप्त करने के लिए बहुत लंबा समय ले सकते हैं)। उसी समय, मुझे इंटरनेट पर एक लेख नहीं मिला जो शुरुआत से अंत तक सभी प्रौद्योगिकी का वर्णन करेगा। मैं बेवेल उपयोगकर्ता और हमारी सुरक्षा टीम को उनकी मदद के लिए धन्यवाद कहना चाहता हूं।

हमारे मामले में, हम चाहेंगे कि वेबमास्टर आसानी से (एक माउस क्लिक के साथ) अपने पृष्ठ के कुछ तत्वों के लिए xPath मान प्राप्त करें।

इफ्रेम "सेम ओरिजिन"

और इसलिए, हमारे व्यवस्थापक पैनल में, व्यक्ति को अपनी साइट के पृष्ठ का URL दर्ज करना होगा, हम इसे iFrame में प्रदर्शित करेंगे, व्यक्ति माउस को जहां आवश्यक होगा, वहां प्रहार करेगा, हमें वांछित xPath मिलेगा। सब कुछ ठीक होगा, लेकिन ब्राउज़र सुरक्षा नीति के कारण, हमारे व्यवस्थापक पैनल (हमारे डोमेन) में iframe में लोड किए गए किसी अन्य डोमेन से पृष्ठ की सामग्री तक हमारी पहुंच नहीं है।

कोर - क्रॉस ओरिजिनल रिसोर्स शेयरिंग

कुछ लोगों ने मुझे कॉर्स का इस्तेमाल करने की सलाह दी। एक फैशनेबल तकनीक जो ब्राउज़र में किसी अन्य डोमेन से सामग्री तक पहुंच के साथ कई समस्याओं को हल करती है और आपको समान मूल नीति प्रतिबंधों को बायपास करने की अनुमति देती है।
वह साइट जो किसी विदेशी डोमेन के पृष्ठों पर अपनी सामग्री तक पहुँच देना चाहती है, बस http हेडर में लिखती है:

Access-Control-Allow-Origin: http://example.com

और ब्राउज़र से दूसरे डोमेन के पेज से आने वाले अनुरोध के http हेडर में मूल क्षेत्र होना चाहिए:

 Origin: www.mysupersite.com

यह स्पष्ट है कि ब्राउज़र अनुरोध करने के लिए मूल फ़ील्ड को जोड़ता है। हम हैबे पर एक लेख जोड़ेंगे और हम देखेंगे कि आधुनिक ब्राउज़र मूल को उसी डोमेन के अनुरोध के लिए भी जोड़ते हैं:

लेकिन:

ब्राउज़र iframe में लोड किए गए पृष्ठ के लिए अनुरोध हेडर में मूल नहीं डालता है (क्या कोई समझा सकता है कि क्यों?)
हम वेबमास्टर्स से एक्सेस-कंट्रोल-अनुमति-मूल हेडर लिखने के लिए नहीं कहना चाहते हैं

आईफ्रेम सैंडबॉक्स

एक और फैशनेबल तकनीक। सैंडबॉक्स आईफ्रेम टैग का एक गुण है। आप मान -समान-मूल को इस विशेषता के मान के रूप में सेट कर सकते हैं। इससे पहले कि मैं इस विषय को खोदना शुरू करूँ, मुझे नहीं पता था कि वास्तव में यह विशेषता क्या कर रही है, लेकिन यह बहुत ही आकर्षक लग रहा था। हालाँकि, सैंडबॉक्स विशेषता केवल यह सीमित करती है कि iframe में लोड किया गया पृष्ठ क्या कर सकता है और मूल दस्तावेज़ से फ़्रेम की सामग्री तक पहुँचने के मुद्दे से संबंधित नहीं है।

विशेष रूप से, मान अनुमति-समान-मूल (या इसकी अनुपस्थिति) केवल यह कहता है कि iframes को हमेशा किसी और के डोमेन से डाउनलोड के रूप में माना जाना चाहिए (उदाहरण के लिए, आप इस तरह के फ्रेम से मूल दस्तावेज़ के डोमेन के लिए AJAX अनुरोध नहीं भेज सकते हैं)

आइए देखें कि यह Google द्वारा कैसे किया जाता है

बड़े भाई ने किस तरह से समय निकाला

Iframe तत्व की src विशेषता पर ध्यान दें: src="https://wmthighlighter.googleusercontent.com/webmasters/data-highlighter/RenderFrame/007....." - हमारा पेज Google डोमेन से व्यवस्थापक पैनल में लोड किया गया है। इससे भी अधिक गंभीर: स्रोत दस्तावेज़ में स्क्रिप्ट और चित्र भी प्रॉक्सी के माध्यम से चलाए जाते हैं। सभी src, href ... html में सम्‍मिलित लोगों के साथ प्रतिस्थापित किया गया है। कुछ इस तरह:

आपके पृष्ठ का उपयोग करने वाले सभी संसाधन Google प्रॉक्सी पर भी संग्रहीत हैं। Google प्रॉक्सी सर्वर पर हमारे लोगो का एक उदाहरण है।

CGIProxy?

यह तुरंत लग रहा था कि वही करने के लिए आपको CGIProxy की तरह एक पूर्ण प्रॉक्सी को बढ़ाने की आवश्यकता है। यह प्रॉक्सी सर्वर लगभग Google की wmthighlighter.googleusercontent.com जैसी ही चीज़ करता है

ब्राउज़िंग सत्र शुरू करने के लिए स्क्रिप्ट के URL पर जाएं। एक बार जब आप प्रॉक्सी के माध्यम से एक पृष्ठ प्राप्त कर लेते हैं, तो यह सब कुछ लिंक करता है जो स्वचालित रूप से प्रॉक्सी के माध्यम से जाएगा। आप उन पृष्ठों को बुकमार्क कर सकते हैं जिन्हें आप ब्राउज़ करते हैं, और आपके बुकमार्क प्रॉक्सी के माध्यम से जाएंगे क्योंकि उन्होंने पहली बार किया था।

आपका प्रॉक्सी!

हालाँकि, यदि आप कार्य को कम करते हैं, तो एक सरल प्रॉक्सी लिखना आपके लिए बहुत आसान है। तथ्य यह है कि Google इसे इस तरह से करता है, प्रॉक्सी के माध्यम से सभी पृष्ठ सामग्री को चलाना पूरी तरह से वैकल्पिक है। हमें अपने डोमेन से दिए जाने वाले किसी भी पृष्ठ का html चाहिए, और मूल डोमेन से संसाधन लोड किए जा सकते हैं। Https हम अब तक गिरा दिया है।
सुपर प्रदर्शन या सेटिंग्स की सुविधा का लक्ष्य इसके लायक नहीं है, और आप इसे नोड.जेएस से पीएचपी तक जल्दी और किसी भी चीज़ पर कर सकते हैं। हमने जावा में एक सर्वलेट लिखा।

डाउनलोड पृष्ठ

प्रॉक्सी सर्वलेट क्या करना चाहिए? प्राप्त पैरामीटर के माध्यम से, हमें लोड किए जाने वाले पृष्ठ का url मिलता है, फिर पृष्ठ को डाउनलोड करें।

पृष्ठ की एन्कोडिंग (एचटीएमएल में http प्रतिक्रिया या चारसेट के माध्यम से) को निर्धारित करना सुनिश्चित करें - हमारे प्रॉक्सी को उसी एन्कोडिंग का जवाब देना चाहिए जैसे पृष्ठ लोड किया गया है। हम केवल मामले में एक सामग्री-प्रकार को परिभाषित करेंगे, हालांकि यह स्पष्ट है कि हमें पाठ / html में एक पृष्ठ मिलता है और इसे उसी तरह से देना है।

  final String url = request.getParameter("url"); final HttpGet requestApache = new HttpGet(url); final HttpClient httpClient = new DefaultHttpClient(); final HttpResponse responseApache = httpClient.execute(requestApache); final HttpEntity entity = responseApache.getEntity(); final String encoding = EntityUtils.getContentCharSet( entity ); final String mime = EntityUtils.getContentMimeType(entity); String responseText = IOUtils.toString(entity.getContent(), encoding);

* उन लोगों के लिए जो किसी और के कोड का मूल्यांकन करना पसंद करते हैं: हमारी टीम में हर किसी के पास एक ही समान कोड स्वरूपण सेटिंग है, और जब फ़ाइल को सहेजते हैं, तो ग्रहण स्वयं सभी अंतिम चर के लिए अपील करता है यदि वे कहीं और नहीं बदलते हैं। जिस तरह से अंत में काफी सुविधाजनक है।

पेज कोड में सापेक्ष URL को निरपेक्ष में बदलें

आपको पृष्ठ में src और href (शैली फ़ाइलों, चित्रों का पथ) के साथ सभी विशेषताओं से गुजरने की आवश्यकता है, और सापेक्ष URL को पूर्ण के साथ प्रतिस्थापित करें। अन्यथा, पृष्ठ हमारे प्रॉक्सी पर कुछ फ़ोल्डरों से चित्र डाउनलोड करने का प्रयास करेगा, जो हमारे पास स्वाभाविक रूप से नहीं है। किसी भी भाषा में तैयार कक्षाएं हैं, या आप स्टैकओवरफ़्लो पर इस मामले के लिए कोड स्निपेट पा सकते हैं:

  final URI uri = new URI(url); final String host = uri.getHost(); responseText = replaceRelativeLinks(host,responseText);

हम html भेजते हैं

यही है, प्रॉक्सी सर्वलेट तैयार है। हम वांछित एन्कोडिंग और माइम सेट करते हुए, उत्तर भेजते हैं।

  protected void sendResponse(HttpServletResponse response, String responseText, String encoding, String mime) throws ServletException, IOException { response.setContentType(mime); response.setCharacterEncoding(encoding); response.setStatus(HttpServletResponse.SC_OK); response.getWriter().print(responseText ); response.flushBuffer(); }

परिनियोजन और परीक्षण

हम अपने प्रॉक्सी सर्वलेट को adminpanel.indexisto.com व्यवस्थापक के समान पते पर तैनात करते हैं, वेबमास्टर के वेबसाइट पेज को प्रॉक्सी के माध्यम से हमारे iframe में लोड करते हैं, और सभी क्रॉस-डोमेन समस्याएं गायब हो जाती हैं।
हमारे प्रॉक्सी में काम करता है

 http://adminpanel.indexisto.com/highlighter?url=http://habrahabr.ru

- यह है कि हब्र हमारे डोमेन से कैसे बूट होगा। हम iframe में यह पता देते हैं और व्यवस्थापक पैनल में JS के माध्यम से HOM DOM ट्री तक पहुँचने का प्रयास करते हैं - सब कुछ काम करता है। CSRF स्वाभाविक रूप से काम नहीं करेगा क्योंकि पृष्ठ हमारे प्रॉक्सी से भरा हुआ है जिसमें कुकीज़ नहीं हैं।

SSRF मुद्दा

हम अपने आइफ्रेम में एक साइट को "लोकलहोस्ट" पते के साथ लोड करते हैं - उफ़, यहां हमारे नगीनेक्स का शुरुआती पृष्ठ है। आइए हमारे प्रॉक्सी सर्वर के समान नेटवर्क पर कुछ आंतरिक (बाहर नहीं दिखाई देने वाले) संसाधन का प्रयास करें। उदाहरण के लिए सुरक्षित_क्रिम.इंडेक्सिस्टो.कॉम - सब कुछ जगह में है।
बेशक, हम अपने प्रॉक्सी में इन चीजों को प्रतिबंधित करने की कोशिश करते हैं, अगर कोई स्थानीय लोकलहोस्ट के लिए कोशिश करता है, तो हम कुछ भी वापस किए बिना बाहर निकल जाते हैं:

 if (url.contains("localhost")||url.contains("127")||url.contains("highlighter")||url.contains("file")) { LOG.debug("Trying to get local resource. Url = " + url); return; }

लेकिन हम यहां सभी नेटवर्क संसाधनों को सूचीबद्ध नहीं करेंगे। इसलिए आपको प्रॉक्सी को पूरी तरह से अलग-थलग वातावरण में ले जाने की आवश्यकता है ताकि मशीन को इंटरनेट, खुद और हमारे प्रॉक्सी के अलावा कुछ भी दिखाई न दे। हम कार का चयन करते हैं, वहां अपना सर्वलेट कॉन्फ़िगर करते हैं और शुरू करते हैं।

XSS मुद्दा

हम अपने iframe में अपना पेज लोड करते हैं जिस पर हम लिखते हैं:

 <script>alert('xss')</script>

एक चेतावनी चबूतरे। यह दुखद है। आप इस iframe विशेषता सैंडबॉक्स अनुमति-स्क्रिप्ट के आसपास प्राप्त कर सकते हैं, लेकिन पुराने ब्राउज़रों के बारे में क्या है जो वास्तव में इस विशेषता को नहीं समझते हैं? आप केवल अपनी कुकीज़ चुरा सकते हैं, लेकिन आप उन्हें वैसे भी नहीं छोड़ सकते।
हम न केवल एक अलग मशीन पर सर्वलेट निकालते हैं, बल्कि इसे एक अलग उपडोमेन highlighter.indexisto.com भी बनाते हैं ।

हम पहुंचे, हमने क्रॉस-डोमेन प्रतिबंधों को दरकिनार करते हुए, अपना स्वयं का समाधान तोड़ दिया। अब हम फिर से iframe सामग्री तक नहीं पहुँच सकते।

एक दिलचस्प विचार।

Google से समाधान में कटौती करने के लिए, मैंने अपना पेज खोला, जो एक अलग विंडो में प्रॉक्सी के माध्यम से दिया गया है

और कंसोल में एक अजीब त्रुटि देखी गई।

 CrossPageChannel: Can't connect, peer window-object not set.

यह स्पष्ट हो गया कि एक संगठित तरीके से सब कुछ आपके डोमेन से एक iframe में केवल पृष्ठ लोड करने की तुलना में अधिक जटिल है। पेज एक दूसरे से संवाद करते हैं। तदनुसार, हम window.postMessage की ओर बढ़ते हैं

संदेश पोस्ट करें

यह सुनिश्चित करने के लिए हमारे वेबमास्टरों को हमारी स्क्रिप्ट को पृष्ठ में इंजेक्ट करने के लिए बाध्य नहीं किया गया था ताकि यह सुनिश्चित हो सके कि पृष्ठ तत्वों को माउस के साथ चुना गया था, और फिर इन तत्वों के xPath को पोस्टमैसेज के माध्यम से मूल दस्तावेज में हमें भेजें। हालाँकि, कोई भी हमारे प्रॉक्सी को iFrame में लोड किए गए पेज पर किसी भी स्क्रिप्ट को इंजेक्ट करने से नहीं रोक रहा है।
कार्यान्वयन के लिए आवश्यक सभी लिपियों को एक फ़ाइल में सहेजा जाता है, और समापन निकाय से पहले डाला जाता है :

 final int positionToInsert = responseText.indexOf("</body>"); final InputStream inputStream = getServletContext().getResourceAsStream("/WEB-INF/inject.js"); final StringWriter writer = new StringWriter(); IOUtils.copy(inputStream, writer); final String jsToInsert = writer.toString(); responseText = responseText.substring(0, positionToInsert) + jsToInsert + responseText.substring(positionToInsert, responseText.length());

अलर्ट के लिए, अलर्ट डालें - सब कुछ काम करता है।

जेएस भाग - हाथ के नीचे घर के तत्व को उजागर करें और xpath प्राप्त करें

ठीक है, हम जेएस पर आगे बढ़ेंगे जो हमने वेबमास्टर के पेज पर डाला था।
हमें उन प्रमुख तत्वों को उजागर करने की आवश्यकता है जिन पर व्यक्ति माउस को चलाता है। छाया के साथ ऐसा करना बेहतर है, क्योंकि तब तत्व नहीं हटेगा, और पूरा पृष्ठ कूद जाएगा। हम शरीर पर हैंगओवर को लटकाते हैं और हम लक्ष्य घटनाओं को देखते हैं। उसी हैंडलर में, मैं तत्व के xpath की गणना करता हूं। क्लिक पर xPath तत्व की गणना करना बेहतर है, लेकिन मैंने इस तरह के कार्यान्वयन में किसी भी ब्रेक पर ध्यान नहीं दिया।

 elmFrame.contentWindow.document.body.onmouseover= function(ev){ ev.target.style.boxShadow = "0px 0px 5px red"; curXpath = getXPathFromElement(ev.target); }

मैं यहाँ DOM तत्व का xPath प्राप्त करने के लिए कार्यान्वयन प्रदान नहीं करता हूँ। ऐसा करने के लिए कई स्निपेट्स हैं। इन स्निपेट्स को आपके कार्यों के लिए संशोधित किया जा सकता है, उदाहरण के लिए, आपको केवल xpath में टैग की आवश्यकता है। या क्या आपको आईडी की आवश्यकता है यदि वे हैं और कक्षाएं हैं यदि कोई आईडी नहीं है - हर किसी की अपनी आवश्यकताएं हैं।

यहाँ एक अंतर्निहित स्क्रिप्ट के साथ हैबर के हैक किए गए मुख्य पृष्ठ का एक उदाहरण है:
http://highlighter.indexisto.com/?md5=6ec7rdHxUfRkrFy55jrJQA==&url=http%3A%2F%2Fhabrahabr.ru&expires=1390468360

जेएस भाग - प्रसंस्करण पर क्लिक करें

Iframe में पृष्ठ पर एक व्यक्ति का क्लिक तुरंत "मर जाता है" (iframe में लिंक पर क्लिक नहीं होगा)। और हम प्राप्त xPath की एक स्ट्रिंग मूल विंडो में भी भेजते हैं (हमने इसे तत्व के माउस के साथ ड्राइविंग के चरण में भी सहेजा है)

 document.body.onclick = function(ev){ window.parent.postMessage( curXpath, "*"); ev.preventDefault(); ev.stopPropagation(); }

लाभ!

यह सब, अब हमारे व्यवस्थापक पैनल में यह वेबमास्टर्स के लिए बहुत आसान हो सकता है कि वे अपने पृष्ठों पर तत्वों के लिए xpath पथ प्राप्त कर सकें।

अधिक सुरक्षा सुविधाएँ जोड़ें

ठीक है, सब कुछ हमारे लिए काम करता है, लेकिन इस तथ्य के साथ एक बिंदु है कि हमारा प्रॉक्सी पूरी तरह से असुरक्षित है। कोई भी कुछ भी घोषित कर सकता है।

हम न्यनेक्स को प्रॉक्सी के सामने रखते हैं, यह 80 पोर्ट को सुनता है, हम प्रॉक्सी को दूसरे पोर्ट पर हटा देते हैं। 80 को छोड़कर अन्य सभी बंदरगाह बाहरी दुनिया से बंद हैं।

अब चलो केवल व्यवस्थापक पैनल के माध्यम से प्रॉक्सी काम करते हैं। जिस समय वेबमास्टर अपनी साइट के URL में प्रवेश करता है, हम जल्दी से उस सर्वर पर चले जाते हैं, जहाँ हम वर्तमान टाइमस्टैम्प + 1 घंटे से md5 हैश उत्पन्न करते हैं, जब URL स्वयं और सुपर सीक्रेट:

  final String md5Me = timeStampExpires + urlEncoded + "SUPERSECRET"; final MessageDigest md = MessageDigest.getInstance("MD5"); md.reset(); md.update(md5Me.getBytes("UTF-8")); String code = Base64.encodeBase64String(md.digest()); code = code.replaceAll("/", "_"); code = code.replaceAll("\\+","-");

यह भी ध्यान दें कि कोड में हमें md5 लाइन सामान्य हेक्स की तरह नहीं मिलती है, लेकिन base64 एन्कोडिंग में, इसके परिणामस्वरूप md5 में हम स्लैश के लिए अजीब प्रतिस्थापन करते हैं और प्लस अक्षर अंडरस्कोर और डैश के साथ।
तथ्य यह है कि ngnix का उपयोग करता है base64 फ़ाइल नाम सुरक्षित वर्णमाला उपकरण.ietf.org/html/rfc3548#page6/6
और जावा विहित बेस 64 देता है।

हमारे व्यवस्थापक पैनल में सुरक्षा md5 के साथ सर्वर से प्रतिक्रिया प्राप्त करने के बाद, हम ifr में निम्नलिखित यूआरएल को लोड करने का प्रयास कर रहे हैं:
highlighter.indexisto.com/?md5=Dr4u2Yeb3NrBQLgyDAFrHg==&url=http%3A%2F%2Fhabrahabr.ru&expires=1389791582

अब nginx मॉड्यूल HttpSecureLinkModule को कॉन्फ़िगर करें। यह मॉड्यूल सभी पैरामीटरों के md5 की जांच करता है जो उसके पास आया था (उसी गुप्त कुंजी को मॉड्यूल में व्यवस्थापक सर्वलेट में पंजीकृत किया गया है), यह जांचता है कि क्या लिंक समाप्त हो गया है, और केवल इस मामले में हमारे प्रॉक्सी सर्वलेट के लिए अनुरोध को अग्रेषित करें।

अब कोई भी हमारे प्रॉक्सी का उपयोग व्यवस्थापक क्षेत्र के बाहर से नहीं कर सकता है, और वह छवि भी सम्मिलित नहीं कर सकता है जो हमारे सर्वर पर कहीं पर भी है - वैसे भी एक घंटे में उसकी मृत्यु हो जाएगी।

कि सभी लोग हैं!

Google स्वाभाविक रूप से अपने मार्कर टूल के साथ बहुत आगे बढ़ गया। पृष्ठ पर तत्व को स्पष्ट रूप से पहचानने के लिए, आपको एक ही प्रकार के कई पृष्ठों पर एक ही तत्व (उदाहरण के लिए, लेख का शीर्षक) को चिह्नित करने की आवश्यकता है, ताकि आप xpath का अधिक सटीक रूप से निर्माण कर सकें और "id-2334" के विभिन्न आईडी प्रकार को छोड़ दें, जो स्पष्ट रूप से केवल एक पृष्ठ पर काम करेगा । हमारे व्यवस्थापक पैनल में, जबकि xpath को स्वीकार्य परिणाम प्राप्त करने के लिए अपने हाथों से सही किया जाना चाहिए

किसी अन्य डोमेन से iFrame सामग्री एक्सेस करें