जब आप अपने ब्राउज़र में वेबसाइट ब्राउज़ करते हैं तो वास्तव में क्या होता है?

Question

जब हम एक ब्राउज़र में www.cnn.com टाइप करते हैं तो पर्दे के पीछे क्या होता है और स्क्रीन पर सूचना कैसे प्रदर्शित होती है?

एक तकनीकी व्याख्या की बहुत सराहना की जाएगी।

Comments

इस पुस्तक में एक महान तकनीकी व्याख्या पाई जा सकती है: कंप्यूटर नेटवर्किंग: एक टॉप-डाउन दृष्टिकोण 6 वाँ संस्करण (लिंक: पुस्तक )। (पृष्ठ ४ ९ ५-५००) वे काफी मात्रा में विस्तार में जाते हैं; जब कंप्यूटर उपयोगकर्ता ब्राउज़र में एक वेबसाइट प्रदर्शित होता है, तब तक चालू होने से क्या होता है। स्लाइड्स के इस सेट में किताब में बताई गई चीजों का स्वाद ले सकते हैं। (लिंक: स्लाइड्स 88 से 95)

— स्लॉथवर्क्स 5

आप विस्तृत जानकारियां यहां पा सकते हैं: github.com/vasanthk/how-web-works या वहाँ html5rocks.com/en/tutorials/internals/howbrowserswork

— एमईएमएस

Answer 1

ब्राउज़र: "ठीक है, इसलिए, मेरे पास इस पते का अनुरोध करने वाला एक उपयोगकर्ता है: www.cnn.com। मैं समझती हूं कि कोई स्लैश या कुछ भी नहीं है, यह एक मुख्य पृष्ठ का प्रत्यक्ष अनुरोध है। कोई प्रोटोकॉल या पोर्ट परिभाषित भी नहीं था।" तो मुझे लगता है कि यह HTTP है और 80 पोर्ट करने जा रहा है ... ओह ठीक है, पहले चीजें पहले। अरे डीएनएस, पाल, उठो! यह www.cnn.com कहाँ छुपा रहा है? "

DNS: "राइट ... एक सेकंड रुको, मैं ISP सर्वर से पूछूंगा। ठीक है, यह 157.166.226.25 जैसा दिखता है।"

ब्राउज़र: "ठीक है। इंटरनेट प्रोटोकॉल सूट, आपकी बारी! 157.166.226.25 पर कॉल करें। कृपया उन्हें यह HTTP हेडर भेजें। यह उनके मुख्य पृष्ठ की मूल संरचना और सामग्री के लिए पूछ रहा है, इसलिए मुझे पता है कि और क्या प्राप्त करना है ... ओह ठीक है।" ऐसा नहीं है कि आप इस बारे में परवाह करेंगे मुझे लगता है। "

टीसीपी / आईपी: "आप मेरी बारी का क्या मतलब है ? जैसे कि मैं अभी DNS के लिए अपनी पीठ ठीक से काम नहीं कर रहा था? भगवान, यहाँ थोड़ी प्रशंसा पाने में क्या लगता है ..."

ब्राउज़र: ...

टीसीपी / आईपी: "हाँ, हाँ ... कनेक्ट कर रहा हूं ... मैं बस इसे आगे बढ़ाने के लिए प्रवेश द्वार से पूछूंगा। आप जानते हैं, यह सब इतना आसान नहीं है, मुझे आपके सुंदर अनुरोध को कई भागों में विभाजित करना होगा। इसलिए यह अंत तक पहुँचता है, और किसी भी सामान को इकट्ठा करता है जो मुझे मिलने वाले सभी हज़ारों पैकेजों से वापस भेज देता है ... आह, ठीक है, आपको परवाह नहीं है। आंकड़े। "

इस बीच, CNN मुख्यालय में, एक संदेश अंत में वेब सर्वर के दरवाजे पर समाप्त होता है।

