विजेट - इफ्रेम बनाम जावास्क्रिप्ट

Question

मुझे एक विजेट विकसित करना है जिसका उपयोग किसी तृतीय पक्ष साइट द्वारा किया जाएगा। यह एक सोशल नेटवर्किंग साइट पर तैनात करने के लिए एक आवेदन नहीं है। मैं साइट लोगों को एक आईफ्रेम के स्रोत के रूप में उपयोग करने के लिए एक लिंक दे सकता हूं या मैं इसे जावास्क्रिप्ट अनुरोध के रूप में विकसित कर सकता हूं।

क्या कोई मुझे 2 दृष्टिकोण (आईफ्रेम बनाम जेएस) के बीच व्यापार बंद बता सकता है?

Answer 1

अच्छा पता करने के लिए यह एक सामाजिक नेटवर्किंग साइट में नहीं तैनात किया जाना है कि ... कि केवल वेब ;-)

क्या सबसे उपयोगी होगा अपने विजेट पर निर्भर करता है के बाकी छोड़ देता है। IFrames और जावास्क्रिप्ट आम तौर पर काफी अलग उद्देश्यों को पूरा करते हैं, और मिश्रित किया जा सकता है (यानी एक आईफ्रेम के अंदर जावास्क्रिप्ट, या जावास्क्रिप्ट एक आईफ्रेम बनाते हैं)।

• आईफ्रेम को आकार देने के मुद्दे मिल गए; अगर यह पृष्ठ पर एक सटीक फिट दिखना चाहिए था, आप जानते हैं कि यह सभी ब्राउज़रों पर एक ही renders है, तो डेटा यह कंटेनर आदि है अतिप्रवाह नहीं होगा?
• IFrames का सरल हैं। वे एक साधारण, स्थैतिक एचटीएमएल पेज हो सकते हैं।
• IFrames का उपयोग करते समय, आप काफी स्पष्ट रूप से अपने विजेट का पर्दाफाश।
• लेकिन फिर फिर, आपकी तीसरी पार्टी साइट में किसी दिए गए यूआरएल में एचएमटीएल क्यों शामिल नहीं है? तब HTML को जावास्क्रिप्ट को विस्तारित करने के लिए बढ़ाया जा सकता है जब आपको इसकी आवश्यकता हो।
• शुद्ध जावास्क्रिप्ट अधिक लचीलेपन के लिए लेकिन कुछ जटिलता की कीमत पर अनुमति देता है।

Answer 2

मैं एक ही सवाल के बारे में खोज रहा था और मैं इस दिलचस्प लेख पाया:
http://prettyprint.me/prettyprint.me/2009/05/30/widgets-iframe-vs-inline/

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

मैं समय के साथ कई तरह के विजेट लिखा है दोनों "कच्चे" विगेट्स कि किसी भी साइट के साथ-साथ iGoogle गैजेट जो अधिक संरचित, worpress *, टाइपपैड और ब्लॉगर विगेट्स हैं में एम्बेडेड प्राप्त कर सकते हैं, तो मैं कर रहा हूँ मेरे अनुभव को साझा करने के लिए खुश।

एक विजेट लेखक के रूप में, विगेट्स क्लाइंट की तरफ (सरल एम्बेड करने योग्य HTML कोड) चलाने है कि आप एक iframe के भीतर अपने विजेट लिख रहे हैं या बस पृष्ठ इनलाइन और यह डोम का का हिस्सा बनाने का विकल्प है के लिए होस्टिंग पेज। पोस्ट के बाकी पक्ष-विपक्ष दोनों तरीकों में से चर्चा करता है।

यह तकनीकी रूप से कैसे किया जाता है? कैसे एक iframe उपयोग करने के लिए या कैसे एक इनलाइन विजेट लागू करने के लिए?

