1
00:00:00,000 --> 00:00:02,620
[Powered by Google Translate] [Semana 7, continuação]

2
00:00:02,620 --> 00:00:05,090
[David J. Malan, Harvard University]

3
00:00:05,090 --> 00:00:07,780
[Esta é CS50.] [CS50.TV]

4
00:00:07,780 --> 00:00:09,810
Tudo bem. Welcome Back. Este é CS50,

5
00:00:09,810 --> 00:00:12,100
e este é o fim da semana 7.

6
00:00:12,100 --> 00:00:15,460
Assim, uma dessas coisas estúpidas pequenas que gira em torno da Internet

7
00:00:15,460 --> 00:00:24,080
e sorveu-se, e deve agora fazer um pouco de sentido nerd para você.

8
00:00:24,080 --> 00:00:28,330
Bem, era mais engraçado com esse cara do que era para vocês.

9
00:00:28,330 --> 00:00:32,619
Falando nisso, bem, pessoal,

10
00:00:32,619 --> 00:00:42,550
hoje é o aniversário de Nate.

11
00:00:42,550 --> 00:00:46,630
Para lhe dar uma sensação de Nate o quão bom e eu somos

12
00:00:46,630 --> 00:00:50,140
em desenvolvimento web com base na classe de segunda-feira e com base agora sobre isso,

13
00:00:50,140 --> 00:00:53,170
Eu pensei que eu ia puxar página Nate casa, se você não viu ainda.

14
00:00:53,170 --> 00:00:57,020
Este aqui HTML ia Nate.

15
00:00:57,020 --> 00:00:59,380
Então, ver o seu código fonte, se você gostaria de ver como fazer isso, e Nate,

16
00:00:59,380 --> 00:01:02,250
se pudéssemos embarass você apenas brevemente, a equipe tem uma coisinha

17
00:01:02,250 --> 00:01:06,080
se você gostaria de compartilhar alguma sobremesa com algumas das crianças da classe aqui.

18
00:01:06,080 --> 00:01:10,150
Se você gostaria de vir para baixo.

19
00:01:10,150 --> 00:01:14,350
Vocês todos aplaudem e são muito agradáveis, mas ninguém está sentado perto Nate,

20
00:01:14,350 --> 00:01:17,560
por alguma razão, aquela zona em volta.

21
00:01:17,560 --> 00:01:24,020
Então talvez você pode encontrar algumas pessoas para desfrutar estes com.

22
00:01:24,020 --> 00:01:33,380
Feliz Aniversário, Nate.

23
00:01:33,380 --> 00:01:37,660
>> Hellos adicionais: Nós mostramos um clips casal de nossos alunos CS50x.

24
00:01:37,660 --> 00:01:39,710
Se você gostaria de ver quem é no mundo

25
00:01:39,710 --> 00:01:41,850
que está acompanhando, você pode ir para esta URL,

26
00:01:41,850 --> 00:01:45,780
onde José, um dos nossos TFS, montou uma espécie de montagem

27
00:01:45,780 --> 00:01:50,290
de todos que tem enviado os vídeos, entre eles Rick Astley.

28
00:01:50,290 --> 00:01:53,010
E se você percorrer estes, é realmente muito inspiradora

29
00:01:53,010 --> 00:01:56,890
ver a diversidade de países e cidades a partir do qual as pessoas estão vindos.

30
00:01:56,890 --> 00:02:00,830
Então, se você gostaria de dar uma olhada nisso, que será de até o final do semestre.

31
00:02:00,830 --> 00:02:05,370
Hoje vamos continuar o nosso olhar para a Web, programação web, HTML e afins,

32
00:02:05,370 --> 00:02:08,280
e também almoçar chegando nesta sexta-feira

33
00:02:08,280 --> 00:02:11,360
se você gostaria, e, particularmente, não o fizeram antes.

34
00:02:11,360 --> 00:02:13,630
O tema deste sexta-feira será o aniversário de Nate,

35
00:02:13,630 --> 00:02:15,700
Então, se você gostaria de ter almoço de aniversário com Nate

36
00:02:15,700 --> 00:02:17,500
e outros, alguns dos nossos amigos da Indústria,

37
00:02:17,500 --> 00:02:19,300
por favor cabeça para a URL lá.

38
00:02:19,300 --> 00:02:22,510
Espaço, como sempre, é limitada. Além disso, se você esqueceu,

39
00:02:22,510 --> 00:02:26,460
perceber que na próxima semana é o prazo para o problema definido 4 de caçada,

40
00:02:26,460 --> 00:02:30,070
em que depois de se recuperar de todas essas JPEGS de card.raw,

41
00:02:30,070 --> 00:02:32,880
você e seus companheiros de seção, se você quiser, pode tentar fotografar

42
00:02:32,880 --> 00:02:36,100
como muitos dos cientistas da computação de cartão de memória que possível,

43
00:02:36,100 --> 00:02:39,070
e você e sua seção irá ganhar um prêmio fabuloso.

44
00:02:39,070 --> 00:02:44,470
Remeter para pset 4 de especificação sobre o que apresentar e quando.

45
00:02:44,470 --> 00:02:47,650
Além disso, se você gostaria de ter a sua obra imortalizada

46
00:02:47,650 --> 00:02:51,400
no site do curso e sua história de vestuário,

47
00:02:51,400 --> 00:02:54,010
sei que você é bem-vindo agora para começar a enviar projetos

48
00:02:54,010 --> 00:02:57,180
para este ano, T-shirts e camisolas e afins.

49
00:02:57,180 --> 00:02:59,200
Nós vamos fazer o nosso melhor para incluir o maior número que podemos,

50
00:02:59,200 --> 00:03:01,440
mas vamos ter alguns membros do pessoal da revisão de todos os projetos

51
00:03:01,440 --> 00:03:04,180
para se certificar de que eles estão de acordo com as especificações,

52
00:03:04,180 --> 00:03:07,500
e em seguida, escolher geralmente um punhado deles para ser exibido.

53
00:03:07,500 --> 00:03:10,620
Então, se você é o tipo de construção, só sei que os requisitos

54
00:03:10,620 --> 00:03:14,030
para gráficos PNG são, pelo menos 200 DPI,

55
00:03:14,030 --> 00:03:16,520
não deve ser superior a 4000 x 4000 pixels,

56
00:03:16,520 --> 00:03:19,010
e não mais de 10 MB, mas você é bem-vindo para usar coisas como

57
00:03:19,010 --> 00:03:22,430
Photoshop ou GIMP ou vários gráficos de programas,

58
00:03:22,430 --> 00:03:24,590
o que você tem à sua disposição.

59
00:03:24,590 --> 00:03:28,280
>> Também no horizonte é o projeto final. O projeto final é realmente o clímax de 50,

60
00:03:28,280 --> 00:03:30,560
qual de todas as atribuições do curso,

61
00:03:30,560 --> 00:03:33,170
É a sua oportunidade de realmente fazer sua própria coisa.

62
00:03:33,170 --> 00:03:35,280
E isso pode ser simplesmente fazer algo para se divertir,

63
00:03:35,280 --> 00:03:38,160
pode ser para resolver algum problema premente seu grupo de estudante tem,

64
00:03:38,160 --> 00:03:40,980
por algum novo site, algum mecanismo de nova coleção de dados.

65
00:03:40,980 --> 00:03:43,420
Pode ser uma aplicação móvel para o Android, para iOS.

66
00:03:43,420 --> 00:03:46,030
Realmente, o céu é o limite, e ao longo das próximas semanas,

67
00:03:46,030 --> 00:03:50,900
como transição de C para essas linguagens de alto nível como PHP e JavaScript,

68
00:03:50,900 --> 00:03:55,150
você vai encontrar-se cada vez mais familiarizados com algumas técnicas do mundo real,

69
00:03:55,150 --> 00:03:57,800
algumas ferramentas do mundo real, e para complementar que,

70
00:03:57,800 --> 00:04:00,170
sei que o curso tem uma história de seminários,

71
00:04:00,170 --> 00:04:02,880
em que ao longo das semanas seguintes, alguns dos docentes

72
00:04:02,880 --> 00:04:06,160
e nossos amigos de no campus vai oferecer seminários opcionais

73
00:04:06,160 --> 00:04:08,540
que vão acima e além do que é normalmente feito na seção

74
00:04:08,540 --> 00:04:11,090
para apresentar-lhe coisas como programação Android,

75
00:04:11,090 --> 00:04:13,450
para apresentar-lhe coisas como iOS programação

76
00:04:13,450 --> 00:04:15,950
ou mais avançadas técnicas de desenvolvimento web.

77
00:04:15,950 --> 00:04:17,970
Há toda uma história de estes já online.

78
00:04:17,970 --> 00:04:25,000
Se você vai para cs50.net/seminars, estamos fazendo isso há vários anos,

79
00:04:25,000 --> 00:04:28,740
e você vai ver que arquivado aqui com PDFs e vídeos e afins

80
00:04:28,740 --> 00:04:33,090
são dezenas de vídeos de vários seminários.

81
00:04:33,090 --> 00:04:37,380
No ano passado, por exemplo, tivemos um seminário sobre acing suas entrevistas técnicas,

82
00:04:37,380 --> 00:04:40,980
se você está realmente olhando para sair e fazer um estágio ou de tempo integral show.

83
00:04:40,980 --> 00:04:43,450
Windows mobile desenvolvimento, desenvolvimento Android, Google Maps,

84
00:04:43,450 --> 00:04:47,700
API, CSS, desenvolvimento para o BlackBerry, Emacs.

85
00:04:47,700 --> 00:04:52,610
Realmente, você é bem-vindo para dar uma olhada em qualquer um desses seminários de sua conveniência.

86
00:04:52,610 --> 00:04:57,080
E nós vamos estar segurando alguns novos neste semestre, também.

87
00:04:57,080 --> 00:04:59,020
>> Então, o que está à frente com o projeto final?

88
00:04:59,020 --> 00:05:01,090
Bem, em primeiro lugar, mesmo que esta data é um pouco iminente,

89
00:05:01,090 --> 00:05:06,460
isso é realmente apenas uma oportunidade para começar a pensar o projeto final bastante realista.

90
00:05:06,460 --> 00:05:10,550
Sabemos apenas o começo de algumas das coisas que nós ainda vamos fazer a cobertura no curso,

91
00:05:10,550 --> 00:05:13,470
HTML, PHP e afins, mas estamos todos familiarizados com a web,

92
00:05:13,470 --> 00:05:16,270
e preconceito eu esta conversa para a Web só porque

93
00:05:16,270 --> 00:05:18,380
a maioria das pessoas acabam fazendo projetos baseados na Web finais,

94
00:05:18,380 --> 00:05:20,260
mas que não é de forma necessária.

95
00:05:20,260 --> 00:05:22,260
Usando C é bom, Objective C, Java,

96
00:05:22,260 --> 00:05:25,350
qualquer outra língua que você possa saber ou querer saber, é bastante tênue.

97
00:05:25,350 --> 00:05:29,370
Mas, para obter os sucos fluindo inicialmente, vamos esperar a apresentação de um preproposal

98
00:05:29,370 --> 00:05:33,520
que, por o PDF no site, que é agora de cs50.net,

99
00:05:33,520 --> 00:05:36,080
e no canto superior esquerdo você verá projeto final

100
00:05:36,080 --> 00:05:38,920
é a especificação para o projeto final,

101
00:05:38,920 --> 00:05:41,470
e existem em mais detalhes sobre a preproposal e similares.

102
00:05:41,470 --> 00:05:44,760
Ferve praticamente resume a um e-mail para o seu companheiro de ensino

103
00:05:44,760 --> 00:05:48,450
apenas para iniciar uma conversa com ele ou com ela sobre o que você está pensando.

104
00:05:48,450 --> 00:05:52,510
Em projects.cs50.net é um repositório de ideias de pessoas no campus

105
00:05:52,510 --> 00:05:54,480
se você está lutando para chegar a alguma idéia,

106
00:05:54,480 --> 00:06:01,140
e manual.cs50.net/APIs é um repositório de links para APIs.

107
00:06:01,140 --> 00:06:06,710
>> O que, porém, é uma API?

108
00:06:06,710 --> 00:06:09,790
O que é uma API? Eu já disse isso pelo menos duas vezes,

109
00:06:09,790 --> 00:06:12,640
de acordo com as transcrições das últimas semanas.

110
00:06:12,640 --> 00:06:17,050
O que é isso? [Estudante, ininteligível]

111
00:06:17,050 --> 00:06:19,340
>> Ok, bom. Então, interface de programação de alguma coisa.

112
00:06:19,340 --> 00:06:22,710
Interface de programação de aplicativo, e isso pode tomar várias formas,

113
00:06:22,710 --> 00:06:25,850
mas o que isto resume realmente para baixo é de código

114
00:06:25,850 --> 00:06:29,660
que alguém hs escrito ou dados que alguém tenha coletados

115
00:06:29,660 --> 00:06:33,670
que está disponível para você de alguma maneira programática.

116
00:06:33,670 --> 00:06:36,630
Você pode escrever código em C, PHP, Python, Ruby,

117
00:06:36,630 --> 00:06:38,760
qualquer que seja o idioma de sua escolha geralmente é,

118
00:06:38,760 --> 00:06:42,240
e você pode de alguma forma construir em cima de outra pessoa funcionalidade

119
00:06:42,240 --> 00:06:44,440
ou de outra pessoa conjunto de dados.

120
00:06:44,440 --> 00:06:47,210
Por exemplo, se eu ir a este link aqui,

121
00:06:47,210 --> 00:06:50,750
e você vai ver um par de links na página seguinte

122
00:06:50,750 --> 00:06:56,093
pelo qual temos próprias APIs CS50, que são muito Harvard-centric, e depois APIs de terceiros.

123
00:06:56,930 --> 00:06:59,300
Entre as APIs de terceiros são coisas realmente úteis

124
00:06:59,300 --> 00:07:01,780
como ser capaz de enviar as pessoas para o SMS, o

125
00:07:01,780 --> 00:07:04,690
ser capaz de receber mensagens de texto SMS de pessoas.

126
00:07:04,690 --> 00:07:08,160
E coisas assim que você pode ter nenhuma idéia de como implementar a si mesmo,

127
00:07:08,160 --> 00:07:10,440
mas graças a serviços, alguns, livres e alguns comerciais

128
00:07:10,440 --> 00:07:14,000
você pode construir sobre aqueles e fazer algo de interesse para você.

129
00:07:14,000 --> 00:07:16,990
Entre APIs CS50 são estas coisas campus-centric como

130
00:07:16,990 --> 00:07:21,480
Cursos de Harvard, energia, eventos, alimentação, mapas, notícias, tweets e Shuttleboy próprio,

131
00:07:21,480 --> 00:07:23,940
e estes são APIs que olhar um pouco algo como isto.

132
00:07:23,940 --> 00:07:26,990
>> Deixe-me puxar para cima a API HarvardFood.

133
00:07:26,990 --> 00:07:30,620
Se você já foi para o site do HUD, você provavelmente já esteve lá

134
00:07:30,620 --> 00:07:35,410
apenas para ver o que há para o jantar ou para ver o que as horas são para alguns d-hall.

135
00:07:35,410 --> 00:07:38,000
Bem, não é particularmente fácil de navegar,

136
00:07:38,000 --> 00:07:41,100
e assim o que fizemos há algum tempo foi que escreveu o software,

137
00:07:41,100 --> 00:07:47,270
ele passa a ser em PHP, que realmente tela raspa a totalidade do site HUD.

138
00:07:47,270 --> 00:07:51,400
Para a tela algo raspar significa escrever um programa em uma linguagem como PHP

139
00:07:51,400 --> 00:07:55,270
que pretende ser um navegador, mesmo que você possa executá-lo em um prompt de comando,

140
00:07:55,270 --> 00:07:58,180
que pretende ser um navegador, se conecta a um site,

141
00:07:58,180 --> 00:08:01,480
transfere seu HTML, a linguagem em que está escrito,

142
00:08:01,480 --> 00:08:04,300
e, em seguida, lê-lo, ou mais especificamente, analisa-lo

143
00:08:04,300 --> 00:08:06,140
de cima para baixo, da esquerda para a direita.

144
00:08:06,140 --> 00:08:08,870
E o que fizemos foi que nós escrevemos o nosso código de tal forma que

145
00:08:08,870 --> 00:08:12,910
toda vez que viu algo em que o HTML que parecia algo no menu,

146
00:08:12,910 --> 00:08:16,470
como hambúrguer, teríamos então que importar para o nosso próprio banco de dados.

147
00:08:16,470 --> 00:08:20,410
E toda vez que viu o conteúdo nutricional, teríamos que importar para o nosso próprio banco de dados.

148
00:08:20,410 --> 00:08:23,090
E o que fizemos foi aproveitar o fato de que o site do HUD,

149
00:08:23,090 --> 00:08:27,280
embora possa ser um pouco de um desafio para nós seres humanos para navegar

150
00:08:27,280 --> 00:08:32,559
debaixo da capa, todo o HTML é gerado pelos seus próprios programas de computador.

151
00:08:32,559 --> 00:08:35,159
Então, todo o seu HTML, mesmo que possa parecer confuso,

152
00:08:35,159 --> 00:08:38,026
como a maioria dos sites debaixo do capô, ele segue um padrão.

153
00:08:38,260 --> 00:08:40,799
Então, só passei um par de horas para descobrir que o padrão