CNN वेब सर्वर: "Nzhôô! एक ग्राहक! वह समाचार चाहता है! फ्रंट पेज! इसके बारे में कैसे?"

CNN सर्वर साइड स्क्रिप्ट इंजन: "राइट, क्या करेगा? फ्रंट पेज, राइट?"

CNN डेटाबेस सर्वर: "Yey! मेरे लिए काम करें! आपको किस सामग्री की आवश्यकता है?"

सीएनएन सर्वर साइड स्क्रिप्ट इंजन: "... उम, माफ करना डीबी, मेरे पास मेरे कैश में फ्रंट पेज की एक कॉपी है, कुछ भी संकलन करने की आवश्यकता नहीं है। लेकिन हे, इस यूजर आईडी को ले लो और इसे स्टोर कर लो, मैं इसे भेजूंगा। ग्राहक को भी, इसलिए हम जानते हैं कि हम बाद में किससे बात कर रहे हैं। ”

CNN डेटाबेस सर्वर: "Yey!"

उपयोगकर्ता के कंप्यूटर पर वापस ...

टीसीपी / आईपी: "ऊओके, यहां जवाब आता है। ओह लड़के, मुझे क्यों लग रहा है कि यह एक बड़ा होगा ..."

ब्राउज़र: "उह, वाह ... यह जावास्क्रिप्ट कोड के सभी प्रकार है ... छवियों का गुच्छा, रूपों के कुछ ... ठीक है, यह रेंडर करने के लिए थोड़ा समय लगेगा। बेहतर यह करने के लिए मिलता है। अरे, आईपी प्रणाली। एक गुच्छा अधिक सामान है जो आपको प्राप्त करने की आवश्यकता होगी। आइए देखें कि मुझे i.cdn.turner.com से कुछ स्टाइलशीट चाहिए - HTTP के माध्यम से और फ़ाइल /cnn/.element/css/2.0/common.css के लिए पूछें। और। तो उन लिपियों में से कुछ को i.cdn.turner.com पर भी लाइए, मैं अब तक छह की गिनती कर रहा हूं ... "

टीसीपी / आईपी: "मुझे चित्र मिल गया है। बस मुझे सर्वर पते और वह सब दे दो। और HTTP अनुरोध के भीतर उस फ़ाइल सामग्री को लपेटो, मैं इसके साथ सौदा नहीं करना चाहता।"

DNS: "i.cdn.turner.com ... हे, बिट ऑफ ट्रिविया, इसे वास्तव में cdn.cnn.com.c.footprint.net कहा जाता है। IP 4.23.41.126 है।"

ब्राउज़र: "ज़रूर, ज़रूर ... एक सेकंड रुको, यह प्रक्रिया करने के लिए कुछ nsec लेगा, मैं इस सभी Google स्क्रिप्ट को समझने की कोशिश कर रहा हूं।"

टीसीपी / आईपी: "अरे, यहाँ सीएसएस आप के लिए कहा है। ओह, और ... हाँ, उन अतिरिक्त स्क्रिप्ट भी बस वापस आ गया।"

ब्राउज़र: "वाह, वहाँ अधिक है ... किसी प्रकार का वीडियो विज्ञापन!"

टीसीपी / आईपी: "ओह बॉय, कैसा मज़ा आता है ..."

ब्राउज़र: "सभी प्रकार की छवियां भी हैं! और यह सीएसएस थोड़ा बुरा लग रहा है ... ठीक है, इसलिए यदि वह हिस्सा वहां जाता है, और शीर्ष पर यह रेखा है ... तो पृथ्वी पर यह कैसे फिट होगा ... नहीं , मुझे इसे बनाने के लिए इसे थोड़ा लंबा करना होगा ... ओह, लेकिन यह है कि अन्य CSS फ़ाइल उस नियम को ओवरराइड करती है ... ठीक है, यह रेंडर करने के लिए एक आसान टुकड़ा नहीं है, यह सुनिश्चित करने के लिए है! "