इफ्रेम कुछ कार्यान्वित करने के लिए आसान हैं।निम्न उदाहरण renders एक सरल आइफ्रेम विजेट: http://my-great-widget.com/widgwt 'चौड़ाई = "100" ऊंचाई = "100" frameborder =' 0 '>

frameborder =' 0 ' यह सुनिश्चित करने के लिए प्रयोग किया जाता है कि ifrmae की सीमा नहीं है, इसलिए यह पृष्ठ पर अधिक प्राकृतिक दिखती है। http://my-great-widget.com/widget एक पूर्ण HTML पृष्ठ के रूप में विजेट सामग्री की सेवा करने के लिए ज़िम्मेदार है।

इनलाइन गैजेट इस प्रकार दिखाई देंगे:

समारोह createMyWidgetHtml() {वापसी "नमस्ते विजेट की दुनिया"; } document.getElementById ('myWidget')। आंतरिक HTML = createMyWidgetHtml(); जैसा कि आप देख सकते हैं, फ़ंक्शन myWidgetHtml() को के लिए वास्तविक विजेट सामग्री बनाने के लिए ज़िम्मेदार बनाता है और यह आवश्यक नहीं है कि ऐसा करने के लिए सर्वर से बात करें। Iframe उदाहरण में सर्वर होना चाहिए। इनलाइन उदाहरण में सर्वर, होने की आवश्यकता नहीं है, हालांकि यदि आवश्यक हो, तो सर्वर से डेटा प्राप्त करना संभव है, जो वास्तव में एक बहुत ही आम मामला है, विजेट आमतौर पर सर्वर पक्ष कोड कॉल करते हैं। इनलाइन विधि सर्वर साइड कोड का उपयोग ऑन-डेमांड जावास्क्रिप्ट के माध्यम से किया जाता है।

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

तो बड़ा सौदा क्या है? क्या फर्क पड़ता है? कई महत्वपूर्ण अंतर हैं, इसलिए यहां पोस्ट का दिलचस्प हिस्सा शुरू होता है।

सुरक्षा। iFrame विजेट अधिक सुरक्षित हैं।

गैजेट्स को कौन से जोखिम लगाते हैं और वास्तव में जोखिम में कौन रखा जाता है? साइट के उपयोगकर्ता और साइट की प्रतिष्ठा जोखिम पर हैं।

इनलाइन गैजेट के साथ ब्राउज़र सोचता है कि गैजेट का स्रोत कोड कोड होस्टिंग साइट से आता है। आइए मान लें कि आप ब्राउज़ कर रहे हैं अपने पसंदीदा मेल एप्लिकेशन http://my-wonderful-email.com और यह मेल एप्लिकेशन ने एक विजेट स्थापित किया है जो http://great-clock-widgets.com/ से घड़ी प्रदर्शित करता है। यदि वह विजेट इनलाइन विजेट के रूप में कार्यान्वित किया गया है, तो ब्राउज़र सोचता है कि विजेट का कोड पर मेरा- अद्भुत-email.com है और महान-clid-widgets.com पर नहीं है और इसलिए यह विजेट के कोड को अंततः पहुंच प्राप्त करने देगा के स्वामित्व वाली कुकीज़ के लिए मेरा- अद्भुत-email.com और विजेट का बुरा लेखक आपके ईमेल चुराएगा। यह जानना महत्वपूर्ण है कि ब्राउज़र पर ध्यान नहीं दिया जाता है कि जावास्क्रिप्ट फ़ाइल होस्ट की गई है; जब तक कोड उसी फ्रेम पर चलता है, ब्राउज़र फ्रेम के डोमेन पर सभी कोड को उत्प्रेरक के रूप में मानता है। इसलिए, आप उपयोगकर्ता को अपने ईमेल खाते पर नियंत्रण खोकर चोट पहुंचते हैं और मेरा-अद्भुत ईमेल इसकी प्रतिष्ठा खोकर चोट पहुंचाता है।