154
00:08:40,799 --> 00:08:44,240
de modo que, no final, nós jogamos fora todo o HTML bagunçado,

155
00:08:44,240 --> 00:08:47,340
todos da estética de enfrentar negrito e itálico e afins,

156
00:08:47,340 --> 00:08:52,350
eo que nós somos então capazes de fazer é expor os mesmos dados.

157
00:08:52,350 --> 00:08:54,870
Por exemplo, desta maneira.

158
00:08:54,870 --> 00:08:56,840
Portanto, de acordo com a documentação aqui,

159
00:08:56,840 --> 00:08:59,190
informaram o mundo que se você solicitar uma URL

160
00:08:59,190 --> 00:09:03,310
que se parece com isso, food.cs50.net / alguma coisa,

161
00:09:03,310 --> 00:09:07,220
e você fornecer certos parâmetros, que vamos falar hoje,

162
00:09:07,220 --> 00:09:11,780
como data final hora de início da data-refeição, tempo, e assim por diante,

163
00:09:11,780 --> 00:09:14,090
o que os nossos servidores irá retornar para você, por exemplo,

164
00:09:14,090 --> 00:09:18,740
é um arquivo CSV vírgula, separted valores como um arquivo do Excel,

165
00:09:18,740 --> 00:09:23,140
contendo tudo no café da manhã, nesta data especial em março do ano passado

166
00:09:23,140 --> 00:09:25,450
quando aconteceu de eu escrever esta documentação.

167
00:09:25,450 --> 00:09:27,870
>> Para os familiares, CSV não é o formato de arquivo único.

168
00:09:27,870 --> 00:09:30,610
Há outro formato que é tudo o mais versátil

169
00:09:30,610 --> 00:09:32,670
chamado JSON, JavaScript Object Notation.

170
00:09:32,670 --> 00:09:34,770
Os dados podem voltar nesse formato.

171
00:09:34,770 --> 00:09:38,110
Assim, o takeaway aqui é que se você mergulhar nessa API

172
00:09:38,110 --> 00:09:41,170
ou qualquer outro dos CS50 ou qualquer coisa lá fora, na Internet,

173
00:09:41,170 --> 00:09:45,560
ou não em tudo, perceber que o mundo tem cada vez mais começou a padronizar

174
00:09:45,560 --> 00:09:47,670
como as máquinas se intercomunicam.

175
00:09:47,670 --> 00:09:50,660
Usamos formatos padrão de dados como CSV ou JSON.

176
00:09:50,660 --> 00:09:54,320
E o que isto significa para você é que você pode escrever a parte interessante de um programa

177
00:09:54,320 --> 00:09:56,580
que permite que o usuário procure um menu de refeitório,

178
00:09:56,580 --> 00:10:00,010
que lhes permite criar listas de favoritos que lhes permite receber alertas de texto

179
00:10:00,010 --> 00:10:02,480
quando a sua refeição favorita está prestes a ser servido em alguns d-hall

180
00:10:02,480 --> 00:10:07,090
usando conjuntos de dados de outra pessoa e de construção em cima de sua API.

181
00:10:07,090 --> 00:10:13,600
Assim, mais do que em forma de seminários e da documentação que você tem aqui em linha.

182
00:10:13,600 --> 00:10:16,450
Portanto, aqueles, então, são APIs.

183
00:10:16,450 --> 00:10:18,900
>> Isso nos traz de volta ao HTML. Rápida recapitulação.

184
00:10:18,900 --> 00:10:22,920
O que é HTML?

185
00:10:22,920 --> 00:10:25,000
[Estudante, ininteligível] Boa. >> HyperText Markup Language.

186
00:10:25,000 --> 00:10:31,300
Outra pessoa, o que é Hypertext Markup Language?

187
00:10:31,300 --> 00:10:37,340
HyperText Markup Language.

188
00:10:37,340 --> 00:10:40,330
Okay. Então, HTML, HyperText.

189
00:10:40,330 --> 00:10:43,100
HyperText refere-se apenas para a Web, para a maior parte.

190
00:10:43,100 --> 00:10:45,730
Marcação significa que não é, na verdade, uma linguagem de programação, HTML.

191
00:10:45,730 --> 00:10:48,120
Não é uma linguagem que você pode expressar a lógica dentro

192
00:10:48,120 --> 00:10:50,710
Ele não tem loops. Ele não tem condições.

193
00:10:50,710 --> 00:10:52,820
Ele não tem funções, per se.

194
00:10:52,820 --> 00:10:56,680
Pelo contrário, tem essas coisas chamadas tags, ou mais corretamente, elementos.

195
00:10:56,680 --> 00:10:59,970
E esses elementos têm marcas de início e tags de fim,

196
00:10:59,970 --> 00:11:04,300
ou tags abertas e tags fechadas, e que essas marcas geralmente significa para um navegador é,

197
00:11:04,300 --> 00:11:09,270
começar a fazer alguma coisa e, em seguida, parar de fazer algo, embora haja exceções.

198
00:11:09,270 --> 00:11:12,480
Às vezes é apenas "colocar uma quebra de linha aqui", por exemplo.

199
00:11:12,480 --> 00:11:15,150
E nós vimos exemplos de que no outro dia, entre o enfrentamento negrito,

200
00:11:15,150 --> 00:11:17,430
quebras de linha, e então um par de outras tags.

201
00:11:17,430 --> 00:11:19,880
Então HTML é a linguagem em que páginas são escritas.

202
00:11:19,880 --> 00:11:23,760
Então, se eu for para algo como Google.com

203
00:11:23,760 --> 00:11:26,180
e puxe-se apenas a página a sua casa,

204
00:11:26,180 --> 00:11:29,690
lembrar que, se você clique direito ou controlar clique

205
00:11:29,690 --> 00:11:32,140
e olhar para a origem da página vista, tipicamente

206
00:11:32,140 --> 00:11:34,420
é uma bagunça completa nestes dias debaixo da capa, mas isso é porque

207
00:11:34,420 --> 00:11:38,170
computadores não se preocupam com o espaço em branco, para que isso não tem que ficar bonita.

208
00:11:38,170 --> 00:11:40,240
Mas se ampliar em partes do mesmo,

209
00:11:40,240 --> 00:11:43,460
observar que o Chrome, apenas para ser agradável, tem código de cor as coisas.

210
00:11:43,460 --> 00:11:48,460
Na verdade, esta é a primeira tag que vimos em uma página web.

211
00:11:48,460 --> 00:11:51,750
E, novamente, o HTML 5, a última versão dessa linguagem,

212
00:11:51,750 --> 00:11:53,830
tem essa coisa no início,

213
00:11:53,830 --> 00:11:57,820
<! Doctype html, se maiúscula ou minúscula,

214
00:11:57,820 --> 00:12:03,580
mas isso é apenas uma espécie de padrão que diz, hey mundo, aí vem um arquivo HTML na versão 5.

215
00:12:03,580 --> 00:12:08,920
>> A parte interessante começa aqui. Então <html, e depois havia duas crianças

216
00:12:08,920 --> 00:12:11,640
dos elementos HTML última vez.

217
00:12:11,640 --> 00:12:14,630
O que eram aquelas duas crianças principais?

218
00:12:14,630 --> 00:12:17,170
Cabeça e corpo, assim como o cara com a tatuagem de um momento atrás.

219
00:12:17,170 --> 00:12:19,640
Há duas porções de página da web, cabeça e corpo,

220
00:12:19,640 --> 00:12:23,750
e recordação, então, que talvez a página mais simples web poderíamos fazer parecido com este.

221
00:12:23,750 --> 00:12:27,460
E eu tenho recuado apenas para ser uma espécie de limpo e arrumado com meu código,

222
00:12:27,460 --> 00:12:30,710
mas o que é realmente importante aqui é que não há uma hierarquia para isso.

223
00:12:30,710 --> 00:12:35,420
E qualquer marca que eu abri eu ter fechado e que não há, portanto, esta simetria

224
00:12:35,420 --> 00:12:38,300
a todos da marcação que eu criei.

225
00:12:38,300 --> 00:12:41,620
Então última vez que comecei a escrever páginas da web no meu próprio computador portátil.

226
00:12:41,620 --> 00:12:45,470
Eu abri edição de texto, eu salvei o arquivo como hello.html,

227
00:12:45,470 --> 00:12:50,190
Eu, então, arrastou o arquivo para o meu navegador, e pronto, eu tinha uma página na Internet.

228
00:12:50,190 --> 00:12:53,110
Agora, não é bem assim, eu tinha uma página no meu disco rígido,

229
00:12:53,110 --> 00:12:58,260
e eu estava literalmente a única pessoa no mundo que iria ver a página web em um navegador.

230
00:12:58,260 --> 00:13:00,670
>> Então, hoje, nós introduzimos um servidor web real

231
00:13:00,670 --> 00:13:02,750
ea noção de verdade servindo de conteúdo na internet

232
00:13:02,750 --> 00:13:04,970
e como isso tudo começa a se encaixar.

233
00:13:04,970 --> 00:13:08,350
Assim, verifica-se que todo este tempo no aparelho CS50

234
00:13:08,350 --> 00:13:11,590
você já teve um servidor web em seu computador.

235
00:13:11,590 --> 00:13:16,560
Nós, com justiça, apenas utilizado para gedit, por Clang, para o GDB e similares,

236
00:13:16,560 --> 00:13:21,000
mas também instalado por nós para você no aparelho é um servidor web,

237
00:13:21,000 --> 00:13:23,940
e que o servidor web passa a ser livre, de código aberto,

238
00:13:23,940 --> 00:13:26,580
um dos mais populares do mundo, chamado Apache.

239
00:13:26,580 --> 00:13:31,340
Seu nome mais técnico é HTTPd, o d estar para daemon aqui,

240
00:13:31,340 --> 00:13:34,110
que é um termo técnico para um servidor.

241
00:13:34,110 --> 00:13:38,690
Então instalado no aparelho CS50 é um servidor web, eo que é que isso significa?

242
00:13:38,690 --> 00:13:43,740
Bem, um servidor web é, conceitualmente, algum servidor na Internet que serve de conteúdo web.

243
00:13:43,740 --> 00:13:48,630
Quando perguntado sobre um arquivo, ele cospe o HTML que compõe o arquivo, e pronto.

244
00:13:48,630 --> 00:13:51,370
Você vê alguma página inicial do site.

245
00:13:51,370 --> 00:13:54,970
Mas um servidor é, mais precisamente, uma parte do software.

246
00:13:54,970 --> 00:13:59,190
Ele não tem que estar em uma máquina física, ele só tem que ser um pedaço de funcionamento do software.

247
00:13:59,190 --> 00:14:01,980
Assim, o aparelho CS50, é claro, é um componente de software

248
00:14:01,980 --> 00:14:04,270
mesmo que ele é uma espécie de fingir ser uma máquina.

249
00:14:04,270 --> 00:14:06,960
Ele finge ser um computador dentro de um computador,

250
00:14:06,960 --> 00:14:11,140
mas isso só significa que o aparelho pode certamente executar coisas como servidores web.

251
00:14:11,140 --> 00:14:13,260
Ele pode rodar servidores de e-mail.

252
00:14:13,260 --> 00:14:16,440
Nós poderíamos executar um servidor de mensagens instantâneas no aparelho, se quiséssemos,

253
00:14:16,440 --> 00:14:20,780
e, de fato, nós executar um outro tipo de servidor, conhecido como um servidor de banco de dados, mySQL.

254
00:14:20,780 --> 00:14:22,620
Mas mais sobre isso na próxima semana.

255
00:14:22,620 --> 00:14:26,400
Isso significa que eu posso realmente visitar páginas da Web

256
00:14:26,400 --> 00:14:30,480
dentro do meu aparelho usando um navegador dentro do aparelho

257
00:14:30,480 --> 00:14:33,600
ou até mesmo no meu laptop, meu Mac ou o meu PC.

258
00:14:33,600 --> 00:14:37,780
Então, o que isso significa? Acontece que toda vez que você estiver executando um computador com Linux,

259
00:14:37,780 --> 00:14:40,910
seu apelido é "host local."

260
00:14:40,910 --> 00:14:43,370
Ele não tem um nome de domínio, porque não compraram um nome de domínio

261
00:14:43,370 --> 00:14:46,590
para algo como o aparelho, assim que seu nome padrão é host local.

262
00:14:46,590 --> 00:14:50,470
>> Mas, para obter o aparelho para começar a servir as páginas,

263
00:14:50,470 --> 00:14:52,270
temos que criá-los primeiro.

264
00:14:52,270 --> 00:14:55,200
Então, vamos fazer isso. Deixe-me entrar em uma janela de terminal aqui

265
00:14:55,200 --> 00:14:58,190
e perceber que eu estou no meu típico John Harvard prompt.

266
00:14:58,190 --> 00:15:01,670
Deixe-me ir em frente e digite ls, e vamos ver algumas coisas familiares a partir deste semestre,

267
00:15:01,670 --> 00:15:04,580
desktop, downloads, dropbox e assim por diante,

268
00:15:04,580 --> 00:15:07,540
mas agora nós começar a transformar a nossa atenção para um casal.

269
00:15:07,540 --> 00:15:11,530
Em muitos servidores web Linux há essa pasta chamada html público,

270
00:15:11,530 --> 00:15:15,630
mas vamos pular essa uma para agora e focar esta vhosts,.

271
00:15:15,630 --> 00:15:18,850
Alguém sabe o que é um vhost?

272
00:15:18,850 --> 00:15:21,110
Apenas jargão estúpido por máquina virtual,

273
00:15:21,110 --> 00:15:23,850
eo que isso significa é que, em um típico servidor

274
00:15:23,850 --> 00:15:26,810
você pode realmente hospedar vários sites.

275
00:15:26,810 --> 00:15:31,500
Você pode comprar um nome de domínio como foo.com, e você pode hospedá-lo em um servidor.

276
00:15:31,500 --> 00:15:36,100
Mas você também pode comprar bar.com e hospedá-lo no mesmo servidor.

277
00:15:36,100 --> 00:15:40,250
A razão de ser, os navegadores são inteligentes o suficiente para informar ao servidor

278
00:15:40,250 --> 00:15:45,880
quando um usuário está solicitando alguma página, o que o nome de domínio que o usuário quer a homepage para.

279
00:15:45,880 --> 00:15:48,760
Então, o que é legal sobre isso é que você não precisa de um servidor físico

280
00:15:48,760 --> 00:15:52,040
ou um aparelho CS50 para cada site que você pode criar.

281
00:15:52,040 --> 00:15:55,520
Você pode usar o mesmo servidor e desenvolver uma centena de sites diferentes.

282
00:15:55,520 --> 00:15:58,770
E, de fato, se você é uma pessoa que tenta iniciar um site,

283
00:15:58,770 --> 00:16:02,100
para se divertir ou para o negócio, normalmente você vai sair na Internet,

284
00:16:02,100 --> 00:16:04,650
e você vai pagar alguém 10 dólares por mês, cem dólares por mês

285
00:16:04,650 --> 00:16:06,670
para hospedar seu site para você.

286
00:16:06,670 --> 00:16:11,060
E a maneira que funciona é que eles estão cobrando outras pessoas

287
00:16:11,060 --> 00:16:13,160
10 dólares por mês ou cem dólares por mês

288
00:16:13,160 --> 00:16:17,200
para hospedar sites de outras pessoas em seu servidor mesmo.

289
00:16:17,200 --> 00:16:20,740
A razão que eles podem fazer isso é por causa deste recurso chamado bhosts,

290
00:16:20,740 --> 00:16:23,790
mas mais sobre isso quando se trata tempo para projetos finais.

291
00:16:23,790 --> 00:16:28,360
>> Por agora, vamos mergulhar lá. Então vhosts cd, e se eu digitar ls agora,

292
00:16:28,360 --> 00:16:31,370
perceber que há uma pasta lá chamada host local.

293
00:16:31,370 --> 00:16:33,440
Isso porque, por padrão, os números de aparelhos

294
00:16:33,440 --> 00:16:36,160
você está sempre indo para executar um site em um aparelho.

295
00:16:36,160 --> 00:16:38,970
Isto não é realmente o mundo real, não é um servidor web no mundo real.

296
00:16:38,970 --> 00:16:41,690
Então deixe-me ir para locais de acolhimento, e agora vamos ver lá

297
00:16:41,690 --> 00:16:44,290
um último diretório chamado HTML.

298
00:16:44,290 --> 00:16:47,080
Então é um pouco profundo, a hierarquia, mas se e quando

299
00:16:47,080 --> 00:16:51,230
você decidir começar a desenvolver vários sites ao longo dos próximos meses ou anos n,

300
00:16:51,230 --> 00:16:54,370
este tipo de estrutura da pasta tende a ser útil.

301
00:16:54,370 --> 00:16:56,560
Agora vamos em HTML como eu fiz,

302
00:16:56,560 --> 00:16:59,010
ls tipo, e nada está lá.

303
00:16:59,010 --> 00:17:01,390
Então agora vamos seguir em frente e fazer isso. Deixe-me abrir Chrome

304
00:17:01,390 --> 00:17:07,300
interior do aparelho, e deixe-me ir para http://localhost.

305
00:17:07,300 --> 00:17:14,440
Então, literalmente, o nome para o meu aparelho, entrar, e eu recebo índice de /.