टीसीपी / आईपी: "ठीक है, ठीक है, मुझे एक सेकंड के लिए विचलित करना बंद करो, यहां अभी भी बहुत कुछ करना है।"

ब्राउज़र: "उपयोगकर्ता, यहां आपके लिए एक छोटी प्रगति रिपोर्ट है। क्षमा करें, यह सब कुछ सेकंड में हो सकता है, लोड करने के लिए 140 अलग-अलग तत्वों की तरह है, और अब तक 16 पर जा रहा है।"

एक या दो सेकंड बाद ...

टीसीपी / आईपी: "ठीक है, यह सब होना चाहिए। अरे, सुनो ... माफ करना, मैं पहले आप पर तड़क गया, आप वहां प्रबंधन कर रहे हैं। यह निश्चित रूप से आपके लिए काफी भार जैसा लगता है।"

ब्राउज़र: "हाँ, हाँ, यह इन सभी वेबसाइटों पर आजकल है, वे सुनिश्चित करें कि यह आपके लिए आसान नहीं है। ठीक है, मैं प्रबंधित करूँगा। यह वही है जो मैं यहाँ हूँ।"

टीसीपी / आईपी: "मुझे लगता है कि यह हम सभी के लिए इन दिनों काफी भारी है ... ओह, डीएनएस को बंद करो!"

ब्राउज़र: "अरे उपयोगकर्ता! वेबसाइट तैयार है - जाओ अपनी खबर ले आओ!"

Comments

तो यह मेरे पीसी अंधेरे के बाद क्या करता है।

— फॉशी

ग्रेट एक्सप्लोरेशन ... हैट ऑफ टू यू ... बिंगो ...

— राहेल

कहानी कहने का चमत्कारिक अंश :)

— माइकल

@dex: ... और इस दिन वे अभी भी मजबूत हो रहे हैं, उपयोगकर्ता के सभी अनुरोधों को इतिहास की किताबों में प्रशंसा के योग्य परिश्रम के साथ हल कर रहे हैं। लेकिन, सभी चीजों की तरह, एक दिन यह उनका समय होगा कि वे किशोरावस्था में सेवानिवृत्त हो जाएं, और बेहतर तरीके से आधुनिक समय के लिए अनुकूल आधुनिक दृष्टिकोणों को अपनाते हुए। लेकिन आश्वस्त रहें कि वे हमेशा हमारी विरासत में होंगे, एक जानने वाले मुस्कुराहट के साथ देख रहे हैं और आने वाली पीढ़ियों को उन सभी कठिन पाठों से गुजरते हैं जो उभरते इंटरनेट संचार के इन जीवंत समय में सीखे।

— इलारी काजस्ट

Naysayers के लिए हुर्रे, सही, @wahnfrieden? मैं इसे बहुत सटीक, और जानकारीपूर्ण मानता हूं।

— जर्गेन ए। इरहार्ड

Answer 2

वेब कैसे काम करता है: HTTP और CGI ने समझाया

सर्न से भी एक महान व्याख्या - वेब का अल्मा मेटर: वेब कैसे काम करता है

Answer 3

