1
00:00:02,719 --> 00:00:07,360
網際網路如何運作：HTTP 和 HTML

2
00:00:07,360 --> 00:00:11,740
我是Jasmine，我是XBOX One工程團隊的項目經理。

3
00:00:11,759 --> 00:00:18,700
我們最大的特色之一是XBOX Live 這個線上服務。

4
00:00:18,700 --> 00:00:24,099
XBOX Live 串連起全世界的玩家，而這是藉由網際網路才得以實現！

5
00:00:24,099 --> 00:00:30,500
這不是一件容易的事，在幕後需要達成很多事情。

6
00:00:30,500 --> 00:00:36,280
網際網路完全改變了人們互動和聯繫的方式。但它是如何運作的呢？

7
00:00:36,280 --> 00:00:43,489
世界各地的電腦又是如何彼此溝通的呢？我們仔細看看「瀏覽網站」這個例子。

8
00:00:43,489 --> 00:00:50,199
首先，你會執行瀏覽器，這是你用來造訪網站的應用程式。

9
00:00:50,199 --> 00:00:58,520
然後，你輸入網站位址URL，它代表著網站的統ㄧ資源定位符，如：tumblr.com。

10
00:01:04,638 --> 00:01:06,810
嗨，我是 David Karp，Tumblr的創辦人。

11
00:01:06,810 --> 00:01:11,440
今天我們來聊聊，每天使用的網站瀏覽器，實際上是如何運作的。

12
00:01:11,440 --> 00:01:17,225
在瀏覽器中輸入網址，並按下Enter之後，實際發生了什麼事情呢？

13
00:01:17,225 --> 00:01:19,838
它真的是很瘋狂的一件事。

14
00:01:19,850 --> 00:01:27,114
你的電腦開始與稱為「伺服器」的另一台電腦通信。兩台電腦通常間隔著數千英里。

15
00:01:27,114 --> 00:01:31,900
在幾毫秒內，你的電腦會向伺服器查詢一個網站

16
00:01:31,900 --> 00:01:36,890
伺服器則開始使用 HTTP 這個語言，回覆你的電腦。

17
00:01:36,996 --> 00:01:40,711
HTTP 代表著 超文件傳輸協定

18
00:01:40,711 --> 00:01:45,801
你可以把它看作是一台電腦用來向另一台電腦索取文件的語言。

19
00:01:45,839 --> 00:01:53,040
它實際上是非常直覺的。
如果你去監聽你的電腦與伺服器之間的對話

20
00:01:53,040 --> 00:01:56,100
這些對話，主要是由「GET」的請求指令組成。

21
00:01:56,100 --> 00:02:00,730
就比如簡單的一句： GET “你所請求的文件名稱”

22
00:02:00,730 --> 00:02:06,697
要前往 Tumblr 的登入頁面，
你只需要向 Tumblr 的伺服器傳送一個 GET 請求

23
00:02:06,697 --> 00:02:16,891
說道：GET / login。這會告訴 Tumblr 的伺服器
你想要 Tumblr 登入頁面所有的 HTML 程式碼。

24
00:02:17,494 --> 00:02:21,498
HTML 代表著「超文字標記語言」

25
00:02:21,498 --> 00:02:26,470
你可以將它視為一種語言，
用來告訴瀏覽器，該如何顯示網頁的外觀。

26
00:02:26,470 --> 00:02:30,540
想像一下，維基百科這個網站
它基本上就只是一個大文件

27
00:02:30,540 --> 00:02:36,449
HTML 是用來讓 標題「變大」和「粗體」的語言，
並且讓字體顯示正確

28
00:02:37,457 --> 00:02:43,859
讓某些文字能連結到其他頁面
讓某些文字變成「粗體」、或是變成「斜體」

29
00:02:43,859 --> 00:02:48,530
讓圖片顯示在頁面的中間、對齊右邊，或是對齊左邊。

30
00:02:48,763 --> 00:02:52,790
網頁中的文字，是直接包含在 HTML 中

31
00:02:52,790 --> 00:02:59,633
圖片 或 影片 則是分開的檔案，他們具有自己的URL，需要額外的請求。

32
00:02:59,633 --> 00:03:06,411
對於每一個，瀏覽器會個別發送 HTTP 請求，
並在回覆到達時顯示它們。

33
00:03:07,991 --> 00:03:13,716
如果一個頁面有很多不同的圖片
每一個都會產生個別的 HTTP 請求

34
00:03:13,716 --> 00:03:17,180
這就會讓頁面載入變慢

35
00:03:18,765 --> 00:03:23,422
有時候當你瀏覽網頁時
你不僅僅是透過 GET 來取得網頁

36
00:03:23,690 --> 00:03:29,112
有時，你還會送出資訊
像是填寫表單，或是輸入搜索查詢

37
00:03:29,112 --> 00:03:36,313
瀏覽器會使用 HTTP POST 指令，以純文字形式，將資訊傳送給伺服器。