306
00:17:14,440 --> 00:17:18,290
Isto não é realmente mostrando-me qualquer coisa de interesse,

307
00:17:18,290 --> 00:17:23,400
mas acontece que o que estamos vendo é que pasta, HTML.

308
00:17:23,400 --> 00:17:25,770
Não há nada dentro dessa pasta, agora,

309
00:17:25,770 --> 00:17:28,750
Em vez disso, o que eu vou ter que fazer é criar um arquivo.

310
00:17:28,750 --> 00:17:33,530
Crie um arquivo HTML, como fizemos na segunda-feira, mas desta vez colocá-lo dentro do aparelho.

311
00:17:33,530 --> 00:17:36,830
Para aqueles de vocês que estão tentando seguir junto com laptops agora,

312
00:17:36,830 --> 00:17:42,040
deixe-me fazer um aparte que vai ser abordado no pset web-based,

313
00:17:42,040 --> 00:17:44,280
mas para chegar a este trabalho para a primeira vez,

314
00:17:44,280 --> 00:17:49,830
você vai ter que correr o comando: sudo start httpd serviço.

315
00:17:49,830 --> 00:17:52,670
E isto, mais uma vez, vai ser repetido no pset último,

316
00:17:52,670 --> 00:17:55,460
mas se você está tocando em casa agora, o servidor web

317
00:17:55,460 --> 00:17:58,660
é desligado o aparelho, e isso é para que ele não enfraquecer a memória RAM

318
00:17:58,660 --> 00:18:01,960
e memória para 7 semanas do semestre quando não precisa.

319
00:18:01,960 --> 00:18:05,190
Então, você precisa executar este comando uma vez, e você vai ter uma saída como essa.

320
00:18:05,190 --> 00:18:07,920
Então você deve ser capaz de jogar junto aqui.

321
00:18:07,920 --> 00:18:10,330
Agora vamos voltar para essa pasta.

322
00:18:10,330 --> 00:18:12,770
Esta pasta está vazia, então deixe-me começar a criar um arquivo,

323
00:18:12,770 --> 00:18:16,360
gedit hello.html.

324
00:18:16,360 --> 00:18:20,930
>> Tudo bem. Gedit é aberta, como de costume. Deixe-me fazer doctype, html,

325
00:18:20,930 --> 00:18:25,270
html, deixe-me chegar à frente de mim e começar a fechar minhas marcas com antecedência.

326
00:18:25,270 --> 00:18:28,380
Agora eu tenho a cabeça. Deixe-me ir à frente e fechar a cabeça,

327
00:18:28,380 --> 00:18:32,450
deixe-me agora fazer o título da página, Olá mundo como da última vez,

328
00:18:32,450 --> 00:18:34,790
título perto, agora deixe-me fazer um corpo.

329
00:18:34,790 --> 00:18:38,130
Aqui eu vou dizer Olá, mundo com alguns exclams

330
00:18:38,130 --> 00:18:40,550
para deixar claro que é uma seqüência diferente.

331
00:18:40,550 --> 00:18:45,800
Corpo perto, e agora deixe-me ir em frente e apresentar salvar.

332
00:18:45,800 --> 00:18:48,470
Deixe-me voltar para a minha janela de terminal, e se eu digitar ls,

333
00:18:48,470 --> 00:18:51,830
Eu deveria, supostamente, ver hello.html. E eu faço.

334
00:18:51,830 --> 00:18:55,070
Então agora vamos voltar para o meu navegador, clique em recarregar,

335
00:18:55,070 --> 00:18:58,930
e você pode ver que estamos de fato dentro desta pasta HTML.

336
00:18:58,930 --> 00:19:02,310
Eu não estou vendo uma página web ainda, o que é o Apache, o servidor web,

337
00:19:02,310 --> 00:19:04,670
apenas me mostrando o conteúdo da lista deste diretório.

338
00:19:04,670 --> 00:19:08,260
Assim como o Mac OS ou o Windows normalmente fazem em sua unidade local rígido.

339
00:19:08,260 --> 00:19:12,730
Então, se eu quero ver esta página web, pode clicar nesse link pouco aqui, hello.html,

340
00:19:12,730 --> 00:19:15,160
e, de fato, é o que eu estava esperando para ver.

341
00:19:15,160 --> 00:19:18,080
Agora, novamente, este não é um URL que qualquer um de vocês pode visitar agora,

342
00:19:18,080 --> 00:19:20,760
porque para você hospedar, local, se você tiver um laptop aqui,

343
00:19:20,760 --> 00:19:23,050
ele está se referindo à sua própria instância do aparelho.

344
00:19:23,050 --> 00:19:25,900
Isso está no meu aparelho pessoal,

345
00:19:25,900 --> 00:19:29,080
mas este é o tipo de idiota que eu tenho, de ter

346
00:19:29,080 --> 00:19:34,480
um usuário como eu clicar em hello.html para realmente ver o conteúdo da página.

347
00:19:34,480 --> 00:19:42,590
Acontece que os servidores web como o Apache deixa você tem um arquivo padrão para qualquer servidor web.

348
00:19:42,590 --> 00:19:44,640
Observe aqui temos hello.html.

349
00:19:44,640 --> 00:19:48,410
Qual é o comando no Linux para renomear um arquivo?

350
00:19:48,410 --> 00:19:50,870
>> MV, para o movimento. Então deixe-me fazer isso,

351
00:19:50,870 --> 00:19:55,870
e deixe-me renomear hello.html a index.html.

352
00:19:55,870 --> 00:19:58,610
Deixe-me digitar ls para confirmá-la agora foi renomeado.

353
00:19:58,610 --> 00:20:03,250
Agora é que isto vai - se eu voltar aos locais de acolhimento,

354
00:20:03,250 --> 00:20:06,710
perceber agora que eu estou vendo que automaticamente página web.

355
00:20:06,710 --> 00:20:11,740
Isso é idêntico ao meu realmente fazendo / index.html,

356
00:20:11,740 --> 00:20:14,740
mas o bom é que agora o servidor web está imaginando,

357
00:20:14,740 --> 00:20:18,830
oh, se você tiver um arquivo que, por convenções humanas, é chamado index.html

358
00:20:18,830 --> 00:20:21,200
deixe-me mostrar o usuário arquivo que por padrão

359
00:20:21,200 --> 00:20:25,290
em vez de algum diretório listagem estúpido que não é de todo user-friendly.

360
00:20:25,290 --> 00:20:28,900
Na verdade, a maioria dos sites que você visita na Internet não tem uma lista de arquivos para clicar,

361
00:20:28,900 --> 00:20:34,040
eles apenas mostrar-lhe o conteúdo. Então é assim que nós podemos fazer isso, index.html.

362
00:20:34,040 --> 00:20:37,000
Portanto, esta é toda a diversão e bom, mas esta é uma página web muito simples.

363
00:20:37,000 --> 00:20:41,640
Deixe-me ir em frente e abrir index.html em meus vhosts,

364
00:20:41,640 --> 00:20:47,620
hosts locais, diretório de html, e vamos acrescentar algo de maior interesse.

365
00:20:47,620 --> 00:20:56,120
Portanto, não há Olá mundo, vamos em vez dizer 'Isto é CS50, Harvard College. . . '

366
00:20:56,120 --> 00:21:00,000
Assim, no início do curso da descrição do catálogo de algum tipo ali.

367
00:21:00,000 --> 00:21:03,780
Agora, se eu recarregar, eu deveria ver isso na minha página inicial.

368
00:21:03,780 --> 00:21:09,560
Ok, e eu vejo isso, mas suponhamos que eu quero agora listar alguns conteúdos mais neste arquivo.

369
00:21:09,560 --> 00:21:15,160
Eu poderia ir até aqui e dizer que nenhum pré-requisitos,

370
00:21:15,160 --> 00:21:18,740
embora alguns de vocês provavelmente estão como, "Ha ha ha, nenhum pré-requisito.

371
00:21:18,740 --> 00:21:24,320
Mas - oficialmente. Então recarregar, e agora temos a peculiaridade mesmo que vimos da última vez.

372
00:21:24,320 --> 00:21:26,240
Mas por que isso? Foi uma simples correção.

373
00:21:26,240 --> 00:21:31,440
Por que é que esta página quebrado?

374
00:21:31,440 --> 00:21:34,170
[Estudante, ininteligível] >> Sim, nós resolvemos isso antes

375
00:21:34,170 --> 00:21:37,440
explicitamente dizendo ao navegador "colocar uma quebra de linha aqui."

376
00:21:37,440 --> 00:21:39,440
E isso porque, novamente, um navegador só vai fazer

377
00:21:39,440 --> 00:21:42,610
explicitamente o que a linguagem de marcação diz para fazer,

378
00:21:42,610 --> 00:21:45,730
por isso mesmo que você pode ter atingido entrar uma ou duas vezes ou mesmo dez vezes,

379
00:21:45,730 --> 00:21:49,870
que vai combinar isso tudo em um único espaço, apenas por convenção.

380
00:21:49,870 --> 00:21:52,770
Então, se você realmente quer uma quebra de linha, você tem que usar a tag br,

381
00:21:52,770 --> 00:21:56,840
e agora o aviso prévio, como segunda-feira, eu coloquei o dentro / dessa marca,

382
00:21:56,840 --> 00:22:00,090
só porque esta simplesmente não se sente bem

383
00:22:00,090 --> 00:22:02,990
para iniciar uma quebra de linha, então pará-lo com nada entre eles.

384
00:22:02,990 --> 00:22:07,740
>> Assim, a convenção em HTML é abrir e fechar uma tag simultaneamente.

385
00:22:07,740 --> 00:22:11,050
Como um aparte, você vai ver um monte de sites de livros não fazendo isso.

386
00:22:11,050 --> 00:22:14,240
É correto fazer ou não fazer, mas diríamos

387
00:22:14,240 --> 00:22:17,430
que o projeto-sábio e estilisticamente, é apenas melhor

388
00:22:17,430 --> 00:22:20,540
porque, então, cada marca é tanto abrir e fechar de alguma forma.

389
00:22:20,540 --> 00:22:23,370
Então agora vamos salvar e recarregar. Volte para o navegador, ok.

390
00:22:23,370 --> 00:22:26,680
Agora nós estamos fazendo algum progresso, mas não é o bastante.

391
00:22:26,680 --> 00:22:33,210
Vamos em frente e começar a digitar em algum tempo o corpo do texto.

392
00:22:33,210 --> 00:22:40,610
Então, vamos dizer, 'A rápida raposa marrom pula sobre um cão preguiçoso. "

393
00:22:40,610 --> 00:22:42,700
E agora deixe-me apenas copiar e colar este algumas vezes

394
00:22:42,700 --> 00:22:45,040
de modo que temos um parágrafo de texto.

395
00:22:45,040 --> 00:22:47,780
Deixe-me voltar aqui. Portanto, não está olhando muito bom.

396
00:22:47,780 --> 00:22:50,000
Eu tenho uma quebra de linha, então está tudo bem,

397
00:22:50,000 --> 00:22:52,140
mas agora, uma vez que estamos chegando ao ponto de ter uma página web

398
00:22:52,140 --> 00:22:55,640
que tem muito conteúdo e não apenas linhas individuais para demonstrar HTML,

399
00:22:55,640 --> 00:22:58,570
podemos começar a pensar nessas coisas como parágrafos reais.

400
00:22:58,570 --> 00:23:01,590
E podemos começar a estruturar a nossa página web um pouco mais limpa.

401
00:23:01,590 --> 00:23:05,120
E, de fato, o que eu posso fazer é ir até aqui, dentro da minha tag corpo,

402
00:23:05,120 --> 00:23:09,400
e você sabe que, se 'Este é CS50. . . ' demarks realmente o início de um parágrafo,

403
00:23:09,400 --> 00:23:11,310
bem, vamos marcá-lo como tal.

404
00:23:11,310 --> 00:23:13,570
Deixe-me recuar o texto, apenas por convenção, deixe-me dizer

405
00:23:13,570 --> 00:23:15,710
que este parágrafo termina aqui,

406
00:23:15,710 --> 00:23:18,320
e depois, em vez de fazer isso quebra de linha, deixe-me dizer

407
00:23:18,320 --> 00:23:23,300
que este pertence lá e como um novo parágrafo,

408
00:23:23,300 --> 00:23:27,610
e eu vou apenas rapidamente travessão por apenas sobrepor todas essas coisas.

409
00:23:27,610 --> 00:23:30,660
>> Portanto, agora temos um parágrafo recuado lá,

410
00:23:30,660 --> 00:23:33,510
e agora a nossa marcação está começando a ficar um pouco mais

411
00:23:33,510 --> 00:23:37,070
semanticamente consistente com o que estamos tentando fazer.

412
00:23:37,070 --> 00:23:40,130
Temos um parágrafo, então vamos chamá-lo de um parágrafo com a tag p.

413
00:23:40,130 --> 00:23:43,370
Temos um segundo parágrafo, então vamos chamá-lo de um parágrafo com a tag p.

414
00:23:43,370 --> 00:23:45,850
E agora, o que o navegador normalmente fazem

415
00:23:45,850 --> 00:23:48,490
é como em um livro de Inglês ou ensaio,

416
00:23:48,490 --> 00:23:51,280
onde você costuma ver algumas quebras de linha entre os parágrafos.

417
00:23:51,280 --> 00:23:53,720
Navegadores vai fazer isso por você automaticamente.

418
00:23:53,720 --> 00:23:56,680
Portanto, agora temos dois parágrafos e podemos continuar isso.

419
00:23:56,680 --> 00:23:58,770
Mas, é claro, na web, quando você tem corpos de texto

420
00:23:58,770 --> 00:24:01,370
não é normalmente apenas manchas enormes de texto.

421
00:24:01,370 --> 00:24:04,040
Existem muitas vezes hiperlinks lá.

422
00:24:04,040 --> 00:24:07,250
Então, se nós queremos, por exemplo, incluir alguns links lá,

423
00:24:07,250 --> 00:24:10,760
acho que o que pode ser de interesse em qualquer página da web que eu estou criando aqui é -

424
00:24:10,760 --> 00:24:12,780
deixe-me ir para o Google.com,

425
00:24:12,780 --> 00:24:16,540
e deixe-me procurar uma ligeira raposa marrom.

426
00:24:16,540 --> 00:24:22,150
Ir para imagens do Google, e, que tal - isto é bonito.

427
00:24:22,150 --> 00:24:27,420
Nós vamos com isso. Portanto, temos aqui um rápido salto marrom Fox sobre um cão preguiçoso.

428
00:24:27,420 --> 00:24:30,560
Então o que eu vou fazer aqui, apenas por uma questão de demonstração,

429
00:24:30,560 --> 00:24:32,950
é supor que esta imagem foi no meu servidor,

430
00:24:32,950 --> 00:24:35,240
e eu tinha vindo a criar essas imagens.

431
00:24:35,240 --> 00:24:38,720
O que eu fiz foi com o botão direito ou clique na imagem,

432
00:24:38,720 --> 00:24:42,370
eo que você vai ver na maioria dos navegadores é um pequeno menu -

433
00:24:42,370 --> 00:24:48,800
parar de fazer isso - um pequeno menu que permite que você escolha a localização cópia link ou URL cópia.

434
00:24:48,800 --> 00:24:52,750
Então deixe-me voltar agora para o meu HTML, e suponha que eu quero

435
00:24:52,750 --> 00:24:56,420
hiperlink para esta para outra página web.

436
00:24:56,420 --> 00:24:58,640
>> Qual foi a marca chamada para isso?

437
00:24:58,640 --> 00:25:01,650
[Estudante, ininteligível] >> Yeah. Então a href para referência hiper.

438
00:25:01,650 --> 00:25:04,660
Deixe-me ir em frente e colar que dentro

439
00:25:04,660 --> 00:25:07,290
É uma URL muito longa, então deixe-me zoom out.

440
00:25:07,290 --> 00:25:09,950
Suportes próximos, então agora eu estou notar caminho até aqui

441
00:25:09,950 --> 00:25:11,960
porque essa URL passou a ser bastante longa.

442
00:25:11,960 --> 00:25:15,180
Deixe-me deslocar até aqui para o final de ligeira raposa marrom,

443
00:25:15,180 --> 00:25:18,830
e deixe-me terminar esta tag com </ a,

444
00:25:18,830 --> 00:25:21,280
onde eu só fechou o nome da marca.

445
00:25:21,280 --> 00:25:24,470
Agora deixe-me ir em frente e salvar o arquivo, recarregue a página web,

446
00:25:24,470 --> 00:25:27,880
e agora, por padrão, que vai ser sublinhada em azul para mim,

447
00:25:27,880 --> 00:25:31,980
mas, na verdade, agora eu posso clicar neste e voila. Há essa imagem.

448
00:25:31,980 --> 00:25:33,990
E não tem que ser uma imagem, poderia ter ligado

449
00:25:33,990 --> 00:25:36,270
para algum outro site aleatória na Internet.

450
00:25:36,270 --> 00:25:39,610
Eu poderia fazer isso, por exemplo, com o CS50, para um último exemplo aqui.

451
00:25:39,610 --> 00:25:42,730
'Este é CS50 "pode ​​fazer sentido para ir um, href =

452
00:25:42,730 --> 00:25:50,340
http://www.cs50.net, citações perto, âncora perto.

453
00:25:50,340 --> 00:25:53,990
Portanto, agora que é uma URL ainda menor, e desta vez nós não vamos ligar a imagem.

