153
Desconstruindo a web Willian Molinari (a.k.a PotHix)

Desconstruindo a web

Embed Size (px)

Citation preview

Page 1: Desconstruindo a web

Desconstruindo a webWillian Molinari (a.k.a PotHix)

Page 2: Desconstruindo a web

Aviso

Page 7: Desconstruindo a web

Porque dessa talk?

Page 8: Desconstruindo a web
Page 9: Desconstruindo a web
Page 13: Desconstruindo a web

Internet

Page 14: Desconstruindo a web

Internet

Page 16: Desconstruindo a web

Internet

Page 17: Desconstruindo a web
Page 18: Desconstruindo a web

http://pothix.com

http://pothix.com

Page 19: Desconstruindo a web

http://pothix.com

http://pothix.com

Page 20: Desconstruindo a web

http://pothix.com

É uma URL?

http://pothix.com

Page 21: Desconstruindo a web

“O que significa PotHix”

“O que significa PotHix”

Page 22: Desconstruindo a web

http://pothix.com

É uma URL!

http://pothix.com

Page 23: Desconstruindo a web

http://pothix.com

http://pothix.com

Tem HSTS?

Strict-Transport-Security

Page 24: Desconstruindo a web

http://pothix.com

Tem cache?

Expires Cache-Control

http://pothix.com

Page 25: Desconstruindo a web

Protocolo: http://Domínio: pothix.com

Path: /

Tem cache de DNS?

Page 26: Desconstruindo a web

ChromeFaz cache de DNS

Page 27: Desconstruindo a web

http://aosabook.org/en/posa/high-performance-networking-in-chrome.html

Page 28: Desconstruindo a web

getaddrinfo()

Page 29: Desconstruindo a web

sistema operacional

Page 32: Desconstruindo a web

glibc -> getaddrinfo()sysdeps/posix/getaddrinfo.c