एक ही घड़ी एक iframe और आइफ्रेम स्रोत के अंदर कार्यान्वित प्राप्त होंगे तो पेज स्रोत (जो आम मामला है, उदाहरण के लिए पेज स्रोत है my-wonderful-email.com और गैजेट से अलग है स्रोत महान-clock-widgets.com है) तो ब्राउज़र घड़ी विजेट को पृष्ठ कुकीज़ तक पहुंचने की अनुमति नहीं देगा, और न ही मेजबान पृष्ठ डोम समेत होस्टिंग दस्तावेज़ के किसी अन्य भाग तक पहुंच की अनुमति देगा। इस तरह से और अधिक सुरक्षित है। वास्तव में, व्यक्तिगत घर iGoogle जैसे पृष्ठ इनलाइन गैजेट्स को भी अनुमति नहीं देते हैं, केवल iframe गैजेट की अनुमति है। (इनलाइन गैजेट केवल दुर्लभ मामलों में अनुमति दी जाती है, iGoogle टीम द्वारा के बाद ही पूरी तरह से निरीक्षण सुनिश्चित करने के लिए वे दुर्भावनापूर्ण नहीं कर रहे हैं)

सारांश में, आइफ्रेम विगेट्स तरह से अधिक सुरक्षित हैं। हालांकि, वे कार्यक्षमता में अधिक सीमित हैं। इसके बाद हम चर्चा करेंगे कि आप कार्यक्षमता में क्या खो देते हैं।

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

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

देखो और समझदार बुद्धिमान, इनलाइन जीतता है। लेकिन ध्यान दें कि यह वास्तव में आपके विजेट एप्लिकेशन पर निर्भर करता है। यदि आप बस एक घड़ी करना चाहते हैं, तो आपको भी एक आईफ्रेम के साथ मिल सकता है।

सर्वर साइड बनाम क्लाइंट साइड IFrmaes के लिए आपको एक यूआरएल यूआरएल निर्दिष्ट करने की आवश्यकता है ताकि एक आईफ्रेम का उपयोग कर विजेट को कार्यान्वित करते समय आपके पास सर्वर पक्ष कोड होना चाहिए।यह दोनों एक सीमा है और कुछ करने के लिए एक सिरदर्द (एक सर्वर, डोमेन नाम आदि के मालिक, लोड के साथ काम कर, नेटवर्क के बिल आदि का भुगतान) बल्कि दूसरों के लिए यह वास्तव में iframes के पक्ष में एक बात यह है हो सकता है b/c यह आइए आप पूरी तरह से, सर्वर साइड प्रौद्योगिकियों में अपने विजेट लिखने ताकि आप कोड का एक बहुत कुछ लिख सकते हैं और वास्तव में लगभग सभी इसके बारे में अपने पसंदीदा सर्वर साइड प्रौद्योगिकी का उपयोग है कि क्या यह asp.net, Django, ROR, हो jsp, struts, पर्ल या अन्य डायनासोर। इनलाइन गैजेट को लागू करते समय आप अपने जावास्क्रिप्ट निंजा का अधिक से अधिक अभ्यास करेंगे।

तब निर्णय एल्गोरिदम क्या है? विजेट लेखक: यदि विजेट को आईफ्रेम के रूप में कार्यान्वित किया जा सकता है, तो उपयोगकर्ता सुरक्षा और विश्वास को संरक्षित करने के लिए बस एक इफ्रेम को प्राथमिकता दें। यदि किसी विजेट को इनलाइनिंग की आवश्यकता होती है (और माध्यम अनुमति देता है, उदाहरण के लिए iGoogle और दोस्तों) इनलाइन का उपयोग नहीं करते हैं, लेकिन की हिम्मत उपयोगकर्ताओं के विश्वास का शोषण नहीं करते हैं!

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

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

हैप्पी विजेटिंग लोग!