454
00:25:53,990 --> 00:25:57,880
Estamos em vez de ir de vincular a outra página.

455
00:25:57,880 --> 00:25:59,840
Agora, temos uma imagem aqui.

456
00:25:59,840 --> 00:26:02,970
Eu sinto que nós podemos fazer um pouco melhor do que apenas um link para uma imagem.

457
00:26:02,970 --> 00:26:05,760
E se nós queremos realmente incorporá-lo em nossa página da web?

458
00:26:05,760 --> 00:26:09,290
>> Bem, o que posso fazer aqui é, em vez de link para gráfico,

459
00:26:09,290 --> 00:26:14,690
deixe-me em vez cortar o URL, e nós vamos nos livrar desse link e limpar isso.

460
00:26:14,690 --> 00:26:17,190
E nós vamos descer aqui e se livrar dessa.

461
00:26:17,190 --> 00:26:20,910
Nós realmente não precisa de todas estas frases agora, então deixe-me encurtar a página um pouco.

462
00:26:20,910 --> 00:26:24,530
E então, aqui deixa-me ir à frente em um novo parágrafo,

463
00:26:24,530 --> 00:26:30,100
dizer que eu não quero texto agora, eu quero uma imagem cuja origem vai ser essa URL.

464
00:26:30,100 --> 00:26:33,100
Uma imagem, como uma quebra de linha, pode existir ou não é.

465
00:26:33,100 --> 00:26:35,900
Então deixe-me imediatamente fechar essa marca.

466
00:26:35,900 --> 00:26:39,440
Deixe-me ir em frente agora e fechar o parágrafo que eu estou dentro,

467
00:26:39,440 --> 00:26:43,010
e se tudo correr bem com Olá, mundo, se eu recarregar agora,

468
00:26:43,010 --> 00:26:45,520
Eu, de fato, ver bem dentro de minha própria página web uma imagem.

469
00:26:45,520 --> 00:26:48,570
Portanto, agora temos uma tag de imagem, uma marca de âncora e similares,

470
00:26:48,570 --> 00:26:51,320
e para uma boa medida, deixe-me fazer uma outra coisa que é muitas vezes negligenciado

471
00:26:51,320 --> 00:26:55,900
em sites estes dias: Vamos fornecer um texto descritivo para esta imagem

472
00:26:55,900 --> 00:26:58,090
para pessoas que estão em um dispositivo móvel

473
00:26:58,090 --> 00:27:00,640
e, portanto, pode não ser capaz de baixar esta imagem muito rapidamente,

474
00:27:00,640 --> 00:27:03,310
para as pessoas que são cegas e pode não ser capaz de ver a imagem

475
00:27:03,310 --> 00:27:06,480
mas eles podem ter um leitor de tela que pode dizer-lhes que esta imagem é de.

476
00:27:06,480 --> 00:27:09,100
E para fazer isso, há um outro atributo para tags de imagem

477
00:27:09,100 --> 00:27:11,290
chamado alt, para texto alternativo.

478
00:27:11,290 --> 00:27:14,650
E o que eu posso fazer aqui é dizer: 'Esta é uma rápida raposa marrom.

479
00:27:14,650 --> 00:27:17,650
De modo que, mesmo que o ser humano não pode ver a imagem no ecrã,

480
00:27:17,650 --> 00:27:20,560
ele ou ela pode, pelo menos, ouvir, como com algum pedaço de software,

481
00:27:20,560 --> 00:27:23,080
o que realmente está lá na tela.

482
00:27:23,080 --> 00:27:25,040
>> Isso não vai mudar a estética da página,

483
00:27:25,040 --> 00:27:27,640
mas certamente é uma boa prática para os usuários.

484
00:27:27,640 --> 00:27:31,760
Tudo bem, vamos sair desta página web em sua forma atual,

485
00:27:31,760 --> 00:27:33,890
mas vamos ver se não podemos agora introduzir

486
00:27:33,890 --> 00:27:36,210
algumas abordagens melhores para escrever estas páginas da web,

487
00:27:36,210 --> 00:27:39,980
algumas lições que vão servir-nos bem como as nossas páginas mais e mais complexo.

488
00:27:39,980 --> 00:27:42,220
O que nós não vamos fazer mais nas próximas semanas

489
00:27:42,220 --> 00:27:46,810
é levá-lo através de todas as tags HTML de várias dezenas que existem.

490
00:27:46,810 --> 00:27:49,800
Assim como no zero de volta na semana 0, ele provavelmente será suficiente

491
00:27:49,800 --> 00:27:52,120
para dar uma visão geral de alto nível de alguns dos conceitos,

492
00:27:52,120 --> 00:27:54,530
um rápido passeio de alguns dos blocos que você provavelmente eram capazes,

493
00:27:54,530 --> 00:27:58,240
muito confortavelmente, para navegar em seu próprio país, as várias peças do puzzle.

494
00:27:58,240 --> 00:28:00,460
E isso vai acontecer novamente em HTML, o mais provável,

495
00:28:00,460 --> 00:28:04,320
em que há amplos recursos na Web que nós vamos apontá-lo menos,

496
00:28:04,320 --> 00:28:06,920
vários livros, se você preferir ler um livro,

497
00:28:06,920 --> 00:28:10,560
que irá orientá-lo através de todas as várias coisas que você pode fazer com HTML,

498
00:28:10,560 --> 00:28:16,100
mas realmente, temos visto até agora em HTML a maioria dos conceitos fundamentais.

499
00:28:16,100 --> 00:28:19,900
Temos a noção de tags sendo abertos, tags de ser fechada.

500
00:28:19,900 --> 00:28:22,100
Algumas marcas que são ambos abertos e fechados

501
00:28:22,100 --> 00:28:24,620
no sentido de que estão vazios e que deveria haver nada dentro deles

502
00:28:24,620 --> 00:28:27,490
como uma tag de imagem ou uma quebra de linha, que estão lá apenas.

503
00:28:27,490 --> 00:28:32,330
Buscamos também já com a noção de um atributo, como alt ou fonte.

504
00:28:32,330 --> 00:28:36,410
Observe que essas palavras tendem, por convenção, para ser curto e sucinto.

505
00:28:36,410 --> 00:28:39,140
>> Não temos autoridade sobre o que essas coisas são chamados,

506
00:28:39,140 --> 00:28:42,060
alguém que inventou o HTML veio com esses nomes.

507
00:28:42,060 --> 00:28:44,710
Então, você apenas tem que começar a conhecer ou procurar, sempre que você precisar deles,

508
00:28:44,710 --> 00:28:47,160
o que os nomes são para estas tags e atributos.

509
00:28:47,160 --> 00:28:49,510
No caso de estes atributos, atribui geralmente

510
00:28:49,510 --> 00:28:52,900
modificar o comportamento de alguns tag.

511
00:28:52,900 --> 00:28:55,710
Neste caso, o atributo de fonte diz a marca de imagem

512
00:28:55,710 --> 00:28:57,940
o que a fonte da imagem deve ser.

513
00:28:57,940 --> 00:29:04,460
O atributo href diz a marca de âncora o que realmente deve ser vinculando.

514
00:29:04,460 --> 00:29:06,800
Mas em termos da estrutura de uma página da web, apesar Facebook

515
00:29:06,800 --> 00:29:09,680
e Google e do olhar como como uma bagunça completa

516
00:29:09,680 --> 00:29:12,560
debaixo do capô, à primeira vista, se você começar a lê-lo

517
00:29:12,560 --> 00:29:16,950
mais metodicamente, todos seguem esta estrutura básica, básica.

518
00:29:16,950 --> 00:29:19,660
Mas podemos melhorar a estilização dessas coisas.

519
00:29:19,660 --> 00:29:24,180
Então deixe-me ir a alguns exemplos que eu preparadas com antecedência.

520
00:29:24,180 --> 00:29:27,280
Deixe-me ir em frente e copiá-los de outra pasta aqui

521
00:29:27,280 --> 00:29:29,380
e colocá-los neste diretório.

522
00:29:29,380 --> 00:29:32,210
De antemão, o que fiz foi preparar alguns arquivos:

523
00:29:32,210 --> 00:29:35,670
search0, SEARCH1, Search2 e search3 e 4.

524
00:29:35,670 --> 00:29:38,740
Deixe-me ir em frente e abrir o primeiro desses arquivos,

525
00:29:38,740 --> 00:29:42,570
e vamos ver se não podemos começar a criar o nosso próprio motor de busca.

526
00:29:42,570 --> 00:29:46,530
No topo deste arquivo, como é geralmente o caso em sala de aula, apenas um monte de comentários.

527
00:29:46,530 --> 00:29:49,760
Em HTML, porém, os meios pelos quais você iniciar um comentário

528
00:29:49,760 --> 00:29:55,640
é <-! e então você está dentro de um comentário, um comentário multi-linha.

529
00:29:55,640 --> 00:29:59,800
Quando você estiver pronto para parar esse comentário, você pode fazer ->.

530
00:29:59,800 --> 00:30:02,380
Então, tudo em cima em azul é apenas um comentário.

531
00:30:02,380 --> 00:30:04,620
>> Esta é a minha declaração doctype, que novamente,

532
00:30:04,620 --> 00:30:07,080
você pode apenas copiar e colar na fé, por agora.

533
00:30:07,080 --> 00:30:10,410
Isso só diz ao navegador, 'Aqui vem algum HTML 5. "

534
00:30:10,410 --> 00:30:13,600
Abaixo disso, na linha 14, é a primeira de minhas marcas reais,

535
00:30:13,600 --> 00:30:16,900
e isso só diz, como antes, aqui vem um pouco de HTML,

536
00:30:16,900 --> 00:30:19,460
aqui vem a cabeça de minha página, aqui vem o título,

537
00:30:19,460 --> 00:30:23,900
e, inversamente, que é tudo para o título, que é isso para a cabeça.

538
00:30:23,900 --> 00:30:26,460
Aqui, agora, vem o corpo da minha página.

539
00:30:26,460 --> 00:30:31,040
Então algumas tags novas agora: h1 fica para a categoria 1.

540
00:30:31,040 --> 00:30:33,850
Há uma tradição em HTML para muitos anos atrás

541
00:30:33,850 --> 00:30:37,990
de ter diferentes tamanhos de texto.

542
00:30:37,990 --> 00:30:41,980
E de volta ao dia, cada um significava, geralmente, apenas grande e corajoso.

543
00:30:41,980 --> 00:30:45,860
Mas há também h2, que é grande, mas não tão grande e corajoso.

544
00:30:45,860 --> 00:30:49,320
Há h3, que é uma espécie de grande, mas não tão grande e em negrito,

545
00:30:49,320 --> 00:30:52,380
e assim por diante, todo o caminho até h6.

546
00:30:52,380 --> 00:30:55,550
Esses dias, porém, H1, H2 e H3 são realmente significava

547
00:30:55,550 --> 00:30:57,980
de ter significado mais semântica a eles,

548
00:30:57,980 --> 00:31:01,100
em que h1 é realmente um título: o título de uma página web,

549
00:31:01,100 --> 00:31:04,210
o título de uma coluna ou algo assim do texto.

550
00:31:04,210 --> 00:31:09,030
Então eu disse deliberadamente h1 CS50 busca> h1

551
00:31:09,030 --> 00:31:12,640
para especificar que este é realmente o título, o título da minha página.

552
00:31:12,640 --> 00:31:14,850
Não o título, no sentido barra de título,

553
00:31:14,850 --> 00:31:18,960
mas o título que você realmente ver na página web em si, no corpo.

554
00:31:18,960 --> 00:31:20,990
Agora isso, você provavelmente pode adivinhar o que é,

555
00:31:20,990 --> 00:31:23,110
embora tenhamos algumas peças novas de sintaxe.

556
00:31:23,110 --> 00:31:25,930
Este é um formulário. Assim, a web realmente fica interessante

557
00:31:25,930 --> 00:31:28,770
quando sites tomar entrada de usuários.

558
00:31:28,770 --> 00:31:31,700
Nesta classe, no conjunto de problemas em programação web,

559
00:31:31,700 --> 00:31:33,880
não vamos fazer um site, por si só,

560
00:31:33,880 --> 00:31:37,570
com conteúdo estático que mostra fotos que você tirou,

561
00:31:37,570 --> 00:31:40,010
ou este é o meu currículo, e coisas sobre mim,

562
00:31:40,010 --> 00:31:42,450
porque essas coisas são relativamente fáceis de montar.

563
00:31:42,450 --> 00:31:44,400
É difícil fazer coisas bonitas na Web,

564
00:31:44,400 --> 00:31:46,390
mas pelo menos a colocação de conteúdo é bastante trivial.

565
00:31:46,390 --> 00:31:49,380
Mas as coisas ficam realmente interessantes quando alguém pode visitar o seu website

566
00:31:49,380 --> 00:31:52,260
e fornecer dados e pode preencher formulários,

567
00:31:52,260 --> 00:31:55,800
pode marcar caixas de seleção e pode interagir com o seu site.

568
00:31:55,800 --> 00:31:57,780
E, de fato, provavelmente cada site que você gosta

569
00:31:57,780 --> 00:32:00,710
estes dias, em qualquer detalhe, é de alguma forma interativa.

570
00:32:00,710 --> 00:32:03,110
Facebook, Google e afins, que levam a entrada do usuário

571
00:32:03,110 --> 00:32:05,100
e produzir uma saída personalizada.

572
00:32:05,100 --> 00:32:07,780
>> Então, vamos começar a fazer isso agora. Vamos agora transição

573
00:32:07,780 --> 00:32:11,150
a partir de apenas usando HTML para marcação de conteúdo estático

574
00:32:11,150 --> 00:32:14,790
como, em vez de um mecanismo de entrega de conteúdo dinâmico.

575
00:32:14,790 --> 00:32:17,350
E para esse fim, vamos implementar o nosso próprio motor de busca.

576
00:32:17,350 --> 00:32:20,820
Vamos fazer o seguinte. Aqui está a marca de formulário.

577
00:32:20,820 --> 00:32:24,090
O atributo action especifica que quando o usuário preenche o formulário

578
00:32:24,090 --> 00:32:28,400
com seu teclado, ele será submetido a este URL aqui.

579
00:32:28,400 --> 00:32:31,230
Então, eu sou o tipo de trapaça. Vai levar um pouco mais de tempo

580
00:32:31,230 --> 00:32:33,780
de uma classe para implementar o mecanismo de pesquisa todo,

581
00:32:33,780 --> 00:32:35,880
então vamos fazer o front-end, por assim dizer.

582
00:32:35,880 --> 00:32:38,650
Nós vamos fazer a parte que permite a pesquisa do usuário, e nós vamos resolver de punt para o Google

583
00:32:38,650 --> 00:32:40,950
a parte mais difícil de encontrar resultados da pesquisa,

584
00:32:40,950 --> 00:32:43,520
mas, especificamente, eu vou falar para o servidor web do Google

585
00:32:43,520 --> 00:32:46,710
utilizando um dos dois métodos muito populares.

586
00:32:46,710 --> 00:32:50,000
Um ser obter, de outro, que vai finalmente ver, sendo post,

587
00:32:50,000 --> 00:32:52,660
embora haja outros que são menos utilizados.

588
00:32:52,660 --> 00:32:56,440
Portanto, obter apenas evoca a idéia de, quero obter algum conteúdo, obter alguns resultados de pesquisa.

589
00:32:56,440 --> 00:32:58,440
Isto, talvez você pode adivinhar o que isso faz.

590
00:32:58,440 --> 00:33:01,900
Isso é algum tipo de entrada, é, na verdade, vai parecer um campo de texto,

591
00:33:01,900 --> 00:33:05,200
e o nome da entrada, o nome da variável que, por assim dizer,

592
00:33:05,200 --> 00:33:08,610
vai ser q para consulta por convenção.

593
00:33:08,610 --> 00:33:11,700
E, novamente, o tipo de esta entrada não vai ser uma caixa de seleção;

594
00:33:11,700 --> 00:33:13,890
não vai ser um menu, que vai ser um campo de texto

595
00:33:13,890 --> 00:33:18,060
como indicado por este atributo aqui, e esta caixa de texto,

596
00:33:18,060 --> 00:33:20,680
como uma quebra de linha, pode existir ou não.

597
00:33:20,680 --> 00:33:24,480
Portanto, temos um elemento vazio com a barra dentro essa marca.

598
00:33:24,480 --> 00:33:28,050
Então eu vou colocar uma quebra de linha, e você pode, talvez, acho que isso vai fazer.

599
00:33:28,050 --> 00:33:30,210
Este é um outro tipo de entrada de formulário.

600
00:33:30,210 --> 00:33:32,350
>> Este vai ser usado para enviar o formulário.

601
00:33:32,350 --> 00:33:36,140
Portanto, este vai ser o grande botão que o usuário pode clicar para enviar o formulário,

602
00:33:36,140 --> 00:33:40,800
ea etiqueta no botão que vai ser 'CS50 Pesquisa.

603
00:33:40,800 --> 00:33:44,170
Forma estreita, o corpo de perto, perto HTML.

604
00:33:44,170 --> 00:33:46,280
Vamos ver o que temos na forma desta página web.

605
00:33:46,280 --> 00:33:48,260
Então deixe-me ir para o meu navegador,

606
00:33:48,260 --> 00:33:50,360
deixe-me ir, ainda, aos locais de acolhimento.