2321 getaddrinfo (const char *name, const char *service, 2322 const struct addrinfo *hints, struct addrinfo **pai) 2323 {

Page 34: Desconstruindo a web

Internet

- glibc

POSIX

Page 35: Desconstruindo a web

Aplicação

Apresentação

Sessão

Transporte

Rede

Enlace

Físico

ModeloOSI

Page 36: Desconstruindo a web

Aplicação

Apresentação

Sessão

Transporte

Rede

Enlace

Físico

ModeloOSI

Page 37: Desconstruindo a web

SRLY?

Page 38: Desconstruindo a web

Aplicação

Transporte

Rede

Enlace

Físico

Sessão

Apresentação

Page 39: Desconstruindo a web

Aplicação

Transporte

Rede

Enlace

Físico

Page 40: Desconstruindo a web

Aplicação

Transporte

Rede

Enlace

Físico

SOuser

Page 41: Desconstruindo a web

TCP / UDP

DNSAplicação

Transporte

Rede

Enlace

Físico

IP

Ethernet / Wi-Fi

010101001011

Page 42: Desconstruindo a web

DNS

TCP / UDP

Aplicação

Transporte

Rede

Enlace

Físico

IP

Ethernet / Wi-Fi

010101001011

Page 44: Desconstruindo a web

getaddrinfo()__socket() & __connect()

sysdeps/posix/getaddrinfo.c2515 fd = __socket (af, SOCK_DGRAM, IPPROTO_IP); [...]2526 [...] && __connect (fd, q->ai_addr, q->ai_addrlen) == 0

Page 45: Desconstruindo a web

terminal

$ sudo strace -f -e bind,socket,fork,connect -p $(ps aux | grep chromium | grep -v nacl | awk '{ print $2}' | xargs echo | sed 's/ /,/g')[...][pid 8739] socket(PF_INET6, SOCK_DGRAM, IPPROTO_IP) = 134[pid 8739] connect(134, {sa_family=AF_INET6, sin6_port=htons(53), inet_pton(AF_INET6, "2001:4860:4860::8888", &sin6_addr), sin6_flowinfo=0, sin6_scope_id=0}, 28) = -1 ENETUNREACH (Network is unreachable)[pid 9010] socket(PF_INET, SOCK_DGRAM, IPPROTO_IP) = 134[pid 9010] connect(134, {sa_family=AF_INET, sin_port=htons(0), sin_addr=inet_addr("192.30.252.154")}, 16) = 0[pid 8739] socket(PF_INET, SOCK_STREAM, IPPROTO_TCP) = 134[pid 8739] connect(134, {sa_family=AF_INET, sin_port=htons(80), sin_addr=inet_addr("192.30.252.154")}, 16) = -1 EINPROGRESS (Operation now in progress)[...]

Syscalls in action! (*stripped)

Page 46: Desconstruindo a web

terminal

$ sudo strace -f -e bind,socket,fork,connect -p $(ps aux | grep chromium | grep -v nacl | awk '{ print $2}' | xargs echo | sed 's/ /,/g')[...][pid 8739] socket(PF_INET6, SOCK_DGRAM, IPPROTO_IP) = 134[pid 8739] connect(134, {sa_family=AF_INET6, sin6_port=htons(53), inet_pton(AF_INET6, "2001:4860:4860::8888", &sin6_addr), sin6_flowinfo=0, sin6_scope_id=0}, 28) = -1 ENETUNREACH (Network is unreachable)[pid 9010] socket(PF_INET, SOCK_DGRAM, IPPROTO_IP) = 134[pid 9010] connect(134, {sa_family=AF_INET, sin_port=htons(0), sin_addr=inet_addr("192.30.252.154")}, 16) = 0[pid 8739] socket(PF_INET, SOCK_STREAM, IPPROTO_TCP) = 134[pid 8739] connect(134, {sa_family=AF_INET, sin_port=htons(80), sin_addr=inet_addr("192.30.252.154")}, 16) = -1 EINPROGRESS (Operation now in progress)[...]

Syscalls in action! (*stripped)

UDP para ipv6nope :(

UDPipv4

request

Page 47: Desconstruindo a web

Happy eyebals (rfc6555): https://www.ietf.org/mail-archive/web/v6ops/current/msg22455.html

Page 48: Desconstruindo a web

AAAA

A

Browser

sitev6

sitev4

de acordo com a rfc6555

Page 49: Desconstruindo a web

AAAA

A

Browser

sitev6

sitev4

de acordo com a rfc6555

Page 50: Desconstruindo a web

AAAA

A

Browser

sitev6

sitev4RST

de acordo com a rfc6555

Page 51: Desconstruindo a web

DNSAplicação

Transporte

Rede

Enlace

Físico

TCP / UDP

IP

Ethernet / Wi-Fi

010101001011

Page 53: Desconstruindo a web

UDP

Page 54: Desconstruindo a web

Conteúdo

Page 55: Desconstruindo a web

Endereço (IP)

Page 56: Desconstruindo a web
Page 57: Desconstruindo a web

?

Page 58: Desconstruindo a web

DNSAplicação

Transporte

Rede

Enlace

Físico

TCP / UDP

IP

Ethernet / Wi-Fi

010101001011

Page 59: Desconstruindo a web

DNSAplicação

Transporte

Rede

Enlace

Físico

TCP / UDP

IP

Mágica, bro!

Page 61: Desconstruindo a web

Via dnstracer: `dnstracer -s . -4 -o pothix.com`

A.ROOT-SERVERS.NET [.] (198.41.0.4)

a.gtld-servers.net [com] (192.5.6.30)

ns1.dreamhost.com [pothix.com] (66.33.206.206) Got authoritative answer

ns1.dreamhost.com (66.33.206.206) pothix.com -> 192.30.252.153ns1.dreamhost.com (66.33.206.206)pothix.com -> 192.30.252.154

Page 62: Desconstruindo a web

Internet

glibcDNS

TCP/IP

UDP/IP

POSIX

Page 63: Desconstruindo a web

Internet

glibcDNS

TCP/IP

UDP/IP

POSIX

HTTP

Page 64: Desconstruindo a web

HTTP/HTTPS

TCP / UDP

IP

Ethernet / Wi-Fi

010101001011

Aplicação

Transporte

Rede

Enlace

Físico

Page 65: Desconstruindo a web

HTTP/HTTPS

TCP / UDP

IP

Ethernet / Wi-Fi

010101001011

Aplicação

Transporte

Rede

Enlace

Físico

Page 69: Desconstruindo a web

LISTENINGSYN

LISTENSYNSENT

Page 70: Desconstruindo a web

SYN+ACK

LISTENSYNRECEIVEDSYNSENT

Page 71: Desconstruindo a web

SYNRECEIVEDSYNSENTESTABLISHED

ACK

Page 72: Desconstruindo a web

ESTABLISHEDSYNSENTESTABLISHED

É NÓIS! É NÓIS!

Page 73: Desconstruindo a web
Page 74: Desconstruindo a web

HTTP/HTTPS

TCP / UDP

IP

Ethernet / Wi-Fi

010101001011

Aplicação

Transporte

Rede

Enlace

Físico

Page 75: Desconstruindo a web

HTTPS

Page 77: Desconstruindo a web

HTTP/HTTPS

TCP / UDP

IP

Ethernet / Wi-Fi

010101001011

Aplicação

Transporte

Rede

Enlace

Físico

TLS

Page 78: Desconstruindo a web

TLS

Page 79: Desconstruindo a web

conexão estabelecida

client hello (CIPHERS, URL)

Os primeiros milisegundos de uma conexão HTTPS

Page 81: Desconstruindo a web

conexão estabelecida

Server hello(certificado, CIPHER)

TLS_RSA_WITH_RC4_128_MD5

publickey

crypt hash

Page 82: Desconstruindo a web

conexão estabelecida

Data válida?CA confiável?

Assinatura válida?URL esperada?

Page 83: Desconstruindo a web

conexão estabelecida

Page 84: Desconstruindo a web

conexão estabelecida

Gerei uma parada aqui(pre_master secret)

!^*@#$&!@(#$&!@#)$^$^

TLS_RSA_WITH_RC4_128_MD5

Page 85: Desconstruindo a web

conexão estabelecida

!!@U#$N!Y*@#$*

master secret

TLS_RSA_WITH_RC4_128_MD5

Page 86: Desconstruindo a web

conexão estabelecida

É NÓIS!

TLS_RSA_WITH_RC4_128_MD5

criptografiados dados

verificação contra conteúdo “batizado”

É NÓIS!

Page 87: Desconstruindo a web

TLSHTTP HTTP

Internet

headersurlcookies

headersurlcookies

Page 90: Desconstruindo a web

HTTP 1x via telnet

$ telnet pothix.com 80Trying 192.30.252.153...Connected to pothix.com.Escape character is '^]'.GET /index.html HTTP/1.1Host: pothix.com

HTTP/1.1 200 OKServer: GitHub.com...

terminal

Page 91: Desconstruindo a web

HTTP/HTTPS

TCP / UDP

IP

Ethernet / Wi-Fi

010101001011

Aplicação

Transporte

Rede

Enlace

Físico

Page 93: Desconstruindo a web

HTTP/HTTPS

TCP / UDP

IP

Ethernet / Wi-Fi

010101001011

Aplicação

Transporte

Rede

Enlace

Físico

Page 95: Desconstruindo a web

InternetglibcDNS

TCP/IP

UDP/IP

HTTP

POSIX

Page 98: Desconstruindo a web

Carrier

Sense

Multiple

Access

Collision

Avoidance

Page 99: Desconstruindo a web

G

Page 100: Desconstruindo a web

GB G

Page 102: Desconstruindo a web

# traceroute -T pothix.com

traceroute to pothix.com (192.30.252.153), 30 hops max, 60 byte packets

1 palantir (192.168.1.1) 8.718 ms 8.769 ms 8.868 ms

2 10.18.128.1 (10.18.128.1) 25.058 ms 25.673 ms 27.189 ms

3 c8bd5001.virtua.com.br (200.189.80.1) 29.071 ms 29.073 ms 29.068 ms

4 embratel-T0-7-2-0-tacc01.spoph.embratel.net.br (200.178.127.57) 32.917 ms

embratel-T0-4-1-0-uacc03.spomb.embratel.net.br (189.42.182.37) 31.734 ms

embratel-T0-1-0-2-uacc04.spoph.embratel.net.br (201.56.189.9) 36.481 ms

5 ebt-H0-1-0-0-tcore01.spolp.embratel.net.br (200.230.1.242) 37.800 ms

200.244.212.73 (200.244.212.73) 37.803 ms

200.244.212.81 (200.244.212.81) 41.446 ms

6 ebt-BP1082-intl02.nyk.embratel.net.br (200.230.220.30) 204.822 ms

ebt-B11121-intl02.nyk.embratel.net.br (200.230.251.254) 192.381 ms

ebt-BP11521-intl02.nyk.embratel.net.br (200.230.220.174) 189.936 ms

7 fa-0-0-0.r23.nycmny01.us.bb.gin.ntt.net (129.250.202.185) 192.297 ms 172.074 ms 172.013 ms

8 ae-9.r22.asbnva02.us.bb.gin.ntt.net (129.250.2.149) 171.973 ms 167.012 ms 166.951 ms

9 ae-44.r06.asbnva02.us.bb.gin.ntt.net (129.250.6.113) 166.888 ms 166.873 ms

ae-45.r05.asbnva02.us.bb.gin.ntt.net (129.250.5.137) 212.669 ms

10 xe-0-3-0-18.r05.asbnva02.us.ce.gin.ntt.net (129.250.197.70) 202.448 ms

xe-0-9-0-16.r06.asbnva02.us.ce.gin.ntt.net (129.250.197.74) 201.593 ms 202.489 ms

11 pages.github.com (192.30.252.153) 171.337 ms * *

TCP meu router

github pages USA backbone

backboneembratel

NET

Page 103: Desconstruindo a web

Internet

Page 104: Desconstruindo a web

Nginx conf fileupstream backend { server backend1.example.com weight=5; server backend2.example.com:8080; server unix:/tmp/backend3;

server backup1.example.com:8080 backup; server backup2.example.com:8080 backup;}

...

http://nginx.org/en/docs/http/ngx_http_upstream_module.html#server

TCP

Unix Socket

Page 105: Desconstruindo a web

Internet

assets

TCP

http://12factor.net/port-binding

Page 107: Desconstruindo a web

Internet

assets

TCP

Page 109: Desconstruindo a web

Internet

assets

TCP

Page 111: Desconstruindo a web

É um Rack application ...

# Implements call according to the Rack API. It simply

# dispatches the request to the underlying middleware stack.

def call(env)

env["ORIGINAL_FULLPATH"] = build_original_fullpath(env)

env["ORIGINAL_SCRIPT_NAME"] = env["SCRIPT_NAME"]

super(env)

end

...

Page 112: Desconstruindo a web

mais informações no post do timaro no omniref

Informações do Rack{"GATEWAY_INTERFACE"=>"CGI/1.1",

"PATH_INFO"=>"/favicon.ico",

"QUERY_STRING"=>"",

"REMOTE_ADDR"=>"127.0.0.1",

"REMOTE_HOST"=>"localhost.localdomain",

"REQUEST_METHOD"=>"GET",

"REQUEST_URI"=>"http://localhost:9292/favicon.ico",

"SCRIPT_NAME"=>"",

"SERVER_NAME"=>"localhost",

"SERVER_PORT"=>"9292",

"SERVER_PROTOCOL"=>"HTTP/1.1",

"SERVER_SOFTWARE"=>"WEBrick/1.3.1 (Ruby/2.2.3/2015-08-18)",

"HTTP_HOST"=>"localhost:9292",

"HTTP_CONNECTION"=>"keep-alive",

"HTTP_USER_AGENT"=>"Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/46.0.2490.71 Safari/537.36",

"HTTP_ACCEPT"=>"*/*",

"HTTP_REFERER"=>"http://localhost:9292/",

"HTTP_ACCEPT_ENCODING"=>"gzip, deflate, sdch",

"HTTP_ACCEPT_LANGUAGE"=>"en-US,en;q=0.8,pt-BR;q=0.6,pt;q=0.4,es;q=0.2,eo;q=0.2", "rack.version"=>[1, 2],

"rack.multithread"=>true, "rack.multiprocess"=>false, "rack.run_once"=>false, "rack.url_scheme"=>"http", "HTTP_VERSION"=>"HTTP/1.1", "REQUEST_PATH"=>"/favicon.ico"}

Page 114: Desconstruindo a web

mais informações no post do timaro no omniref

Rack middlewares[

Rack::Sendfile,

ActionDispatch::Static, Rack::Lock,

#<ActiveSupport::Cache::Strategy::LocalCache::Middleware:0x000000028fa168>,

Rack::Runtime, Rack::MethodOverride,

ActionDispatch::RequestId,

Rails::Rack::Logger,

ActionDispatch::ShowExceptions,

WebConsole::Middleware,

ActionDispatch::DebugExceptions,

ActionDispatch::RemoteIp,

ActionDispatch::Reloader,

ActionDispatch::Callbacks,

ActiveRecord::Migration::CheckPending,

ActiveRecord::ConnectionAdapters::ConnectionManagement,

ActiveRecord::QueryCache,

ActionDispatch::Cookies,

ActionDispatch::Session::CookieStore,

ActionDispatch::Flash,

ActionDispatch::ParamsParser,

Rack::Head,

Rack::ConditionalGet,

Rack::ETag

]

Page 119: Desconstruindo a web

Internet

assets

TCP

MV

VM

C

Page 120: Desconstruindo a web

Internet

assets

TCP

MV

VM

C

Page 121: Desconstruindo a web

Internet

assets

TCP

MV

VM

C

Page 123: Desconstruindo a web

Internet

assets

TCP

MV

VM

C

Page 124: Desconstruindo a web

Internet

assets

TCP

MV

VM

C

Page 125: Desconstruindo a web

Internet

assets

TCP

MV

VM

C

Page 126: Desconstruindo a web

Internet

assets

TCP

MV

VM

C

Page 132: Desconstruindo a web
Page 133: Desconstruindo a web

HTML

Page 136: Desconstruindo a web

HTML syntax error

Page 137: Desconstruindo a web

<img src=”http://pothix.com/avatar.gif”> thread

<img src=”http://pothix.com/esperanto.png”> thread

<img src=”http://pothix.com/fotodasferias.scr”> thread

<script src=”http://pothix.com/marotagem.js”> sincrono

<script src=”http://pothix.com/estiloso.css”> thread

<script src=”http://pothix.com/javaescrito.js”> sincrono

<img src=”http://pothix.com/fotodasferias.jpg”>

Page 138: Desconstruindo a web

<img src=”http://pothix.com/avatar.gif”> thread

<img src=”http://pothix.com/esperanto.png”> thread

<img src=”http://pothix.com/fotodasferias.scr”> thread

<script src=”http://pothix.com/marotagem.js”> sincrono

<script src=”http://pothix.com/estiloso.css”> thread

<script src=”http://pothix.com/javaescrito.js”> sincrono

<img src=”http://pothix.com/fotodasferias.jpg”>

Page 139: Desconstruindo a web

exemplos retirados do post “How browsers work”

Page 140: Desconstruindo a web

exemplos retirados do post “How browsers work”

Page 141: Desconstruindo a web

Diego Eis: DOM, CSSOM e RenderThree - Introdução ao Browser Render Path

Page 142: Desconstruindo a web
Page 143: Desconstruindo a web

Resumindoessa bagaça

Page 145: Desconstruindo a web

Não acredite em mágicaentenda como funciona de verdade

ceeeeerto.

Page 146: Desconstruindo a web

Seja curiosoconhecimento nunca é demais

Page 147: Desconstruindo a web

Perguntas?

Willian Molinari

@[email protected]

Slides: https://goo.gl/cC36RM

Page 148: Desconstruindo a web
Page 149: Desconstruindo a web
Page 150: Desconstruindo a web
Page 151: Desconstruindo a web
Page 152: Desconstruindo a web

SRLY?

Page 153: Desconstruindo a web

The browser