• ब्राउज़र एक होस्टनाम और एक पथ में आपके द्वारा लिखे गए (URL) को विभाजित करता है।
• ब्राउज़र दिए गए होस्टनाम और पथ पर डेटा के लिए पूछने के लिए एक HTTP अनुरोध बनाता है।
• ब्राउज़र एक आईपी पते में होस्टनाम को हल करने के लिए DNS लुकअप करता है।
• ब्राउज़र आईपी पते के माध्यम से निर्दिष्ट कंप्यूटर पर एक टीसीपी / आईपी कनेक्शन बनाता है। (यह कनेक्शन वास्तव में कई कंप्यूटरों से बना है, प्रत्येक डेटा को अगले के साथ गुजर रहा है।)
• ब्राउज़र HTTP अनुरोध को दिए गए आईपी पते के कनेक्शन को नीचे भेजता है।
• वह कंप्यूटर टीसीपी / आईपी कनेक्शन से HTTP अनुरोध प्राप्त करता है और इसे वेब सर्वर प्रोग्राम में भेजता है।
• वेब सर्वर होस्टनाम और पथ पढ़ता है और आपके द्वारा मांगे गए डेटा को ढूंढता है या उत्पन्न करता है।
• वेब सर्वर उस डेटा से एक HTTP प्रतिक्रिया उत्पन्न करता है।
• वेब सर्वर उस प्रतिसाद को HTTP प्रतिक्रिया भेजता है जो आपके मशीन के टीसीपी / आईपी कनेक्शन को वापस करता है।
• ब्राउज़र HTTP प्रतिक्रिया प्राप्त करता है और इसे हेडर (डेटा का वर्णन करते हुए) और शरीर (डेटा स्वयं) में विभाजित करता है।
• ब्राउज़र यह निर्धारित करने के लिए डेटा की व्याख्या करता है कि इसे ब्राउज़र में कैसे प्रदर्शित किया जाए - आम तौर पर यह HTML डेटा होता है जो सूचना के प्रकार और उनके सामान्य रूप को निर्दिष्ट करता है।
• कुछ डेटा मेटाडेटा होंगे जो आगे के संसाधनों को निर्दिष्ट करते हैं जिन्हें लोड करने की आवश्यकता होती है, जैसे कि विस्तृत लेआउट के लिए स्टाइल शीट, या इनलाइन छवियां, या फ्लैश फिल्में। इस मेटाडेटा को एक URL के रूप में फिर से निर्दिष्ट किया जाता है, और यह पूरी प्रक्रिया हर एक के लिए दोहराती है जब तक कि सभी लोड न हो जाएं।

Comments

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

— सैम डटन

Answer 4

पहला कदम DNS (डोमेन नाम सर्वर) लुकअप है। यह शीर्ष डोमेन (cnn.com) देखने के लिए आपकी नेटवर्क सेटिंग्स में निर्दिष्ट DNS सर्वर (या डीएचसीपी द्वारा आपको दिया गया) का उपयोग करता है और फिर उस डोमेन के नेमवेदर को निर्दिष्ट (www.cnn.com) के आईपी पते के लिए पूछता है।

इसके बाद आईपी पता होता है, आपका ब्राउज़र वेब सर्वर के साथ संचार शुरू करता है। यह निर्दिष्ट प्रोटोकॉल का उपयोग करके किया जाता है (जो आमतौर पर HTTP 1.1 में चूक करता है)। '/' के लिए 'GET' अनुरोध सर्वर से किया जाता है, जो HTML दस्तावेज़ सामग्री और उपयुक्त हेडर (जो दस्तावेज़ के सामग्री-प्रकार, HTML और अन्य जानकारी के ब्राउज़र को बताता है) के साथ प्रतिक्रिया करता है। फिर ब्राउज़र दस्तावेज़ को पार्स करता है और किसी भी URL को ढूंढता है जिसे उसे पृष्ठ (जैसे चित्र या लिंक किए गए स्टाइलशीट) में एम्बेड करने की आवश्यकता होती है और उनमें से प्रत्येक पर GET अनुरोध करता है।

ब्राउज़र आमतौर पर स्वचालित रूप से '/favicon.ico' के लिए एक GET अनुरोध करता है (साइट शीर्षक के बगल में थोड़ा CNN आइकन प्रदर्शित करने के लिए)।

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

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

Comments

लड़का मूल बातें नहीं जानता है और आपने उसे डीएनएस, डीएचसीपी और आईपी के साथ उड़ा दिया है। आइए उसे आईपी पैकेट संरचना की व्याख्या करें!

उन्होंने तकनीकी जानकारी मांगी। वह चाहे तो आईपी देख सकता है।