607
00:33:50,360 --> 00:33:54,650
Este ainda é index.html, então se eu quiser ver este arquivo chamado search0,

608
00:33:54,650 --> 00:33:59,710
Eu posso simplesmente fazer / search0.html, digite -

609
00:33:59,710 --> 00:34:01,880
eo primeiro dos meus erros.

610
00:34:01,880 --> 00:34:04,400
O que está acontecendo? Eu claramente não tem permissão

611
00:34:04,400 --> 00:34:06,430
para acessar esse arquivo, por algum motivo.

612
00:34:06,430 --> 00:34:10,170
Mas isso é porque, ao contrário do trabalho que fizemos até agora, em C,

613
00:34:10,170 --> 00:34:14,340
onde os programas que você escreve são consideradas runable por você,

614
00:34:14,340 --> 00:34:17,590
executável por você, isso não é realmente o caso na Web,

615
00:34:17,590 --> 00:34:21,010
em que às vezes você pode querer criar arquivos em um servidor,

616
00:34:21,010 --> 00:34:23,310
mas você não quer que o mundo inteiro para poder vê-los.

617
00:34:23,310 --> 00:34:25,469
Em vez disso, você quer que o mundo veja alguns arquivos

618
00:34:25,469 --> 00:34:27,730
mas não em outros, apenas para fins de privacidade,.

619
00:34:27,730 --> 00:34:30,730
Portanto, é mais de uma base opt-in quando você está fazendo as coisas na web.

620
00:34:30,730 --> 00:34:32,810
E então deixe-me realmente digitar ls aqui,

621
00:34:32,810 --> 00:34:37,440
e você verá os arquivos que eu tenho, mas lembro que se eu fizer ls-l por muito tempo,

622
00:34:37,440 --> 00:34:41,520
Vou pegar um longo anúncio que me dá mais alguns detalhes sobre esses arquivos

623
00:34:41,520 --> 00:34:45,139
que agora são, realmente, pela primeira vez relevante para nós.

624
00:34:45,139 --> 00:34:47,840
Observe que, na extrema direita são os nomes dos meus arquivos,

625
00:34:47,840 --> 00:34:50,690
e, em seguida, o tempo em que eles foram última modificação ou copiado.

626
00:34:50,690 --> 00:34:54,370
Esse número aqui é o que? Você se lembra?

627
00:34:54,370 --> 00:34:56,400
O tamanho em bytes, o tamanho do arquivo é.

628
00:34:56,400 --> 00:34:59,520
>> Então, me parece ter algum tipo de logotipo aqui que é maior do que todos os outros arquivos.

629
00:34:59,520 --> 00:35:03,610
Este é quem eu sou, isso é o que eu sou eo que eu estou dentro do grupo

630
00:35:03,610 --> 00:35:07,430
Mas, então, por aqui à esquerda é um pouco de seqüência enigmática,

631
00:35:07,430 --> 00:35:10,040
e nós conversamos, eu acho, um pouco sobre isso no passado,

632
00:35:10,040 --> 00:35:12,050
mas isso tem a ver com as permissões.

633
00:35:12,050 --> 00:35:14,020
E mesmo que seja um pouco nebulosa,

634
00:35:14,020 --> 00:35:17,270
RW provavelmente significa ler e escrever.

635
00:35:17,270 --> 00:35:22,560
Assim, verifica-se que estes traços denotam conjuntos de permissões diferentes para pessoas diferentes.

636
00:35:22,560 --> 00:35:24,730
E o padrão é, essencialmente, como se segue.

637
00:35:24,730 --> 00:35:27,650
Quando você vê uma seqüência de traços aqui, olham como se segue.

638
00:35:27,650 --> 00:35:30,450
Há um traço, então há mais três traços,

639
00:35:30,450 --> 00:35:33,390
depois há outros três, então não há mais três.

640
00:35:33,390 --> 00:35:36,800
A primeira é qualquer um traço ou de anúncio para diretório.

641
00:35:36,800 --> 00:35:40,220
De modo que um é muito fácil. Se for uma pasta, ele diz d, caso contrário é um hífen.

642
00:35:40,220 --> 00:35:44,080
Há um par de outros casos, mas por agora vamos só se preocupam com arquivos e diretórios.

643
00:35:44,080 --> 00:35:48,090
Estes próximos três traços - e eu já introduzidos artificialmente os espaços.

644
00:35:48,090 --> 00:35:50,490
Eles eram, obviamente, não existe quando os vimos há pouco.

645
00:35:50,490 --> 00:35:52,900
Estas são as permissões do dono do arquivo,

646
00:35:52,900 --> 00:35:55,840
e lembrar de um segundo atrás que foi ler e escrever.

647
00:35:55,840 --> 00:35:58,560
Isso era porque eu, como a pessoa que criou este arquivo de um momento atrás,

648
00:35:58,560 --> 00:36:01,250
Eu, apenas, por padrão, em um computador Linux,

649
00:36:01,250 --> 00:36:03,910
tem a capacidade de continuar a ler e escrever o arquivo.

650
00:36:03,910 --> 00:36:07,170
>> Assim, o sistema operacional só me dá RW automaticamente.

651
00:36:07,170 --> 00:36:10,840
Os do meio se relacionam com o meu grupo, que de estudantes,

652
00:36:10,840 --> 00:36:14,590
que é uma espécie de sentido no aparelho, porque eu sou a única pessoa a usar o aparelho.

653
00:36:14,590 --> 00:36:16,620
Então deixe-me acenar as mãos em que, por agora.

654
00:36:16,620 --> 00:36:19,190
Mas os últimos são os mais importantes para a web.

655
00:36:19,190 --> 00:36:21,580
Este é todo o resto do mundo, e do fato de

656
00:36:21,580 --> 00:36:24,600
que que é --- significa que ninguém mais no mundo

657
00:36:24,600 --> 00:36:26,680
tem todas as permissões para este arquivo.

658
00:36:26,680 --> 00:36:29,180
Claramente é um problema, então eu preciso corrigir isso

659
00:36:29,180 --> 00:36:33,830
por alguma forma dar ao mundo o que? Ler e escrever?

660
00:36:33,830 --> 00:36:35,850
Isso provavelmente é mudo, certo? Eu não quero que ninguém na Web

661
00:36:35,850 --> 00:36:38,530
para ir visitar a minha página e de alguma forma mudar esse arquivo,

662
00:36:38,530 --> 00:36:40,800
embora eles realmente não podia com um arquivo HTML,

663
00:36:40,800 --> 00:36:44,110
mas apenas no princípio, provavelmente só quer que eles sejam capazes de lê-lo.

664
00:36:44,110 --> 00:36:47,910
O que significa para lê-lo? Isso não significa que eles vão se preocupar com o código HTML real,

665
00:36:47,910 --> 00:36:51,820
mas o navegador precisa ser capaz de analisar de que a linguagem de marcação,

666
00:36:51,820 --> 00:36:53,720
de cima para baixo, da esquerda para a direita.

667
00:36:53,720 --> 00:36:57,990
Então, alguém na Web precisa ser capaz de lê-lo, então eu minimamente precisa dar r.

668
00:36:57,990 --> 00:37:00,240
Eu posso fazer isso de algumas maneiras diferentes, mas talvez

669
00:37:00,240 --> 00:37:03,080
o mais simples é executar este comando aqui.

670
00:37:03,080 --> 00:37:10,860
Chmod, modo de alteração, em seguida, um r + tudo para que todos, no mundo + ler,

671
00:37:10,860 --> 00:37:13,830
e em seguida o nome do arquivo, search0.html.

672
00:37:13,830 --> 00:37:18,310
>> Ora, se faço ls-l novamente, observe que o arquivo mudou,

673
00:37:18,310 --> 00:37:21,440
e, de fato, eu me transformei em r para todos.

674
00:37:21,440 --> 00:37:23,350
Eu também liguei para o meu grupo, mas isso é bom,

675
00:37:23,350 --> 00:37:27,150
porque se eu voltada para para todos, meu grupo é um subconjunto do que isso.

676
00:37:27,150 --> 00:37:31,480
Então, tudo bem também. Isto apenas significa que o computador fez agora legível.

677
00:37:31,480 --> 00:37:34,430
Agora deixe-me voltar para o meu navegador, clique em recarregar.

678
00:37:34,430 --> 00:37:36,330
Ah-ha. Temos, agora, CS50 Pesquisa.

679
00:37:36,330 --> 00:37:39,830
Eu ampliada um pouco artificial - motor de pesquisa muito horrível.

680
00:37:39,830 --> 00:37:41,930
Mas vamos ver se ele realmente funciona.

681
00:37:41,930 --> 00:37:45,880
Primeiro, deixe-me fazer um teste de sanidade rápido, deixe-me controlar clicar e ver fonte da página.

682
00:37:45,880 --> 00:37:50,780
Observe que dentro Chrome agora estamos vendo o mesmo HTML que eu mesmo criou.

683
00:37:50,780 --> 00:37:55,420
Não se confunda aqui, no entanto. Eu não posso começar a mudar o código aqui,

684
00:37:55,420 --> 00:37:59,420
porque o navegador tem uma vista só de leitura deste código.

685
00:37:59,420 --> 00:38:06,060
O navegador acaba de pedir host local para um arquivo chamado search0.html.

686
00:38:06,060 --> 00:38:09,490
É agora pura coincidência que o aparelho

687
00:38:09,490 --> 00:38:13,480
passa a ser no mesmo computador como meu navegador.

688
00:38:13,480 --> 00:38:20,470
Eu poderia apenas ter, de forma equivalente, ter digitado www.facebook.com/search0.html,

689
00:38:20,470 --> 00:38:23,830
e se o Facebook teve um arquivo chamado isso, eu seria, então, ver o seu HTML.

690
00:38:23,830 --> 00:38:27,360
E, claro, eu não posso mudar o arquivo que volta do Facebook, também.

691
00:38:27,360 --> 00:38:29,360
Portanto, agora estamos espécie de borrar as linhas.

692
00:38:29,360 --> 00:38:32,130
O aparelho é tanto um servidor, servir as páginas,

693
00:38:32,130 --> 00:38:34,870
mas é também um cliente, no sentido de que eu estou usando um navegador

694
00:38:34,870 --> 00:38:37,630
para realmente falar a esse servidor.

695
00:38:37,630 --> 00:38:39,610
Então, vamos ver se o meu motor de busca Google funciona.

696
00:38:39,610 --> 00:38:44,930
Deixe-me ir em frente e procurar ligeira raposa marrom, entrar.

697
00:38:44,930 --> 00:38:47,540
E pronto, agora tenho meu próprio motor de busca.

698
00:38:47,540 --> 00:38:51,460
>> Mas como isso funciona?

699
00:38:51,460 --> 00:38:55,380
Bocado de um estiramento, mas - e agora você não pode ver, precisamente, a parte que é de interesse.

700
00:38:55,380 --> 00:38:57,370
Observe o que acontece.

701
00:38:57,370 --> 00:39:00,430
Observe a URL. Acontece que o método que,

702
00:39:00,430 --> 00:39:02,780
chamada começa, é super-simples.

703
00:39:02,780 --> 00:39:10,270
Quando você especificar, de forma que você deseja "ficar" resultados de algum servidor,

704
00:39:10,270 --> 00:39:13,200
o que ele vai fazer é tirar o que você digitou no formulário

705
00:39:13,200 --> 00:39:15,290
e colocá-lo na URL.

706
00:39:15,290 --> 00:39:18,580
Vai para padronizar como ele é colocado na URL da seguinte forma.

707
00:39:18,580 --> 00:39:22,290
Note-se que esta é a URL que foi o valor do meu atributo action.

708
00:39:22,290 --> 00:39:24,730
É onde eu queria que a forma de acabar.

709
00:39:24,730 --> 00:39:26,950
Mas, então, perceber esse ponto de interrogação.

710
00:39:26,950 --> 00:39:30,230
Esta é uma convenção na Web através do qual a fornecer a entrada do usuário

711
00:39:30,230 --> 00:39:35,320
para um site, você acrescentar para a URL de um ponto de interrogação,

712
00:39:35,320 --> 00:39:38,330
e então você tem um monte de pares chave-valor.

713
00:39:38,330 --> 00:39:42,380
O nome de uma chave, de outro modo conhecido como um parâmetro na Web,

714
00:39:42,380 --> 00:39:46,380
então você tem um sinal de igual, então você tem o valor do parâmetro.

715
00:39:46,380 --> 00:39:49,810
Então, é, essencialmente, um nome de variável e um valor variável,

716
00:39:49,810 --> 00:39:54,250
mas os nomes de variáveis ​​e valores vieram do formulário HTML.

717
00:39:54,250 --> 00:39:56,250
Por que as vantagens lá, que você acha?

718
00:39:56,250 --> 00:39:59,340
Porque eu não digitar + entre as minhas palavras.

719
00:39:59,340 --> 00:40:01,430
[Estudante, ininteligível]

720
00:40:01,430 --> 00:40:05,080
>> Sim, é apenas para espaçamento. As probabilidades são, sempre que você já viu um URL,

721
00:40:05,080 --> 00:40:07,320
nunca há quaisquer espaços, mesmo porque

722
00:40:07,320 --> 00:40:09,440
se houvesse, você realmente não poderia copiar e colar

723
00:40:09,440 --> 00:40:12,700
em uma mensagem instantânea ou um e-mail em, porque iria quebrar.

724
00:40:12,700 --> 00:40:15,420
Você quer que a coisa toda seja uma seqüência contígua de caracteres.

725
00:40:15,450 --> 00:40:18,450
>> Assim, o navegador é inteligente o suficiente para perceber, uh-uh.

726
00:40:18,450 --> 00:40:22,610
Não basta colocar um espaço lá. Deixa-me codificam o espaço, de algum modo normal.

727
00:40:22,610 --> 00:40:25,170
Uma das convenções para fazer isso é para que o navegador

728
00:40:25,170 --> 00:40:29,350
automaticamente colocada a + onde você se não tiver um espaço.

729
00:40:29,350 --> 00:40:32,140
Então, agora, aviso Google tem sido o tipo de user-friendly.

730
00:40:32,140 --> 00:40:34,380
Eu certamente não criar esta página web,

731
00:40:34,380 --> 00:40:37,200
mas eles têm preenchido previamente seu campo próprio texto

732
00:40:37,200 --> 00:40:39,490
com o que, exatamente, eu digitado dentro

733
00:40:39,490 --> 00:40:43,090
Suponha que eu queira procurar outra coisa, como um cão preguiçoso.

734
00:40:43,090 --> 00:40:45,340
Eu posso apenas escrever isso aqui, re-search.

735
00:40:45,340 --> 00:40:47,730
Observe que a URL muda-se aqui,

736
00:40:47,730 --> 00:40:51,390
mas observar, então, que eu possa realmente buscar o que eu quiser

737
00:40:51,390 --> 00:40:53,610
apenas por entender como URLs funcionam.

738
00:40:53,610 --> 00:40:56,840
Eu poderia fazer gato preguiçoso, entrar,

739
00:40:56,840 --> 00:41:01,370
e observe agora estou tendo muito preguiçoso - devemos? Eu sinto como se deveria.

740
00:41:01,370 --> 00:41:09,900
Recebo um gato muito preguiçoso.

741
00:41:09,900 --> 00:41:11,930
Tudo bem. Esta é uma das coisas mais estúpidas que já fizemos.

742
00:41:11,930 --> 00:41:17,160
Mas isso é um gato preguiçoso.

743
00:41:17,160 --> 00:41:19,730
De qualquer forma, o que é o takeaway chave aqui?

744
00:41:19,730 --> 00:41:22,830
Agora estamos a sorte de jogar no mundo do HTTP.

745
00:41:22,830 --> 00:41:26,050
HTML é apenas essa linguagem de marcação, tag aberta, marca de perto,

746
00:41:26,050 --> 00:41:29,490
que diz um navegador como processar o conteúdo em uma página web.

747
00:41:29,490 --> 00:41:32,850
Mas quando você começa a transmissão de dados através da Internet

748
00:41:32,850 --> 00:41:36,290
entre browser e servidor, que é onde este protocolo

749
00:41:36,290 --> 00:41:39,370
conhecido como HyperText Transfer Protocol assume.

750
00:41:39,370 --> 00:41:42,630
Este é o tipo de convenção humana, quando Sam e eu balancei as mãos na segunda-feira,

751
00:41:42,630 --> 00:41:48,300
iniciar uma conexão e, em seguida, fechar uma conexão idéia, mesmo aqui.

752
00:41:48,300 --> 00:41:53,100
Como são os resultados do Google vai voltar para mim?

753
00:41:53,100 --> 00:41:55,290
Como a minha submissão do formulário indo para o Google?

754
00:41:55,290 --> 00:41:58,160
Bem, lembro do outro dia que o que está realmente acontecendo

755
00:41:58,160 --> 00:42:02,150
debaixo do capô quando você solicita uma página web é,

756
00:42:02,150 --> 00:42:04,860
o seu navegador está enviando uma mensagem um tanto enigmática, como

757
00:42:04,860 --> 00:42:09,510
GET / HTTP/1.1 para a página inicial padrão.

758
00:42:09,510 --> 00:42:13,000
>> Ou, neste caso, porque I especificamente solicitado anteriormente

759
00:42:13,000 --> 00:42:17,340
search0.html, este seria, então, a mensagem um tanto enigmática-

