O que exatamente acontece quando você navega em um site no seu navegador?

O que acontece nos bastidores quando digitamos www.cnn.com em um navegador e como as informações são exibidas na tela?

Uma explicação técnica seria muito apreciada.

Navegador: "Ok, então, eu tenho um usuário solicitando este endereço: www.cnn.com. Acho que, como não há barras nem nada, isso é uma solicitação direta de uma página principal. Também não havia protocolo ou porta definida, então suponho que seja HTTP e vá para a porta 80 ... tudo bem, primeiro as primeiras coisas. Ei, DNS, amigo, acorde! Onde está esse www.cnn.com escondido? "

DNS: "Certo ... espere um segundo, vou perguntar aos servidores ISP. Ok, parece 157.166.226.25."

Navegador: "Ok. Internet Protocol Suite, sua vez! Ligue para 157.166.226.25, por favor. Envie a eles esse cabeçalho HTTP. Ele está solicitando a estrutura básica e o conteúdo da página principal, para que eu saiba mais o que buscar ... tudo bem, não que você se importe com isso, eu acho. "

TCP / IP: "O que você quer dizer com a minha vez ? Como se eu não estivesse trabalhando apenas para o DNS? Deus, o que é preciso para obter um pouco de apreciação aqui ..."

Navegador: ...

TCP / IP: "Sim, sim ... Conectando ... pedirei ao gateway para encaminhá-lo. Você sabe, não é tão fácil assim, vou ter que dividir sua bonita solicitação em várias partes então chega ao fim e reúne tudo o que eles mandam de milhares de pacotes que recebo ... ah, certo, você não se importa.

Enquanto isso, na sede da CNN, uma mensagem finalmente termina na porta do servidor da Web.

Servidor da CNN Web: "Nzhôô! Um cliente! Ele quer novidades! A primeira página! Que tal?"

Mecanismo de script do lado do servidor da CNN: "Certo, serve! Primeira página, certo?"

Servidor de banco de dados da CNN: "Yey! Trabalhe para mim! Que conteúdo você precisa?"

Mecanismo de script do lado do servidor CNN: "... hum, desculpe DB, eu tenho uma cópia da primeira página aqui no meu cache, não há necessidade de compilar nada. Mas, ei, pegue esse ID de usuário e armazene-o, eu enviarei também para o cliente, para que possamos saber com quem estamos conversando mais tarde ".

Servidor de banco de dados da CNN: "Yey!"

De volta ao computador do usuário ...

TCP / IP: "Ooookay, aqui vem a resposta. Oh, garoto, por que eu sinto que isso será grande ..."

Navegador: "Uh, uau ... isso tem todo tipo de código javascript ... monte de imagens, várias formas ... Certo, vai demorar um pouco para renderizar. Melhor chegar lá. Ei, sistema IP, há muito mais coisas que você precisará obter.Vamos ver que preciso de algumas folhas de estilo do i.cdn.turner.com - via HTTP e solicite o arquivo /cnn/.element/css/2.0/common.css. e obtenha alguns desses scripts no i.cdn.turner.com também, estou contando seis até agora ... "

TCP / IP: "Entendi. Apenas me dê os endereços do servidor e tudo mais. E envolva esse arquivo na solicitação HTTP, não quero lidar com isso".

DNS: "Verificando o i.cdn.turner.com ... ei, um pouco de trivialidades, na verdade é chamado cdn.cnn.com.c.footprint.net. O IP é 4.23.41.126"

Navegador: "Claro, claro ... espere um segundo, isso levará alguns segundos para processar, estou tentando entender todo esse script ..."

TCP / IP: "Ei, aqui está o CSS que você pediu. Ah, e ... sim, esses scripts adicionais também acabaram de voltar."

Navegador: "Uau, tem mais ... algum tipo de anúncio em vídeo!"

TCP / IP: "Oh, garoto, que divertido isso parece ..."

Navegador: "Também existem todos os tipos de imagens! E esse CSS parece um pouco desagradável ... certo, então se essa parte for lá e tiver essa linha no topo ... como diabos isso se encaixa mais ... não , Terei que esticar um pouco isso para torná-lo ... Ah, mas esse outro arquivo CSS substitui essa regra ... Bem, este não será um processo fácil de renderizar, com certeza! "

TCP / IP: "Ok, ok, pare de me distrair por um segundo, ainda há muito o que fazer aqui."

Navegador: "Usuário, aqui está um pequeno relatório de progresso para você. Desculpe, tudo isso pode levar alguns segundos, existem 140 elementos diferentes para carregar e até 16 até agora".

Um ou dois segundos depois ...

TCP / IP: "Ok, isso deve ser tudo. Ei, escute ... desculpe, eu bati com você mais cedo, você está gerenciando lá? Isso com certeza parece bastante para você também."

Navegador: "Ufa, sim, são todos esses sites hoje em dia, eles certamente não facilitam para você. Bem, eu vou gerenciar. É para isso que estou aqui".

TCP / IP: "Eu acho que é bastante pesado para todos nós hoje em dia ... ah, pare de se gabar de DNS!"

Navegador: "Ei, usuário! O site está pronto - vá receber suas novidades!"

Como a web funciona: HTTP e CGI explicados

Também uma ótima explicação do CERN - alma mater of Web: como a web funciona