38
00:03:36,625 --> 00:03:40,860
像是你要登入 Tumblr
首先，你會發送 POST 需求

39
00:03:40,860 --> 00:03:44,613
也就是向 Tumblr的登入頁面，發送一個 POST 指令

40
00:03:44,613 --> 00:03:49,156
裡面會有一些附帶的資訊
像是：你的電子郵件地址和密碼

41
00:03:49,156 --> 00:03:53,820
那些會傳送到 Tumblr 伺服器來進行確認
OK! 你是 David

42
00:03:54,340 --> 00:03:58,833
然後傳送一個頁面，回到你的瀏覽器上
表示著：「成功」，登入的人是「David」

43
00:03:59,020 --> 00:04:03,699
除了頁面，還會附加一些看不見的 cookie 資料。

44
00:04:03,940 --> 00:04:07,080
你的瀏覽器可以看到
並知道如何保存這些資料

45
00:04:07,230 --> 00:04:11,044
這非常重要，因為這是網站能記住你是誰的唯一方式

46
00:04:11,814 --> 00:04:18,514
對 Thumblr 來說 cookie 資料是一種身份識別卡片
用來辨識你是 David

47
00:04:18,900 --> 00:04:25,042
瀏覽器會保留這個編號
當你更新 Tumblr 頁面，或下次再前往 Tumblr.com 時

48
00:04:25,042 --> 00:04:30,930
你的瀏覽器就會自動附加這個編號
隨著請求發送給 Tumblr 伺服器

49
00:04:30,930 --> 00:04:38,448
當 Tumblr 伺服器看到這些請求、編號時，就會知道
「OK! 這是來自於 David 的請求」

50
00:04:40,498 --> 00:04:43,940
目前：1. 網際網路是完全開放的

51
00:04:43,940 --> 00:04:48,300
2. 所有的連結都是共享的
3. 資訊都是以純文字的形式傳送

52
00:04:48,300 --> 00:04:55,025
這讓駭客們能夠擷取
在網際網路上，你傳送的任何個人私密資訊

53
00:04:55,025 --> 00:05:01,084
但是安全網站能夠阻止這一點，
藉著要求你的瀏覽器使用加密頻道來溝通

54
00:05:01,084 --> 00:05:07,630
使用「安全資料傳輸層 SSL」以及後續的「傳送層安全協定 TLS」

55
00:05:07,630 --> 00:05:16,737
你可以把 SSL 和 TLS 視為包在資訊外圍的安全保護層
避免資訊被偷看或竄改

56
00:05:16,737 --> 00:05:25,252
當你看到網址欄中，在 https 旁邊顯示小鎖的圖案時，
表示 SSL 和 TLS 正在運作當中

57
00:05:25,252 --> 00:05:31,312
安全超本文傳輸協定 (HTTPS) 能確保你的 HTTP 請求是安全且受到保護

58
00:05:32,452 --> 00:05:36,410
當網站要求你的瀏覽器要建立安全連線時

59
00:05:36,410 --> 00:05:41,357
網站會先提供一份數位憑證
這就像一張正式的身份認證

60
00:05:41,357 --> 00:05:44,130
來證明這個網站是真的

61
00:05:44,130 --> 00:05:51,878
數位憑證是經由「CA認證中心」來頒發。
CA 是具公信力的組織，它會驗證網站的真實性

62
00:05:51,878 --> 00:05:54,274
再為這些網站頒發數位憑證

63
00:05:54,274 --> 00:05:57,361
就像政府可以核發身份證或護照一樣

64
00:05:57,470 --> 00:06:04,901
如果網站沒有正確核發的數位憑證，就想建立安全通訊，瀏覽器便會發出警告。

65
00:06:07,231 --> 00:06:12,490
以上就是瀏覽網頁的基礎知識！
也是我們使用網際網路的日常

66
00:06:12,680 --> 00:06:21,737
總結一下，HTTP 和 DNS 管理著網路上
HTML、多媒體文件或任何資訊的發送和接收

67
00:06:21,737 --> 00:06:31,320
讓這成為可能的是，TCP/IP 和 路由器網絡
它們讓資訊得以拆解並用小封包形式來傳遞

68
00:06:31,439 --> 00:06:36,810
這些封包則由二進位制所組成 --- 許多 1 和 0 的次序組合

69
00:06:36,810 --> 00:06:42,221
並通過電線，光纖電纜、無線網路來傳送。

70
00:06:42,550 --> 00:06:47,440
幸好，你只需要學會網際網路層的運作原理，你就可以依賴它

71
00:06:47,440 --> 00:06:49,242
而不用記住所有的細節

72
00:06:49,553 --> 00:06:52,810
我們可以相信，所有這些網際網路互連層會一起運作

73
00:06:52,810 --> 00:06:57,850
成功地，大規模且可靠的傳遞資訊