760
00:42:17,340 --> 00:42:20,040
que o meu navegador envia para o aparelho.

761
00:42:20,040 --> 00:42:23,090
Ou, neste caso do Google, o que está realmente enviado

762
00:42:23,090 --> 00:42:33,740
é um pedido para / de pesquisa, e então? q cat = preguiçoso, com um plus lá.

763
00:42:33,740 --> 00:42:36,790
Portanto, esta mensagem, que eu, o ser humano, nunca estou digitando,

764
00:42:36,790 --> 00:42:40,620
mas está sendo enviado pelo meu navegador, isto é como HTTP acontece.

765
00:42:40,620 --> 00:42:43,240
Este é o equivalente de nossas mãos tendo abalados.

766
00:42:43,240 --> 00:42:46,320
Este é o pedido, eo servidor está prestes a enviar uma resposta.

767
00:42:46,320 --> 00:42:48,560
Então, vamos dar uma olhada neste debaixo do capô.

768
00:42:48,560 --> 00:42:55,320
Como antes, podemos abrir esse campo especial em um navegador.

769
00:42:55,320 --> 00:42:58,720
Ver página, inspecionar elementos.

770
00:42:58,720 --> 00:43:01,550
Assim, sob inspecionar elemento, perceber que o que aconteceu no Chrome,

771
00:43:01,550 --> 00:43:04,160
e IE e Firefox têm mecanismos semelhantes,

772
00:43:04,160 --> 00:43:07,370
temos essas ferramentas acessíveis a desenvolvedores para nós.

773
00:43:07,370 --> 00:43:09,630
Pessoas normais não usar essas guias.

774
00:43:09,630 --> 00:43:11,940
Mas, agora, estão interessados ​​no que está acontecendo

775
00:43:11,940 --> 00:43:13,890
debaixo do capô no nível de rede.

776
00:43:13,890 --> 00:43:16,130
Então, se eu puxar para cima o nível de rede aqui,

777
00:43:16,130 --> 00:43:18,510
deixe-me ir em frente e expandir esta janela,

778
00:43:18,510 --> 00:43:21,840
abrir esta entrada aqui, e olhar para os cabeçalhos.

779
00:43:21,840 --> 00:43:26,010
Então, o que acontece quando eu pedir um arquivo de um servidor web

780
00:43:26,010 --> 00:43:29,410
é o meu navegador envia um monte de coisas.

781
00:43:29,410 --> 00:43:32,390
E deixe-me ver fonte. Assim, sob cabeçalhos de solicitação,

782
00:43:32,390 --> 00:43:35,250
E este é apenas Chrome me mostrando alguma saída de diagnóstico,

783
00:43:35,250 --> 00:43:37,340
como uma espécie de depurador de alguma sorte,

784
00:43:37,340 --> 00:43:40,500
perceber que o que eu destaque aqui é precisamente o que

785
00:43:40,500 --> 00:43:47,060
Chrome é o envio para o servidor, a fim de solicitar um arquivo chamado search0.html.

786
00:43:47,060 --> 00:43:50,160
É dizer ao servidor que ele pensa que seu nome é,

787
00:43:50,160 --> 00:43:52,210
graças a este campo de cólon anfitrião, então há alguns

788
00:43:52,210 --> 00:43:56,950
coisas muito esotérico aqui, como algo a ver com as datas e horários,

789
00:43:56,950 --> 00:43:59,720
algo a ver com as línguas que o navegador reconheça,

790
00:43:59,720 --> 00:44:02,850
mas as linhas realmente importantes são estes dois primeiros aqui.

791
00:44:02,850 --> 00:44:05,490
>> O que o servidor responda com? Bem, se rolar aqui

792
00:44:05,490 --> 00:44:08,510
e ver o código fonte dessa coisa, observe que o servidor

793
00:44:08,510 --> 00:44:13,700
respondeu com uma mensagem um tanto enigmática, bem como, não 304 modificado.

794
00:44:13,700 --> 00:44:16,030
Isso é um pouco estranho, deixe-me realmente tentar corrigir isso.

795
00:44:16,030 --> 00:44:18,670
Deixe-me segure Shift e clique recarregar-se aqui

796
00:44:18,670 --> 00:44:22,460
para forçar o navegador para realmente fazer este pedido pela primeira vez.

797
00:44:22,460 --> 00:44:25,700
Então deixe-me aumentar o zoom, e vamos ver agora que a resposta do servidor,

798
00:44:25,700 --> 00:44:28,950
porque eu segurei turno, é de 200 OK.

799
00:44:28,950 --> 00:44:31,170
Então você provavelmente nunca viu o número 200

800
00:44:31,170 --> 00:44:33,300
em números o contexto da Web, mas o que

801
00:44:33,300 --> 00:44:36,760
você já visto às vezes inesperadamente de um servidor?

802
00:44:36,760 --> 00:44:42,010
Arquivo de 404, não foi encontrado; 403, proibido; 500, erro do servidor.

803
00:44:42,010 --> 00:44:44,890
Então, existem esses códigos numéricos que o mundo usa na Web

804
00:44:44,890 --> 00:44:47,870
para significar erros, assim como funções C

805
00:44:47,870 --> 00:44:51,030
pode retornar erros e principal pode retornar códigos de saída.

806
00:44:51,030 --> 00:44:54,160
200, porém, que raramente se vê, porque isso significa que está tudo bem.

807
00:44:54,160 --> 00:44:59,000
E 304 que você provavelmente nunca verá porque o que é que significa?

808
00:44:59,000 --> 00:45:03,330
Que nada tem - vamos ver se podemos simular este novo -

809
00:45:03,330 --> 00:45:07,170
Ah, agora não é cooperar. 304 disse não modificada,

810
00:45:07,170 --> 00:45:09,170
Então, por que o servidor mesmo responder?

811
00:45:09,170 --> 00:45:12,550
Bem, para a eficiência, um servidor web automaticamente para você,

812
00:45:12,550 --> 00:45:16,570
se o arquivo não mudou, não vai retransmitir o arquivo inteiro HTML.

813
00:45:16,570 --> 00:45:19,150
Só vai dizer ao navegador que não mudou.

814
00:45:19,150 --> 00:45:21,220
Basta usar a cópia que você já tem.

815
00:45:21,220 --> 00:45:22,650
Então há essa noção de cache na Web

816
00:45:22,650 --> 00:45:25,840
para o desempenho, de modo que você não perca tempo e largura de banda resíduos

817
00:45:25,840 --> 00:45:29,160
download de arquivos de novo e de novo desnecessariamente.

818
00:45:29,160 --> 00:45:31,460
>> Mas esta página web, agora, era super-simples,

819
00:45:31,460 --> 00:45:34,980
e ele só me mostrou o HTML que voltou.

820
00:45:34,980 --> 00:45:40,940
Vamos realmente usar a guia de rede agora a fazer uma pesquisa no Google como ligeira raposa marrom.

821
00:45:40,940 --> 00:45:43,010
Deixe-me em seguida, clique CS50 pesquisa,

822
00:45:43,010 --> 00:45:46,950
e agora, aviso no fundo aqui um monte de coisas voltaram

823
00:45:46,950 --> 00:45:49,900
porque quando eu visitar um site real, como Google.com,

824
00:45:49,900 --> 00:45:53,520
eles têm imagens, elas têm de texto, eles têm uma linguagem chamada JavaScript ali.

825
00:45:53,520 --> 00:45:55,940
Assim, cada linha nesta tabela aqui

826
00:45:55,940 --> 00:46:01,490
representa algo que o Google cuspir em resposta ao meu pedido único.

827
00:46:01,490 --> 00:46:04,160
O que me importa, porém, é este primeiro.

828
00:46:04,160 --> 00:46:08,420
E se eu for para a busca, o pedido, clique em ver fonte aqui,

829
00:46:08,420 --> 00:46:11,300
perceber que, de fato, a mensagem críptica que o meu navegador enviou

830
00:46:11,300 --> 00:46:15,010
a Google foi essas duas linhas aqui,

831
00:46:15,010 --> 00:46:18,420
seguido de algumas informações arcano aqui que vamos ignorar por agora.

832
00:46:18,420 --> 00:46:20,890
Mas note, também, que o Chrome é muito acessível com,

833
00:46:20,890 --> 00:46:24,540
ele também me mostrando a cadeia de consulta que foi enviado dentro

834
00:46:24,540 --> 00:46:27,410
Então ao invés de me mostrar isso, que foi literalmente enviado,

835
00:46:27,410 --> 00:46:30,800
se eu vê-lo decodificado, Chrome, apenas para fins de depuração,

836
00:46:30,800 --> 00:46:34,270
para os desenvolvedores como nós, é só me mostrar uma versão humana-friendly de -

837
00:46:34,270 --> 00:46:36,390
não é assim que se escreve raposa, aparentemente.

838
00:46:36,390 --> 00:46:40,520
Eu só estou percebendo isso agora - mas ele está mostrando o que eu, aparentemente, digitado.

839
00:46:40,520 --> 00:46:45,340
Enquanto isso, a resposta que voltou do servidor é novamente 200 OK.

840
00:46:45,340 --> 00:46:47,930
Mas em que a resposta inclui, naturalmente,

841
00:46:47,930 --> 00:46:51,920
se realmente ver HTML da página -

842
00:46:51,920 --> 00:46:55,440
Desculpe, este é um atalho de teclado pouco que deu errado hoje.

843
00:46:55,440 --> 00:46:59,020
>> Eu vou lidar com isso mais tarde. Então, se nós realmente ver código fonte da página,

844
00:46:59,020 --> 00:47:02,990
o que eu posso fazer aqui, clicando resposta,

845
00:47:02,990 --> 00:47:10,080
este é o que foi realmente cuspir para trás, para além de que a mensagem 200 OK críptica do servidor.

846
00:47:10,080 --> 00:47:12,520
Um pouco enigmático, mas onde está tudo isso vem?

847
00:47:12,520 --> 00:47:15,570
Bem, vamos fazer uma outra coisa aqui. Outro comando-pouco enigmático,

848
00:47:15,570 --> 00:47:20,530
mas este tipo de um puro na medida em que nos revela exatamente o que está acontecendo debaixo do capô.

849
00:47:20,530 --> 00:47:22,530
Então, estou de volta ao meu Mac aqui, eu ter ligado

850
00:47:22,530 --> 00:47:25,980
através de um programa chamado SSH, Secure Shell, para outro servidor

851
00:47:25,980 --> 00:47:28,940
porque a maioria dos computadores de Harvard bloquear o comando que está prestes a executar

852
00:47:28,940 --> 00:47:31,640
porque não há esse comando em alguns servidores de chamada traceroute

853
00:47:31,640 --> 00:47:34,810
que permite traçar a rota entre os pontos a e b,

854
00:47:34,810 --> 00:47:37,020
e, até agora, temos tomado completamente para concedido

855
00:47:37,020 --> 00:47:40,170
que eu possa digitar no Google.com e de alguma forma obter dados de volta

856
00:47:40,170 --> 00:47:43,530
do outro lado do país ou do outro lado do mundo.

857
00:47:43,530 --> 00:47:45,810
Com traceroute podemos realmente mergulhar um pouco mais fundo

858
00:47:45,810 --> 00:47:49,370
sobre a forma como a Internet funciona, e ver o que está acontecendo debaixo do capô.

859
00:47:49,370 --> 00:47:54,440
Então, vamos em frente e arbitrariamente traçar uma rota para, digamos, Stanford.edu,

860
00:47:54,440 --> 00:47:57,150
que é em todo o país, e tecle enter.

861
00:47:57,150 --> 00:47:59,380
Esse comando pode ser super-rápida ou super-lento,

862
00:47:59,380 --> 00:48:02,010
mas o que estamos vendo agora, linha por linha,

863
00:48:02,010 --> 00:48:08,060
é cada um dos passos ou saltos entre nós e Palo Alto, ou Stanford,

864
00:48:08,060 --> 00:48:11,010
onde têm o seu servidor web.

865
00:48:11,010 --> 00:48:16,600
Então, o que cada uma dessas linhas representam mais concretamente, embora?

866
00:48:16,600 --> 00:48:19,100
Um pedaço de jargão da Internet? [Estudante, ininteligível]

867
00:48:19,100 --> 00:48:21,570
>> O que é isso? [Estudante, ininteligível]

868
00:48:21,570 --> 00:48:25,390
>> Oh, por isso há tempos, mas o que cada linha - o que eu quero dizer com hop?

869
00:48:25,390 --> 00:48:29,140
>> Bem, existem estas coisas na Internet chamados roteadores.

870
00:48:29,140 --> 00:48:33,020
E roteadores, como o nome sugere, as informações de rota a partir do ponto A ao ponto b.

871
00:48:33,020 --> 00:48:36,920
Mas existem vários pontos para além ae b.

872
00:48:36,920 --> 00:48:40,010
Há c e d e E e F entre a linha 1,

873
00:48:40,010 --> 00:48:43,480
que acontece de ser o endereço IP do meu computador,

874
00:48:43,480 --> 00:48:46,890
ou o meu endereço numérico, que identifica o computador,

875
00:48:46,890 --> 00:48:50,300
e passo 15, que na verdade é o servidor web sexta,

876
00:48:50,300 --> 00:48:54,640
aparentemente, que eu estou inferindo a partir deste, ou a versão 6 do seu servidor web em Stanford.

877
00:48:54,640 --> 00:48:56,680
Mas o que é tipo de puro é, podemos ver o caminho

878
00:48:56,680 --> 00:49:00,480
que o meu 0 e 1 estão a tomar do meu computador para Stanford.

879
00:49:00,480 --> 00:49:02,500
Então, passo 1 é o endereço do meu próprio computador.

880
00:49:02,500 --> 00:49:05,760
Cada computador na internet tem um identificador único que se parece com isso.

881
00:49:05,760 --> 00:49:08,150
Number.number.number.number.

882
00:49:08,150 --> 00:49:10,370
Em algum lugar neste campus, provavelmente no centro de ciência,

883
00:49:10,370 --> 00:49:16,780
é um roteador chamado Core Gateway 2-te83, o que significa que,

884
00:49:16,780 --> 00:49:20,590
por isso este é um dos grandes de Harvard roteadores fantasia de que as rotas muito do seu tráfego.

885
00:49:20,590 --> 00:49:24,640
Aqui está outra de roteadores de Harvard, este é um Border Gateway,

886
00:49:24,640 --> 00:49:28,310
significado fronteira é provavelmente na periferia do campus em algum lugar.

887
00:49:28,480 --> 00:49:32,790
Então há uma nox, linha 4, que é Crossroads do Norte,

888
00:49:32,790 --> 00:49:35,070
que é um ISP grande fornecedor de serviços Internet,

889
00:49:35,070 --> 00:49:37,740
que lugares como Harvard conectar até.

890
00:49:37,740 --> 00:49:40,760
Mas depois as coisas ficam um pouco interessante na linha 6.

891
00:49:40,760 --> 00:49:45,960
Onde estão os meus pedaços de repente? Kansas.

892
00:49:45,960 --> 00:49:49,300
O mundo tem o hábito de usar códigos de aeroportos em muitas dessas coisas,

893
00:49:49,300 --> 00:49:52,900
ou pelo menos abreviações para estados ou cidades,

894
00:49:52,900 --> 00:49:56,490
então parece que, em apenas 60 ms,

895
00:49:56,490 --> 00:49:59,420
um pacote de informações, 0 e 1 é do meu laptop

896
00:49:59,420 --> 00:50:03,210
tem todo o caminho para o Kansas, e de novo, em 60 ms.

897
00:50:03,210 --> 00:50:08,180
>> Além disso, depois de Kansas, que levou um passeio através de Houston, provavelmente,

898
00:50:08,180 --> 00:50:10,140
tal como sugerido pelo nome deste servidor.

899
00:50:10,140 --> 00:50:13,310
Assim como um servidor na Internet deve ter um endereço numérico,

900
00:50:13,310 --> 00:50:18,360
ele também pode, opcionalmente, ter um endereço um pouco mais humanamente amigável que os seres humanos veio com.

901
00:50:18,360 --> 00:50:20,510
Agora, na etapa 8, não sabemos o que é isso.

902
00:50:20,510 --> 00:50:22,550
Às vezes, os roteadores só tipo de ignorá-lo,

903
00:50:22,550 --> 00:50:25,010
e eles simplesmente não responder às perguntas, de modo que é bom.

904
00:50:25,010 --> 00:50:29,290
A seguir ao passo 8 é aparentemente onde? L.A.

905
00:50:29,290 --> 00:50:35,290
Observe em apenas 78 ms, o que nos leva de seres humanos como 6 + horas para fazer fisicamente,

906
00:50:35,290 --> 00:50:40,110
leva pacotes de informação na Internet 78 ms para viajar tão longe.

907
00:50:40,110 --> 00:50:45,890
Passo 10 é em Los Angeles, bem como, e passo 11 parece ter ido para o norte, até próximo de Stanford.

908
00:50:45,890 --> 00:50:48,750
Este é o seu roteador, limite ou fronteira roteador.

909
00:50:48,750 --> 00:50:51,240
A dois passos da Universidade de Stanford que estão nos ignorando,

910
00:50:51,240 --> 00:50:55,610
e, finalmente, chegamos ao servidor web em apenas 87 ms.

911
00:50:55,610 --> 00:50:57,760
Agora, todos estes números, como um aparte,