• O navegador divide o que você digita (a URL) em um nome de host e um caminho.
• O navegador forma uma solicitação HTTP para solicitar os dados no nome do host e no caminho.
• O navegador executa uma pesquisa de DNS para resolver o nome do host em um endereço IP.
• O navegador forma uma conexão TCP / IP com o computador especificado através do endereço IP. (Essa conexão é formada de muitos computadores, cada um passando os dados para o próximo).
• O navegador envia a solicitação HTTP pela conexão com o endereço IP fornecido.
• Esse computador recebe a solicitação HTTP da conexão TCP / IP e a passa para o programa do servidor web.
• O servidor da Web lê o nome do host e o caminho e localiza ou gera os dados solicitados.
• O servidor da Web gera uma resposta HTTP contendo esses dados.
• O servidor da Web envia essa resposta HTTP de volta à conexão TCP / IP para sua máquina.
• O navegador recebe a resposta HTTP e a divide em cabeçalhos (descrevendo os dados) e o corpo (os próprios dados).
• O navegador interpreta os dados para decidir como exibi-los no navegador - normalmente, são dados HTML que especificam os tipos de informações e sua forma geral.
• Alguns dos dados serão metadados que especificam outros recursos que precisam ser carregados, como folhas de estilo para layout detalhado, imagens embutidas ou filmes em Flash. Esses metadados são especificados novamente como uma URL e todo esse processo se repete para cada um até que todos sejam carregados.

A primeira etapa é a pesquisa de DNS (Domain Name Server). Ele usa os servidores DNS especificados nas configurações de sua rede (ou fornecidos pelo DHCP) para procurar o domínio superior (cnn.com) e, em seguida, solicita ao servidor de nomes desse domínio o endereço IP do subdomínio especificado (www.cnn.com).

Depois de ter o endereço IP, o navegador inicia as comunicações com o servidor da web. Isso é feito usando o protocolo especificado (que geralmente é o padrão HTTP 1.1). É feita uma solicitação 'GET' para '/' ao servidor, que responde com o conteúdo do documento HTML e os cabeçalhos apropriados (que informam o navegador sobre o tipo de conteúdo, HTML e outras informações do documento). Em seguida, o navegador analisa o documento e encontra os URLs que ele precisa incorporar na página (como imagens ou folhas de estilo vinculadas) e solicita GET em cada um deles.

O navegador também costuma fazer automaticamente uma solicitação GET para '/favicon.ico' (para exibir o pequeno ícone da CNN ao lado do título do site).

Seu navegador também provavelmente especificará em seus cabeçalhos de solicitação que deseja que o conteúdo da resposta seja compactado, usando o algoritmo gzip. Isso torna o download do arquivo muito menor, se o servidor suportar. Tudo isso é transparente para você, mesmo que seja como baixar um arquivo ZIP e descompactá-lo.

Quando você recarrega a página, seu navegador verifica se essa página já está armazenada em cache em seu sistema e, nesse caso, faz uma solicitação HTTP apenas para o cabeçalho do documento e verifica sua data de modificação. Se essa data for posterior à sua cópia em cache, ela solicitará novamente o conteúdo completo do documento e atualizará a página. Caso contrário, ele apenas usa sua cópia local.

Faltando até agora as outras respostas, é o que acontece no lado da CNN:

• Uma máquina na CNN recebe a mensagem do seu computador solicitando a página.
• Ele redireciona essa solicitação para um dos muitos computadores que a CNN está usando em seu site (o motivo é que, dessa forma, você pode espalhar o trabalho de reunir as páginas da web de resposta em muitos computadores)
• O computador da CNN recebe sua solicitação e responde com uma página da Web provavelmente quase totalmente pré-computada, mas talvez mude algumas coisas antes de enviá-la para você (pode ser o anúncio no topo, talvez as manchetes). Às vezes, os computadores montam a página a partir de vários componentes pequenos toda vez que recebem uma solicitação; não sei o que a CNN faz
• a resposta percorre a rede para o seu computador, que a exibe.
• a resposta não incluiu as imagens: seu computador envia outra solicitação para as imagens e praticamente o mesmo cenário acontece.

Obviamente, isso não é uma explicação técnica, mas é uma ajuda visual atraente (do excelente Vladstudio.com ) que pode ser útil para alguns:

As informações que você acabou de pedir podem preencher uma dúzia de livros. Mas aqui está minha tentativa de explicá-lo: Seu navegador informa ao seu sistema operacional para encontrar o endereço IP de cnn.com. Em seguida, seu sistema operacional solicita ao servidor DNS o endereço IP para cnn.com. O IP é enviado ao broswer que entra em contato com o endereço IP e solicita a página. O cnn.com envia a você e a página html. Os navegadores analisam o html e enviam as informações ao renderizador HTML. O navegador então informa ao sistema operacional o que exibir na tela.

Jeff Moser teve uma excelente análise técnica de uma solicitação HTTPS em seu blog: Os primeiros poucos milissegundos de uma conexão HTTPS .

Há um vídeo muito legal do "Sendung mit der Maus" (um programa de TV infantil alemão muito popular que explica a tecnologia para crianças):

Die Sendung mit der Maus - Como acessar a Internet (Como a Internet funciona).

Infelizmente apenas em alemão, mas engraçado, mesmo sem o texto. Homens com capacetes engraçados jogam os pacotes IP e os dados são gravados em cartões de papel. Clássico :-).

BTW, as explicações são realmente bastante boas.