बात यह है कि वह शायद कुछ भी देखना नहीं चाहता ... :(

Answer 5

अन्य उत्तरों से अब तक गायब है, जो सीएनएन की ओर से होता है:

• CNN की एक मशीन आपके कंप्यूटर से पेज के लिए पूछकर संदेश प्राप्त करती है।
• यह इस अनुरोध को कई कंप्यूटरों में से एक पर पुनर्निर्देशित करता है, जिसका उपयोग सीएनएन अपनी वेब साइट के लिए कर रहा है (इसका कारण यह है कि, इस तरह, आप कई कंप्यूटरों पर प्रतिक्रिया वेब पृष्ठों को एक साथ रखने का काम फैला सकते हैं)
• CNN कंप्यूटर को आपका अनुरोध प्राप्त हो जाता है और यह एक वेब पेज के साथ प्रतिक्रिया करता है जो संभवतः लगभग पूरी तरह से पूर्व-निर्मित है, लेकिन शायद यह आपको भेजने से पहले कुछ चीजें बदल देगा (शीर्ष पर विज्ञापन हो सकता है, शायद शीर्षक समाचार)। कभी-कभी कंप्यूटर बहुत सारे छोटे घटकों से पृष्ठ को इकट्ठा करते हैं जब भी उन्हें अनुरोध मिलता है; सुनिश्चित नहीं है कि सीएनएन क्या करता है
• प्रतिक्रिया आपके कंप्यूटर पर नेटवर्क के माध्यम से अपना रास्ता बनाती है, जो फिर उसे प्रदर्शित करती है।
• प्रतिक्रिया में छवियां शामिल नहीं थीं: आपका कंप्यूटर फिर छवियों के लिए एक और अनुरोध भेजता है, और बहुत अधिक ऐसा ही परिदृश्य होता है।

Answer 6

यह स्पष्ट रूप से एक तकनीकी व्याख्या नहीं है, लेकिन यह एक प्यारा दृश्य सहायता (उत्कृष्ट व्लादिस्टडियो डॉट कॉम से ) है जो कुछ के लिए सहायक हो सकती है:

Answer 7

आपके द्वारा पूछी गई जानकारी एक दो दर्जन पुस्तकें भर सकती है। लेकिन यहाँ यह समझाने का मेरा प्रयास है: आपका ब्राउज़र cnn.com का IP पता खोजने के लिए आपके OS को बताता है। तब आपका OS cnn.com के आईपी पते के लिए एक DNS सर्वर से पूछता है। IP को broswer पर भेजा जाता है जो IP पते से संपर्क करता है और पृष्ठ का अनुरोध करता है। cnn.com फिर आपको और html पेज भेजता है। ब्राउज़र HTML को पार्स करता है और HTML रेंडरर को सूचना भेजता है। ब्राउज़र तब ओएस को बताता है कि स्क्रीन पर क्या दिखाना है।

Answer 8

जेफ़ मोसर ने अपने ब्लॉग पर एक HTTPS अनुरोध का एक उत्कृष्ट तकनीकी विश्लेषण किया था: HTTPS कनेक्शन का पहला कुछ मिलीसेकंड ।

Answer 9

"सेंडुंग मिट डेर मूस" (जर्मन बच्चों का टीवी शो जो बच्चों के लिए तकनीक की व्याख्या करता है) द्वारा एक बहुत अच्छा वीडियो है:

डाई सेंडुंग मिट डेर मूस - वाई फंकटिएंटिएर दास इंटरनेट ( इंटरनेट कैसे काम करता है)।

केवल जर्मन में, दुर्भाग्य से, लेकिन अजीब भी w / o पाठ। अजीब हेलमेट वाले पुरुष आईपी पैकेट खेलते हैं, और डेटा पेपर कार्ड पर लिखा जाता है। क्लासिक :-)।

BTW, स्पष्टीकरण वास्तव में काफी अच्छे हैं।