912
00:50:57,760 --> 00:51:00,640
apenas dizer-lhe o tempo que leva para os dados para obter de mim

913
00:51:00,640 --> 00:51:03,530
a cada um desses roteadores, e não é acumulativo.

914
00:51:03,530 --> 00:51:06,960
O que este programa faz é, primeiro ele envia uma mensagem, essencialmente, para o primeiro roteador.

915
00:51:06,960 --> 00:51:09,490
Em seguida, um para o segundo roteador, em seguida, um terceiro para o roteador,

916
00:51:09,490 --> 00:51:12,610
medição de cada vez. Portanto, em teoria, estes tempos será crescente

917
00:51:12,610 --> 00:51:14,860
ou pelo menos muito próximos um do outro,

918
00:51:14,860 --> 00:51:18,090
e, de fato, os que estão aqui no campus são super-pequeno.

919
00:51:18,090 --> 00:51:20,820
Assim que você começar a ir por todo o país, leva os dados

920
00:51:20,820 --> 00:51:24,830
um pouco mais de tempo para viajar, mais próximo de 100 ms, mais ou menos.

921
00:51:24,830 --> 00:51:28,330
Mas vamos ir na outra direção agora. Como cerca de Universidade de Cambridge, no Reino Unido?

922
00:51:28,330 --> 00:51:32,540
Deixe-me em vez de executar o traceroute www.cam de Cambridge,

923
00:51:32,540 --> 00:51:36,710
. Ac para acadêmica. Reino Unido, e tecle enter aqui.

924
00:51:36,710 --> 00:51:38,830
Isso foi muito muito rápido.

925
00:51:38,830 --> 00:51:43,300
Meus dados literalmente foi para Cambridge, Inglaterra, em que fração de segundo de tempo.

926
00:51:43,300 --> 00:51:45,340
>> Então vamos ver o caminho que ele tomou.

927
00:51:45,340 --> 00:51:47,520
Harvard, Harvard, Harvard, Crossroads do Norte,

928
00:51:47,520 --> 00:51:52,690
que é um ISP, e então este é Crossroads do Norte, e então bam.

929
00:51:52,690 --> 00:51:58,320
O que está em entre as etapas 6 e 7, 6 e 7 do roteador?

930
00:51:58,320 --> 00:52:02,040
O Oceano Atlântico. E estamos inferindo isso a partir do fato de que

931
00:52:02,040 --> 00:52:06,530
vamos a partir de 20 ms 80 ms aqui para aqui.

932
00:52:06,530 --> 00:52:10,050
Então, alguma coisa levou 60 ms, mais ou menos, para obter mais.

933
00:52:10,050 --> 00:52:12,910
E que foi provavelmente um grande corpo de água.

934
00:52:12,910 --> 00:52:15,250
O que acontece depois? Bem, aqui estamos, em Londres,

935
00:52:15,250 --> 00:52:18,860
apenas 88 ms mais tarde. Mais London, London mais,

936
00:52:18,860 --> 00:52:21,730
não sei onde é, mas vamos supor que é fora de Londres,

937
00:52:21,730 --> 00:52:26,390
Cambridge aqui, e finalmente nós - literalmente, da Universidade de Cambridge

938
00:52:26,390 --> 00:52:29,500
. Something.net, e então, finalmente, na linha 16,

939
00:52:29,500 --> 00:52:31,720
seu servidor web é aparentemente chamado Scorpius

940
00:52:31,720 --> 00:52:35,500
debaixo do capô, apesar de sabermos como www.

941
00:52:35,500 --> 00:52:38,790
Tipo de alucinante, eu acho. A primeira vez que eu fiz isso, estraguei minha mente.

942
00:52:38,790 --> 00:52:41,670
Infelizmente, Harvard bloqueia este tipo de tráfego, tipicamente, na rede.

943
00:52:41,670 --> 00:52:44,340
Então você não pode fazê-lo super fácil.

944
00:52:44,340 --> 00:52:48,500
Perceba, porém, isso aqui é possível.

945
00:52:48,500 --> 00:52:53,630
Tudo bem. Vamos dar o nosso intervalo de 5 minutos aqui. Nós vamos voltar e mergulhar no mais profundo.

946
00:52:53,630 --> 00:53:00,850
Então, estamos de volta, e nós tipo de ambled sobre em alguns sentidos diferentes aqui.

947
00:53:00,850 --> 00:53:03,700
Então vamos resumir exatamente o que está acontecendo aqui.

948
00:53:03,700 --> 00:53:07,990
Começamos a conversa falando sobre esta linguagem chamada HTML.

949
00:53:07,990 --> 00:53:10,680
Novamente, não é uma linguagem de programação. É apenas uma linguagem de marcação

950
00:53:10,680 --> 00:53:15,490
que é em grande parte sobre a estética e estruturação de conteúdos, na forma de uma página web.

951
00:53:15,490 --> 00:53:19,220
Mas HTML, portanto, precisa de algum tipo de mecanismo de

952
00:53:19,220 --> 00:53:22,870
para viajar entre navegador e servidor.

953
00:53:22,870 --> 00:53:28,360
HTML espécie, portanto, de passeios, em cima do outro idioma,

954
00:53:28,360 --> 00:53:31,280
ou, mais propriamente, um protocolo, conhecido como HTTP.

955
00:53:31,280 --> 00:53:33,730
>> E HTTP, como temos visto até agora,

956
00:53:33,730 --> 00:53:37,140
é uma espécie de análoga a esta convenção humana de apertar as mãos.

957
00:53:37,140 --> 00:53:39,940
Quando um navegador deseja solicitar uma página a partir de um servidor,

958
00:53:39,940 --> 00:53:43,450
ele envia que "pegar" pedido do navegador para o servidor,

959
00:53:43,450 --> 00:53:48,040
e, em seguida, o servidor responde com um número como 200, tudo está bem,

960
00:53:48,040 --> 00:53:53,290
bem como o HTML ou algum número ruim como 404, arquivo não encontrado.

961
00:53:53,290 --> 00:53:58,220
Mas por sua vez, HTTP em si não é a Internet, per se.

962
00:53:58,220 --> 00:54:01,550
HTTP é apenas um serviço, uma característica da Internet

963
00:54:01,550 --> 00:54:05,530
bem como G bate-papo é outro serviço, bem como e-mail é outro serviço.

964
00:54:05,530 --> 00:54:09,180
Há todos os tipos de coisas que podemos fazer na Internet.

965
00:54:09,180 --> 00:54:12,670
HTTP é apenas uma dessas aplicações.

966
00:54:12,670 --> 00:54:17,210
Então, em cima de - HTTP está em cima de outra coisa

967
00:54:17,210 --> 00:54:21,750
que nós não mencionar pelo nome, você já deve ter ouvido pelo nome, o TCP / IP.

968
00:54:21,750 --> 00:54:25,160
Assim, a história que acabamos disse há tudo sobre

969
00:54:25,160 --> 00:54:28,720
como os dados trafegam de um ponto ao ponto b.

970
00:54:28,720 --> 00:54:30,950
E, neste caso, vimos em um nível muito baixo

971
00:54:30,950 --> 00:54:33,060
roteador para roteador para roteador para roteador,

972
00:54:33,060 --> 00:54:35,390
como os dados são realmente a ser transmitida.

973
00:54:35,390 --> 00:54:40,510
Mas ao longo do caminho, ele vai encontrar vários impedimentos.

974
00:54:40,510 --> 00:54:43,770
Além desses roteadores, existem coisas chamadas firewalls na Internet,

975
00:54:43,770 --> 00:54:46,680
e para que os dados, como a que estávamos transmitindo

976
00:54:46,680 --> 00:54:49,720
de mim para Stanford, de mim para Cambridge,

977
00:54:49,720 --> 00:54:54,560
é enviado para, a este nível, algo chamado de endereço IP.

978
00:54:54,560 --> 00:54:57,340
Vimos isso há um momento e um endereço IP

979
00:54:57,340 --> 00:55:02,480
é apenas um endereço numérico do w.x.y.z forma,

980
00:55:02,480 --> 00:55:08,070
onde cada um deles é entre, mais ou menos, 0 e 255,

981
00:55:08,070 --> 00:55:10,080
que você não consegue usar todos esses números.

982
00:55:10,080 --> 00:55:14,220
Mas cada um desses titulares lugar é um número entre 0 e 255.

983
00:55:14,220 --> 00:55:16,820
Assim, um endereço IP estes dias é de 32 bits.

984
00:55:16,820 --> 00:55:20,780
>> Agora, que nos dá os endereços IP quantas possível no mundo?

985
00:55:20,780 --> 00:55:24,420
Cerca de 4 bilhões, porque a qualquer momento estamos contando em potências de 2

986
00:55:24,420 --> 00:55:27,760
todo o caminho até 32 de algo, que, geralmente, nos dá 4 bilhões.

987
00:55:27,760 --> 00:55:30,160
Então, isso é um monte de endereços IP, mas você pode ter lido,

988
00:55:30,160 --> 00:55:32,410
ou você pode agora notar na imprensa popular,

989
00:55:32,410 --> 00:55:36,020
um impulso em direção a uma nova versão do IP chamado IPV6.

990
00:55:36,020 --> 00:55:38,290
Agora nós estamos usando a versão 4.

991
00:55:38,290 --> 00:55:41,060
Há realmente não foi uma versão 5, estamos pulando direito a 6.

992
00:55:41,060 --> 00:55:46,760
Versão 6 vai usar 128 bits para endereços IP, que é freaking enorme.

993
00:55:46,760 --> 00:55:49,430
Não devemos correr para fora por algum tempo agora,

994
00:55:49,430 --> 00:55:52,980
mas começaram a correr para fora da versão 4 endereços IP,

995
00:55:52,980 --> 00:55:56,110
porque todos nós temos as coisas não apenas como laptops e desktops,

996
00:55:56,110 --> 00:55:58,700
muitos de nós têm telefones, muitos de nós têm outros dispositivos

997
00:55:58,700 --> 00:56:01,600
como o TiVo e similares que têm endereços IP si.

998
00:56:01,600 --> 00:56:03,720
Harvard em si tem dezenas de milhares de computadores.

999
00:56:03,720 --> 00:56:07,970
Assim, o mundo está realmente ficando sem endereços IP, pelo menos desta forma.

1000
00:56:07,970 --> 00:56:10,340
Assim, ao longo dos próximos anos, você vai ver os endereços

1001
00:56:10,340 --> 00:56:12,870
em seus próprios computadores, provavelmente, mudar lentamente

1002
00:56:12,870 --> 00:56:16,740
como mais e mais empresas e universidades começam a apoiar a versão mais recente.

1003
00:56:16,740 --> 00:56:22,770
Mas um endereço IP não é suficiente para um computador para solicitar dados de computador b.

1004
00:56:22,770 --> 00:56:24,950
Porque o computador b poderia ser um servidor,

1005
00:56:24,950 --> 00:56:27,600
e um servidor, como mencionei anteriormente, pode fazer cachos de coisas.

1006
00:56:27,600 --> 00:56:29,940
Ele pode hospedar páginas da web, pode ser um servidor de e-mail,

1007
00:56:29,940 --> 00:56:32,310
ele pode ser um servidor Skype, ele pode ser um servidor de chat G.

1008
00:56:32,310 --> 00:56:35,870
>> Todos estes diferentes serviços que podem ser fornecidos em um servidor

1009
00:56:35,870 --> 00:56:38,330
tudo pode, fisicamente, estar na mesma máquina.

1010
00:56:38,330 --> 00:56:40,380
Assim, além de endereços IP,

1011
00:56:40,380 --> 00:56:43,250
o mundo tem coisas chamadas portas na Internet.

1012
00:56:43,250 --> 00:56:47,830
Uma porta é apenas um número, por isso não é um número único para HTTP.

1013
00:56:47,830 --> 00:56:50,280
O seu número é de 80.

1014
00:56:50,280 --> 00:56:55,870
HTTP também usa o número 443, mas, mais especificamente, para HTTPS criptografadas.

1015
00:56:55,870 --> 00:57:00,030
Sempre que você vê o s, de seguro, que está usando um número diferente.

1016
00:57:00,030 --> 00:57:06,580
Existem outros números, como o 25, usado para algo chamado de SMTP, também conhecido como e-mail.

1017
00:57:06,580 --> 00:57:09,620
Há algo chamado 22 para SSH,

1018
00:57:09,620 --> 00:57:11,850
e há um monte de outras portas lá fora.

1019
00:57:11,850 --> 00:57:14,460
Agora, nós, seres humanos raramente vê estes números.

1020
00:57:14,460 --> 00:57:21,970
No entanto, quando você digita um endereço como http://www.facebook.com,

1021
00:57:21,970 --> 00:57:26,560
o navegador é secretamente inserindo 80, porque você está usando HTTP.

1022
00:57:26,560 --> 00:57:30,630
Se, em vez disso, HTTPS tipo, ele é secretamente inserindo 443.

1023
00:57:30,630 --> 00:57:35,180
E nós podemos ver esse tipo de manualmente se eu puxar uma brower

1024
00:57:35,180 --> 00:57:41,850
e vá para http://www.facebook.com:80.

1025
00:57:41,850 --> 00:57:44,550
Portanto, explicitamente, não citando apenas o nome do site

1026
00:57:44,550 --> 00:57:47,650
mas a porta que eu quero falar, e tecle enter.

1027
00:57:47,650 --> 00:57:50,170
Observe que desapareça, porque o navegador assume,

1028
00:57:50,170 --> 00:57:53,360
oh, 80, eu não vou nem incomodar mostrando que para você.

1029
00:57:53,360 --> 00:57:56,400
Mas a razão para isto é que se eu realmente queria enviar um e-mail de alguém,

1030
00:57:56,400 --> 00:58:02,340
Eu realmente estar enviando a eles na porta 25, que sendo SMTP.

1031
00:58:02,340 --> 00:58:04,890
Um pouco de uma simplificação excessiva, mas alguns de vocês têm amigos

1032
00:58:04,890 --> 00:58:09,290
que efectivamente trabalham no Facebook, e eles, da mesma forma, tem servidores que recebem e-mail.

1033
00:58:09,290 --> 00:58:12,610
>> Toda vez que você enviar um e-mail, o que gmail está fazendo por você

1034
00:58:12,610 --> 00:58:14,960
ou o Outlook ou qualquer outro programa que você usa,

1035
00:58:14,960 --> 00:58:19,270
é uma espécie de segredo de inserir esse número, bem como, 25, nesse caso.

1036
00:58:19,270 --> 00:58:24,490
É esta combinação de endereço IP eo número que identifica

1037
00:58:24,490 --> 00:58:29,190
um computador na Internet e um serviço específico no computador.

1038
00:58:29,190 --> 00:58:33,460
Agora, é claro, a maioria de nós provavelmente nunca digitado manualmente um endereço IP.

1039
00:58:33,460 --> 00:58:37,340
Talvez você tem no aparelho, mas no mundo real, nem tanto.

1040
00:58:37,340 --> 00:58:42,750
Por que nós não digite os endereços IP em navegadores?

1041
00:58:42,750 --> 00:58:45,860
Ele iria trabalhar, de fato, podemos ver isso, deixe-me mostrar-lhe

1042
00:58:45,860 --> 00:58:50,000
um outro comando que deve funcionar mais em qualquer lugar no campus de Harvard, em um Mac ou um PC.

1043
00:58:50,000 --> 00:58:53,970
Há este comando chamado nslookup, pesquisa servidor de nome.

1044
00:58:53,970 --> 00:58:59,960
Se eu olhar para cima www.cnn.com, verifica-se que a CNN tem - oh, interessante.

1045
00:58:59,960 --> 00:59:03,180
CNN começou a usar o Amazon Web Services.

1046
00:59:03,180 --> 00:59:06,380
Você pode saber de computação em nuvem, uma Amazônia dos grandes jogadores em computação em nuvem.

1047
00:59:06,380 --> 00:59:10,240
O que eu fiz foi, eu disse: 'Dê-me o endereço do servidor web da CNN, "

1048
00:59:10,240 --> 00:59:14,090
mas acontece que o servidor web da CNN é gerenciado pela Amazon,

1049
00:59:14,090 --> 00:59:16,030
Amazon Web Services, isso sugere.

1050
00:59:16,030 --> 00:59:19,680
E o endereço do servidor que é este aqui.

1051
00:59:19,680 --> 00:59:22,350
Então, eu não tenho certeza se isso vai funcionar, porque não costumava usar Amazônia.

1052
00:59:22,350 --> 00:59:32,830
Mas vamos tentar, endereço, http:// IP, entrar, e -

1053
00:59:32,830 --> 00:59:35,690
é que vai funcionar?

1054
00:59:35,690 --> 00:59:39,280
Sim. Ele está indo para o trabalho. Internet é super-lento hoje.

1055
00:59:39,280 --> 00:59:43,680
Mas, em um momento, você vai ver alguns notícia.

1056
00:59:43,680 --> 00:59:48,360
Lá vamos nós. O Bank of America está sendo processado. Tudo bem.

1057
00:59:48,360 --> 00:59:54,000
>> Isto porque este endereço IP acontece apenas por sinônimo de www.cnn.com.

1058
00:59:54,000 --> 00:59:59,920
É claro, seria de marketing horrível de dizer, visite-nos na Web em 50.112.94.127.

1059
00:59:59,920 --> 01:00:02,370
Você nunca me lembraria. Assim, mesmo nos dias de hoje você pode lembrar as coisas

