# 怎麼下載串流媒體(*.blob) ## 基本原理 影片在串流時會被切分成數小分檔案,只在user請求後才發送該小段至user端,以達到節省流量資源的目的。 若播完該小片段後,為了讓browser知道下一段影片應該是哪段,一開始server端會發送一個list檔案,告知browser下一段要向server請求哪段影片。 該list只要被截取出來即可使用流媒體下載工具如VLC,直接將一段一段的影片連續的下載至本機端後自動合成一份檔案,並轉碼成常用的影片格式,例如*.mp4、*.AMV等。 ## 實作 理解以上原理後就可以實作了,本處以NTU COOL的線上課程串流來示範。 ![image](https://hackmd.io/_uploads/rkQJa-Ysxg.png) ### 按下F12 檢查影片的元素 ![image](https://hackmd.io/_uploads/B1rzpbYole.png) ```=html <video class="vjs-tech" id="vjs_video_3_html5_api" tabindex="-1" role="application" preload="metadata" src="blob:https://cool-video.dlc.ntu.edu.tw/blabla"></video> ``` 會注意到資源檔src所在有一個blob的開頭,代表為串流媒體。 ``` src="blob:https://cool-video.dlc.ntu.edu.tw/blabla" ``` 後面的網址並非可下載的資源檔案,需要找到串流媒體的list檔才行。 ### 切換到NETWORK標籤 ![image](https://hackmd.io/_uploads/HJd7C-Yjgg.png) ![image](https://hackmd.io/_uploads/S14VAbKsxg.png) 下面的時間軸可以看到本網站上隨時間browser與server端的互動情況。 按下F5重新整理 ![image](https://hackmd.io/_uploads/SkkdCbYsxg.png) 可看到一堆CSS或js的互動資料,但都不是重點 在最下層可以注意到video.init、blob等關鍵字 ![image](https://hackmd.io/_uploads/Sk_2AbKseg.png) 而常見的流媒體list附檔名為*.m3u8或*.mpd。 所以,這個物件就是真實list的請求網址: ![image](https://hackmd.io/_uploads/SJuIJGYoeg.png) 將網址整個複製起來,開啟VLC串流器。 ![image](https://hackmd.io/_uploads/S1HT1GKsee.png) 填入網址後按下轉換 ![image](https://hackmd.io/_uploads/Hk70yMYjel.png) 勾選設定 ![image](https://hackmd.io/_uploads/HkUGlzKjll.png) ![image](https://hackmd.io/_uploads/ryj7gztsex.png) ![image](https://hackmd.io/_uploads/H1gElMKolg.png)![image](https://hackmd.io/_uploads/SyXrlMYjeg.png) 最後填入存檔的檔案名稱即可開始下載。 ![image](https://hackmd.io/_uploads/HkE_gMFieg.png)