現在的文件上傳下載功能，都是支持斷點續傳的。那么這看似很簡單的小功能，背后實現的原理是怎樣的呢？

斷點續傳支持從文件上次中斷的地方開始傳送數據，而并非是從文件開頭傳送。

斷點續傳的原理如下：

由于瀏覽器與服務端的通訊是基于HTTP協議，所以斷點續傳功能的原理就是靠HTTP請求來實現。

斷點續傳功能最核心的原理就是利用HTTP請求中的兩個字段：客戶端請求頭中的Range，和服務端響應頭的Content-Range。

我們舉一個例子，模擬一下整個過程。

1、瀏覽器請求服務器上的一個文件時，所發出的請求如下（假設文件名為 file.zip，服務器域名為W）：

• GET /file.zip HTTP/1.1 ? ??//瀏覽器用GET方式獲取file.zip文件，HTTP協議版本1.1
• Accept： image/gif， image/x-xbitmap， image/jpeg， image/pjpeg， application/vnd.ms-
• excel， application/msword， application/vnd.ms-powerpoint ? ? //可接受的響應內容（文件）類型
• Accept-Language： zh-cn ? ?//可接受的響應內容語言（簡體中文）
• Accept-Encoding： gzip， deflate ? ?//可接受的響應內容的編碼方式
• User-Agent： Mozilla/4.0 (compatible; MSIE 5.01; Windows NT 5.0) ? //瀏覽器的身份標識（瀏覽器類型）
• Connection： Keep-Alive ???//瀏覽器想要優先使用的連接類型

2、服務器收到請求后，尋找請求的文件，提取文件的信息，然后返回給瀏覽器，返回信息如下：

• 200 ? ?//響應狀態碼（200標識成功）
• Content-Length=123456789 ??//響應消息的長度（單位是字節）
• Accept-Ranges=bytes ? ?//服務器所支持的內容范圍（字節）
• Date=Mon， 30 Apr 2001 12:56:11 GMT ? ?//此消息被發送時的日期和時間
• ETag=W/“02ca57e173c11:95b” ? ?//資源的標識符
• Content-Type=application/octet-stream ? ?//當前內容的類型
• Server=Microsoft-IIS/5.0 ? ?//服務器名稱
• Last-Modified=Mon， 30 Apr 2001 12:56:11 GMT ? ?//所請求的對象的最后修改日期

3、此時文件已經開始下載了，如果現在停止了下載，那么再次下載文件時就要從已經下載的地方繼續下載?，F在比如按下了繼續下載，那么此時瀏覽器的請求內容如下：

• GET /file.zip HTTP/1.1
• Accept： image/gif， image/x-xbitmap， image/jpeg， image/pjpeg， application/vnd.ms-
• excel， application/msword， application/vnd.ms-powerpoint
• Range： bytes=200000- ? ?//告訴服務器 file.zip 這個文件從200000字節開始傳，前面的字節不用傳了
• Accept-Language： zh-cn
• Accept-Encoding： gzip， deflate
• User-Agent： Mozilla/4.0 (compatible; MSIE 5.01; Windows NT 5.0)
• Connection： Keep-Alive

4、此時服務器收到這個請求后，返回的信息如下：

• 206 ? ? //表示服務器已經成功處理了部分GET請求
• Content-Length=123256789
• Content-Range=bytes 200000-/123456789 ? ?//表示已經返回了200000B的文件數據，同時也返回了文件的全部大小
• Date=Mon， 30 Apr 2001 12:55:20 GMT
• ETag=W/“02ca57e173c11:95b”
• Content-Type=application/octet-stream
• Server=Microsoft-IIS/5.0
• Last-Modified=Mon， 30 Apr 2001 12:55:20 GMT

以上就是斷點續傳的原理，在不同客戶端實現時只需要找到不同的開發語言實現提交Range的方法即可。

作為產品功能的設計者，每一個看似簡單的小功能，其背后的實現原理都值得我們去研究，正所謂“知其然，更要知其所以然”。

#專欄作家#

流年，人人都是產品經理專欄作家?；ヂ摼W產品設計師，4年互聯網產品設計經驗。擅長用戶體驗設計，喜歡鉆研需求功能背后的技術實現方式；在成為綜合型產品設計師的道路上不斷努力前進！

本文原創發布于人人都是產品經理。未經許可，禁止轉載

題圖由作者提供