1060
01:00:02,370 --> 01:00:07,210
como 1-800-COLLECT ou mnemônicos do mundo veio com números de telefone.

1061
01:00:07,210 --> 01:00:09,540
Que, antes de os telefones celulares, foram bastante difícil lembrar

1062
01:00:09,540 --> 01:00:11,800
até que você poderia simplesmente inserí-la e esquecê-la.

1063
01:00:11,800 --> 01:00:15,730
Assim, a Web, também, tem essa convenção de nomes e endereços IP,

1064
01:00:15,730 --> 01:00:17,770
e há estas coisas lá fora, chamados de servidores DNS,

1065
01:00:17,770 --> 01:00:23,870
sistemas de servidores de nome de domínio, que traduzem endereços IP em nomes e vice-versa.

1066
01:00:23,870 --> 01:00:26,340
Então é isso que está acontecendo debaixo do capô.

1067
01:00:26,340 --> 01:00:29,540
No final, temos o TCP / IP, que é este protocolo de nível muito baixo

1068
01:00:29,540 --> 01:00:32,570
que, realmente, só fica 0 e 1 em toda a Internet,

1069
01:00:32,570 --> 01:00:36,030
e fá-lo, colocando-os em um envelope virtual,

1070
01:00:36,030 --> 01:00:38,820
se você quiser, e escrever do lado de fora do envelope

1071
01:00:38,820 --> 01:00:43,930
o endereço IP de destino, bem como o número da porta numérico

1072
01:00:43,930 --> 01:00:47,520
do serviço em que o destino que ele quer falar.

1073
01:00:47,520 --> 01:00:51,060
Enquanto isso, no envelope, há também algo conhecido como um endereço de retorno,

1074
01:00:51,060 --> 01:00:55,600
qual é o seu endereço IP, de modo que quando a CNN recebe um pacote de informações sobre você,

1075
01:00:55,600 --> 01:00:58,710
abre esse envelope virtual, vê que você quer na página inicial,

1076
01:00:58,710 --> 01:01:04,630
ele sabe da parte remetente deste envelope virtual de quem enviar as costas para HTML.

1077
01:01:04,630 --> 01:01:07,470
Então, vamos dar uma olhada nisso em detalhes um pouco mais.

1078
01:01:07,470 --> 01:01:11,370
Isto é de uma empresa chamada Ericson, de alguns anos atrás.

1079
01:01:11,370 --> 01:01:14,780
E tomaram algumas liberdades com a forma como a Internet funciona realmente,

1080
01:01:14,780 --> 01:01:18,920
mas pinta um quadro muito mais visual do que giz mera aqui.

1081
01:01:18,920 --> 01:01:26,690
Então, eu dar-lhe "um pouco da internet."

1082
01:02:26,660 --> 01:02:29,840
>> [Narrador] Pela primeira vez na história,

1083
01:02:29,840 --> 01:02:35,260
pessoas e máquinas trabalham em conjunto, realizando um sonho.

1084
01:02:35,260 --> 01:02:38,910
A força de união que não conhece limites geográficos.

1085
01:02:38,910 --> 01:02:43,230
Sem distinção de raça, cor, credo ou.

1086
01:02:43,230 --> 01:02:47,770
Uma nova era onde a comunicação verdadeiramente une as pessoas.

1087
01:02:47,770 --> 01:02:50,070
Isto é

1088
01:02:50,070 --> 01:02:54,980
O alvorecer da Internet.

1089
01:02:54,980 --> 01:03:04,640
Quer saber como funciona? Clique aqui para começar sua jornada para a rede.

1090
01:03:04,640 --> 01:03:07,890
Agora, exatamente o que aconteceu quando você clicou no link?

1091
01:03:07,890 --> 01:03:10,150
Você começou um fluxo de informações.

1092
01:03:10,150 --> 01:03:13,310
Esta informação viaja para baixo em sua sala de correspondência pessoal

1093
01:03:13,310 --> 01:03:18,500
onde os pacotes IP Mr. isso, rotula-lo e envia-lo em seu caminho.

1094
01:03:18,500 --> 01:03:20,960
Cada pacote é limitada no seu tamanho.

1095
01:03:20,960 --> 01:03:23,880
A sala de correio tem de decidir como dividir a informação

1096
01:03:23,880 --> 01:03:26,070
e como empacotá-lo.

1097
01:03:26,070 --> 01:03:29,550
Agora, o pacote precisa de um rótulo contendo informações importantes

1098
01:03:29,550 --> 01:03:35,570
tais como o endereço do remetente, o endereço do receptor, e o tipo de pacote que é.

1099
01:03:51,700 --> 01:03:54,980
Porque este pacote especial vai para a Internet,

1100
01:03:54,980 --> 01:03:57,720
que também recebe um endereço para o servidor proxy,

1101
01:03:57,720 --> 01:04:01,520
que tem uma função especial, como veremos mais tarde.

1102
01:04:01,520 --> 01:04:06,650
O pacote é agora lançado em sua rede de área local, ou LAN.

1103
01:04:06,650 --> 01:04:10,160
Essa rede é usada para conectar todos os computadores locais '

1104
01:04:10,160 --> 01:04:15,900
roteadores, impressoras, etc, para a troca de informações dentro das paredes físicas do edifício.

1105
01:04:15,900 --> 01:04:20,290
A LAN é um lugar muito descontrolada, e, infelizmente,

1106
01:04:20,290 --> 01:04:23,950
acidentes podem acontecer.

1107
01:04:31,190 --> 01:04:34,710
A auto-estrada da LAN é embalado com todos os tipos de informações.

1108
01:04:34,710 --> 01:04:38,900
Estes são os pacotes IP, pacotes Novell, pacotes AppleTalk.

1109
01:04:38,900 --> 01:04:41,270
Eles estão indo contra o tráfico, como de costume.

1110
01:04:41,270 --> 01:04:44,260
O router local lê o endereço e, se necessário,

1111
01:04:44,260 --> 01:04:48,520
levanta o pacote para uma outra rede.

1112
01:04:48,520 --> 01:04:54,270
Ah, o roteador. Um símbolo de controle em um mundo aparentemente desorganizado.

1113
01:04:54,270 --> 01:05:05,480
[Router resmungando e falando para si mesmo]

1114
01:05:05,480 --> 01:05:10,030
>> [Narrador] Lá está ele, sistemático, insensível, metódico,

1115
01:05:10,030 --> 01:05:14,150
conservador, e às vezes não completamente até a velocidade.

1116
01:05:14,150 --> 01:05:17,680
Mas pelo menos ele é exato, para a maior parte.

1117
01:05:32,270 --> 01:05:36,820
Como os pacotes deixar o roteador, eles fazem o seu caminho para a Internet corporativa

1118
01:05:36,820 --> 01:05:40,830
e de cabeça para o switch, roteador.

1119
01:05:40,830 --> 01:05:46,250
Um pouco mais eficiente do que o roteador, o switch, roteador joga rápido e solto com pacotes IP,

1120
01:05:46,250 --> 01:05:48,920
habilmente encaminhamento deles ao longo de seu caminho.

1121
01:05:48,920 --> 01:05:52,130
A 'Pinball Wizard' digital, se você quiser.

1122
01:05:52,130 --> 01:06:04,270
[Switch roteador falando para si mesmo]

1123
01:06:09,830 --> 01:06:12,150
[Narrador] Como os pacotes chegam ao seu destino,

1124
01:06:12,150 --> 01:06:14,740
eles estão pegou pela interface de rede,

1125
01:06:14,740 --> 01:06:18,040
pronta para ser enviada para o nível seguinte.

1126
01:06:18,040 --> 01:06:21,010
Neste caso, o proxy.

1127
01:06:21,010 --> 01:06:25,040
O proxy é utilizado por muitas empresas como uma espécie de homem de meia

1128
01:06:25,040 --> 01:06:27,630
, a fim de diminuir a carga sobre a ligação à Internet

1129
01:06:27,630 --> 01:06:32,240
e por razões de segurança, também.

1130
01:06:32,240 --> 01:06:38,750
Como você pode ver, os pacotes são de vários tamanhos, dependendo de seu conteúdo.

1131
01:06:55,210 --> 01:07:01,890
O proxy abre o pacote e procura o endereço web ou URL.

1132
01:07:01,890 --> 01:07:04,950
Dependendo se o endereço for aceitável,

1133
01:07:04,950 --> 01:07:08,000
o pacote é enviado para a Internet.

1134
01:07:13,890 --> 01:07:19,630
Há, no entanto, alguns endereços que não cumprem com a aprovação do procurador.

1135
01:07:19,630 --> 01:07:25,680
Ou seja, as diretrizes corporativas ou de gestão.

1136
01:07:25,680 --> 01:07:30,580
Estes são sumariamente tratados.

1137
01:07:30,580 --> 01:07:32,410
Nós vamos ter nada disso.

1138
01:07:32,410 --> 01:07:36,350
Para aqueles que fazem isso, é na estrada novamente.

1139
01:07:46,850 --> 01:07:53,310
>> A seguir, o firewall.

1140
01:07:53,310 --> 01:07:57,410
O firewall corporativo serve a dois propósitos.

1141
01:07:57,410 --> 01:08:02,420
Ela impede que algumas coisas bastante desagradáveis ​​da Internet de entrar para a Intranet,

1142
01:08:02,420 --> 01:08:10,280
e também pode impedir que informações confidenciais da empresa sejam enviadas para a Internet.

1143
01:08:10,280 --> 01:08:12,980
Depois de atravessar o firewall, um router recolhe o pacote

1144
01:08:12,980 --> 01:08:18,180
e coloca-o em uma estrada muito estreita, ou largura de banda, como se diz.

1145
01:08:18,180 --> 01:08:23,720
Obviamente, a estrada não é larga o suficiente para levá-los todos.

1146
01:08:23,720 --> 01:08:29,319
Agora, você pode se perguntar o que acontece a todos os pacotes que não o fazem ao longo do caminho.

1147
01:08:29,319 --> 01:08:32,270
Bem, quando o Sr. IP não receber uma confirmação

1148
01:08:32,270 --> 01:08:35,000
que um pacote foi recebido no devido tempo,

1149
01:08:35,000 --> 01:08:39,890
ele simplesmente envia um pacote de substituição.

1150
01:08:39,890 --> 01:08:44,760
Agora estamos prontos para entrar no mundo da Internet.

1151
01:08:44,760 --> 01:08:49,370
A teia de aranha de redes interligadas que abrangem todo o planeta.

1152
01:08:49,370 --> 01:08:56,050
Aqui, roteadores e switches estabelecem ligações entre redes.

1153
01:08:56,050 --> 01:08:59,200
Agora, a Internet é um ambiente totalmente diferente do que você vai encontrar

1154
01:08:59,200 --> 01:09:01,569
dentro dos muros de proteção da sua rede LAN.

1155
01:09:01,569 --> 01:09:04,060
Aqui, é o Velho Oeste.

1156
01:09:04,060 --> 01:09:06,359
Muito espaço, muitas oportunidades,

1157
01:09:06,359 --> 01:09:09,760
muitas coisas para explorar e lugares para ir.

1158
01:09:09,760 --> 01:09:12,760
Graças a muito pouco controle e regulação,

1159
01:09:12,760 --> 01:09:18,300
novas idéias encontrar solo fértil para empurrar o envelope de suas possibilidades.

1160
01:09:18,300 --> 01:09:22,330
Mas por causa dessa liberdade, também alguns perigos espreitam.

1161
01:09:22,330 --> 01:09:27,000
Você nunca sabe quando você vai conhecer o ping temido da morte,

1162
01:09:27,000 --> 01:09:29,890
uma versão especial de um pedido normal de ping,

1163
01:09:29,890 --> 01:09:35,720
que algum imbecil, que até descontrola os anfitriões incautos.

1164
01:09:35,720 --> 01:09:39,130
O caminho tomar nossos pacotes pode ser via satélite,

1165
01:09:39,130 --> 01:09:43,090
linhas telefônicas, sem fio ou cabo mesmo transoceânica.

1166
01:09:43,090 --> 01:09:46,520
Eles nem sempre tomar as rotas mais rápidas ou mais curta possível,

1167
01:09:46,520 --> 01:09:50,290
mas eles vão chegar lá um dia.

1168
01:09:50,290 --> 01:09:55,230
Talvez seja por isso que às vezes é chamado de "Wait A World Wide".

1169
01:09:55,230 --> 01:09:57,980
Mas quando tudo está funcionando bem,

1170
01:09:57,980 --> 01:10:03,800
você pode contornar o mundo cinco vezes mais na queda de um chapéu, literalmente.

1171
01:10:03,800 --> 01:10:08,230
E tudo para o custo de uma chamada local ou menos.

1172
01:10:08,230 --> 01:10:15,070
Perto do fim do nosso destino, nós vamos encontrar um outro firewall.

1173
01:10:15,070 --> 01:10:18,420
>> Dependendo da sua perspectiva, como um pacote de dados,

1174
01:10:18,420 --> 01:10:23,730
o firewall pode ser um bastião de segurança ou um adversário temível.

1175
01:10:23,730 --> 01:10:28,530
Tudo depende de que lado você está e quais são suas intenções.

1176
01:10:28,530 --> 01:10:34,990
O firewall é projetado para deixar entrar só os pacotes que atendam seus critérios.

1177
01:10:34,990 --> 01:10:39,360
Este firewall está operando nas portas 80 e 25.

1178
01:10:39,360 --> 01:10:46,630
Todas as tentativas de entrar através de outras portas estão fechadas para os negócios.

1179
01:10:57,660 --> 01:11:03,480
A porta 25 é utilizada para pacotes de correio,

1180
01:11:03,480 --> 01:11:10,720
enquanto a porta 80 é a entrada para os pacotes da internet para o servidor web.

1181
01:11:10,720 --> 01:11:15,080
Dentro do firewall, os pacotes são analisados ​​mais profundamente.

1182
01:11:15,080 --> 01:11:17,970
Alguns pacotes de torná-lo facilmente pela alfândega,

1183
01:11:17,970 --> 01:11:21,420
enquanto outros olham um pouco duvidosa.

1184
01:11:21,420 --> 01:11:24,060
Agora, o oficial de firewall não é facilmente enganado,

1185
01:11:24,060 --> 01:11:32,120
como quando esse ping de pacote morte tenta se disfarçar como um pacote de ping normal.

1186
01:11:32,120 --> 01:11:37,520
[Oficial Firewall conversando com pacotes]

1187
01:11:37,520 --> 01:11:40,510
[Narrador] Para aqueles pacotes sortudos o suficiente para torná-lo tão longe,

1188
01:11:40,510 --> 01:11:45,730
a viagem está quase no fim.

1189
01:11:45,730 --> 01:11:52,130
É apenas uma linha em cima da interface a ser levados para o servidor web.

1190
01:11:52,130 --> 01:11:55,440
Hoje em dia, um servidor web pode ser executado em muitas coisas,

1191
01:11:55,440 --> 01:11:59,230
a partir de um mainframe para uma web cam para o computador sobre sua mesa.

1192
01:11:59,230 --> 01:12:01,720
Por que não o seu refrigerador?

1193
01:12:01,720 --> 01:12:04,870
Com a configuração adequada, você pode descobrir se você tem o resultado

1194
01:12:04,870 --> 01:12:08,390
para Chicken Cacciatore, ou se você tem que ir às compras.

1195
01:12:08,390 --> 01:12:11,760
Lembre-se, este é o início do líquido.

1196
01:12:11,760 --> 01:12:17,310
Quase tudo é possível.

1197
01:12:17,310 --> 01:12:20,440
Um por um, os pacotes são recebidos,

1198
01:12:20,440 --> 01:12:26,320
aberto, e descompactado.

1199
01:12:26,320 --> 01:12:31,200
A informação que contêm, isto é, o seu pedido de informações,

1200
01:12:31,200 --> 01:12:34,830
é enviado para o servidor de aplicativos web.

1201
01:12:41,540 --> 01:12:47,140
O pacote em si é reciclado,

1202
01:12:47,140 --> 01:12:57,570
pronto para ser usado novamente, e preenchido com as informações solicitadas,

1203
01:12:57,570 --> 01:13:03,340
abordado, e enviado em seu caminho de volta para você.

1204
01:13:03,340 --> 01:13:13,250
Voltar passado o firewall, roteadores, e em meio à Internet.

1205
01:13:13,250 --> 01:13:21,020
De volta através do firewall corporativo

1206
01:13:21,020 --> 01:13:24,180
e para o seu interface,

1207
01:13:24,180 --> 01:13:31,180
pronto para fornecer seu navegador com a informação solicitada.

1208
01:13:31,180 --> 01:13:39,840
Isto é, este filme.

1209
01:13:39,840 --> 01:13:43,550
Satisfeito com os seus esforços, e confiando em um mundo melhor,

1210
01:13:43,550 --> 01:13:50,250
nossos pacotes de dados confiáveis ​​cavalgar alegremente no por do sol de um novo dia,

1211
01:13:50,250 --> 01:13:56,880
a certeza de terem servido bem seus mestres.

1212
01:13:56,880 --> 01:14:02,560
Agora, não é um final feliz?

1213
01:14:02,560 --> 01:14:07,040
[Malan] Ok, isso é o suficiente. Vamos ver na próxima semana.

1214
01:14:07,040 --> 01:14:10,040
[CS50.TV]