• कुछ ब्लॉग प्लेटफार्मों विजेट्स के लिए कुछ अलग संरचना है और वे कभी कभी दोनों विगेट्स प्लग इन उनकी कार्यक्षमता में सहसंबंधी सकता है हो सकता है, लेकिन चर्चा यहाँ की बात के लिए मैं lously अवधि विजेट का उपयोग करेंगे "कच्चे" प्रकार है जो क्लाइंट पक्ष के होते हैं जावास्क्रिप्ट कोड ** हालांकि ज्यादातर मामलों में आप विगेट्स उन्हें यह के अनुरूप बनाने के लिए होस्टिंग पृष्ठ से शैलियों के वारिस करना चाहते हैं चर्चा करने के लिए, कभी कभी आप वास्तव में नहीं चाहते हैं पृष्ठ से शैलियों को प्राप्त करने के लिए विजेट, इसलिए में इस मामले में iFrames आपको अपना सीएसएस स्क्रैच से शुरू करने देता है।

Answer 3

मुझे यकीन है कि कई डेवलपर्स कर रहा हूँ/साइट मालिकों एक जावास्क्रिप्ट समाधान है कि वे बल्कि एक iframe का उपयोग करने से उनकी जरूरतों के लिए शैली दे सकते हैं की सराहना करेंगे। अगर मैं किसी तीसरे पक्ष से एक घटक शामिल करने जा रहा था, तो मैं इसे जावास्क्रिप्ट के माध्यम से करूंगा क्योंकि मेरे पास अधिक नियंत्रण होगा।

जहां तक ​​उपयोग की आसानी है, दोनों सादगी में समान हैं, इसलिए वहां कोई वास्तविक व्यापार नहीं है।

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

Answer 4

यदि विजेट को आईफ्रेम में एम्बेड किया जा सकता है, तो यह होस्टिंग साइट के अग्रभाग प्रदर्शन के लिए बेहतर होगा क्योंकि iframes सामग्री डाउनलोड को अवरुद्ध नहीं करता है। हालांकि, जैसा कि अन्य ने टिप्पणी की है कि iframes का उपयोग करने के लिए अन्य दोष हैं।

आप जावास्क्रिप्ट में लागू करते हैं तो करते हैं, frontend performance best practices पर विचार करें जब विकासशील। विशेष रूप से, आपको Non blocking javascript loading पर देखना चाहिए। Google Analytics और अन्य तृतीय पक्ष विजेट प्रदाता लोड करने की इस विधि का समर्थन करते हैं। यदि आप पेज के निचले हिस्से में जावास्क्रिप्ट लोड कर सकते हैं तो यह भी मदद करेगा।

Answer 5

दोनों क्यों नहीं कर रहे हैं?

मैं तृतीय पक्ष साइटों की तरह एक स्क्रिप्ट की पेशकश करने के लिए पसंद:

<script type="text/javascript" src="urlToScript"></script> 

अपने सर्वर पर फ़ाइल की तरह दिखता है:

document.writeln('<iframe src="pathToYourGroovyWidget" 
name="MagicIframe" width="300" height="600" align="left" scrolling="no" 
marginheight="0" marginwidth="0" frameborder="0"></iframe>'); 

अद्यतन:

Iframe का उपयोग करके के बड़े नुकसान जो आपके सर्वर पर एक यूआरएल को इंगित करता है कि यदि कोई आपके सर्वर से यूआरएल पर क्लिक करता है तो आप "असली" बैकलिंक उत्पन्न नहीं करते हैं।

Answer 6

iframes का बड़ा प्लस: सभी सीएसएस और जेएस मेजबान पृष्ठ से अलग हो गए हैं, इसलिए आपका मौजूदा सीएसएस बस काम करता है। (यदि आप मेजबान साइट को अपनी सामग्री को फिट करने के लिए शैली बनाना चाहते हैं, तो यह निश्चित रूप से कम है।)

iframes का बड़ा शून्य: उनके पास निश्चित चौड़ाई और ऊंचाई है और आपकी सामग्री बड़ी होने पर स्क्रॉल-बार दिखाई देंगे ।