一些廢話
眼看着這場災難般的疫情逐漸平息,我們的網課生涯也要告一段落了
再次回想這兩個月來在家休閑恬淡的生活

(笑)
感動完了 是時候面對多(can)彩(dan)的人生了
你們的網課,上完了嗎?
與其看着幾十節絲毫未動的網課陷入絕望,不如……

來啊 快活啊 4倍速帶你上天
教程適用范圍
- 上錄播網課的苦逼孩子們
- 用電腦網頁端上網課的苦逼孩子們
- 網課頁面用的是Flash播放器的苦逼孩子們
- 快要開學還有好多課沒上完而且開學之后還要考試的苦逼孩子們
總之適用於苦逼孩子們
P.s. 親測對於雲課網(某郡衛星遠程學校)可用 其他平台未作嘗試,僅供參考
教程開始!
鑒於市面上大多數瀏覽器主要以Chrome為內核,包括Chrome、360安全瀏覽器、搜狗高速瀏覽器等等等等
(以及一枝獨秀的Firefox)
我就以Firefox和Chrome為例來講解
(點擊可查看大圖)
通過修改User-Agent替換Flash播放器
安裝擴展程序User Agent Switcher
在擴展中心中搜索關鍵詞,我們會發現有很多種類似的擴展程序,任選其一安裝即可。
當然新手或者不是很懂的同學也可以照着我下文圖片中的那兩款安裝(看圖標!)
鑒於各大瀏覽器的擴展中心各不相同,沒有弄懂的同學可以百度XX瀏覽器如何安裝擴展程序
對於Chrome
- 打開擴展程序窗口 然后在左側欄中找到網上商店入口

- 接着在搜索框搜索
User Agent Switcher
選擇你心儀的一款 將其添加至Chrome

使用X60安全瀏覽器、X狗高速瀏覽器的同學們快速地完成了這一步
而使用Chrome的同學發現……
誒誒誒!為什么我的網上商店打不開
Oh我的老伙計 這可是谷歌啊 你知道的
既然你已經有了用Chrome的覺悟
我想 這對你來說應該不是什么問題[手動狗頭]
或者你也可以去百度Chrome如何安裝擴展程序
這里就不贅述啦~
我才不會說是因為太麻煩我不想說
對於Firefox
Firefox就沒那么多事兒了
照着來就行
(點擊可查看大圖)
- 點開右上角的菜單 選擇擴展程序
有一說一 必應的每日壁紙是真的好看逼格又高 牆裂推薦作為主頁
所以 必應打錢(bushi)

- 在上方的搜索欄中輸入
User Agent Switcher

- 點擊你心儀的目標,安裝
我這里使用的是第三個
(畢竟人家都標了個推薦在上面了)

修改User-Agent
這時候,我們可以注意到在瀏覽器右上欄中出現了我們剛安裝程序的圖標
不同擴展程序的布局各不相同,這里需要大家好好研究一番,自己安裝的版本是如何使用的
相信你們的英語實力awa
我們在這一步的目的是將瀏覽器的user-agent改為與iPad相同
此時網站會誤認為你在使用iPad上課,然后將Flash播放器替換為HTML5播放器
絕大多數的這類擴展程序都提供了一些選項供你選擇
此時我們選擇iPad
但由於未經測試,無法保證它們全部能夠奏效
(不過我覺得應該是沒問題的~)
當擴展程序提供的選項中沒有iPad或者它不管用時
建議自定義User-Agent
親測下面這個User-Agent是有效的
Mozilla/5.0 (iPad; CPU OS 10_3_1 like Mac OS X) AppleWebKit/603.1.30 (KHTML, like Gecko) Version/10.0 Mobile/14E304 Safari/602.1
將它復制到自定義的地方以完成
下面是我安裝的版本圖解 僅供參考
對於Chrome
單擊剛剛安裝的擴展
選擇iOS→iPad
刷新 看到網課界面沒有“未安裝Flash”的提示就代表成功了

接下來是自定義的圖解,大多數擴展都大同小異
(上一步成功了的可略過)
-
打開對應擴展的管理頁面


-
此時應該可以找到自定義的輸入框
和這個布局不大一樣的 用高中英語知識自行探索一下吧
如圖 名字(Name)和分組(Group)還有標識(Indicator Flag)是隨意的
它們各對應的地方可以在圖片中看到
中間的那一欄復制粘貼上文的那個就行
填寫完畢后點Add

-
接下來的操作大同小異 看圖就行


對於Firefox
-
我安裝的這個擴展 清晰明了 一張圖搞定

-
出現這個界面就代表你這一步成功了

P.s.QAQ我現在終於知道寫教程多難了
感謝互聯網的分享精神
一些使用技巧
上面一波操作完畢后
我們會發現別的網頁也發生了一些變化
因為這時所有的網站都把你當成iPad用戶了

由於比例原因
看起來會很不舒服
這時只需關掉就行了
自行探索一下不成問題
然而最便捷的方法是設置白名單!
對於Chrome
還是打開剛剛的管理界面
左側選擇第二個選項
如圖設置即可

對於Firefox
還是剛剛的界面,選擇左下角的 Options

安裝腳本使Html5播放器正常啟動
安裝Tampermonkey腳本管理器
相信大家或多或少聽說過這玩意兒
傳說中的百度雲下載必備
操作和剛剛安裝switcher是一樣的
換個關鍵詞就行了
對於Chrome

對於Firefox

安裝腳本hls.user.js
這一步 基本所有的瀏覽器都一樣
點擊這里的傳送門
hls.user.js
照着圖來 大家都會


這時再打開你的網課網頁
發現視頻可以播放啦!
Speed up !!!!!
安裝用於控制速度的腳本
步驟和上面的一模一樣
那么這里我推薦兩個腳本
一個是簡單版 一個是超級進階版
傳送門走起
操作說明-視頻速度控制器
這里我就直接貼一下作者留下的說明叭
看來這個腳本也是為網課而生呀
(反思一下 人家都會自己編腳本了 你還只會摳jio)

操作說明-HTML5視頻播放器增強腳本
這個 腳本 強!到!爆!
具體操作如下

awa真的要感謝網友們的分享精神
原理小講堂
awa不感興趣的同學可以跳過啦~
我就簡單說一下叭
這方面水似乎挺深 我這樣一個小菜雞還研究不透
而且在這0202年 我查到的資料幾乎都是3年前起步的
有錯誤或者過時內容還請一定一定指出 萬分感謝
User-Agent是什么?
水題 直接扔百科 下一個 (bushi)
由於某些原因 蘋果的iOS不支持Flash播放器
所以一般使用Flash播放器的網站 會在iOS端將其替換為HTML5播放器
所以我們只要假裝自己是果粉就行了(笑
Flash那么可愛 為什么要干掉Flash qwq
一點也不可愛
其實吧 Flash視頻播放器在大多數網站早已被HTML5標准下的視頻播放器替代
除了像這種教育類型的老網站
怪就怪雲課網的程序員們懶得換
沒有創新意識 差評
我就簡單地分幾點來談一下
FLash插件難以被破解
Flash 是插件,而且發展了這么多年,技術已經相當成熟,甚至可以做到在代碼中直接插入編譯好的 C 模塊(FlasCC 技術,原稱 Alchemy),很多視頻網站(比如優酷和騰訊)的 Flash 播放器中都有破解難度相當大的 C 模塊。[1]
Flash難以被破解的特性,對視頻網站來說是好事
可以防止視頻被盜或者被跳廣告 (大多數視頻網站靠這個恰飯) 等一系列問題
但對我們來說就不那么好了
Flash原生並不支持倍速等多種功能 功能單一 播放 暫停 進度條 沒了
朴實無華,且枯燥
Flash插件安全性低
乍一看這一條好像和上一條沖突,但這里的安全性是相對用戶而言的
Flash相較於Javascript
脫離了瀏覽器的限制,權限更大,也更容易訪問到本地文件
然而權力越大,漏洞就越多
這意味着黑客有了可乘之機
稍懂網絡安全的人都知道
Flash有着漏洞之王的稱號
動不動就爆出個嚴重安全漏洞
問題是這玩意兒還是閉源的 得等Adobe的工程師來修
於是當HTML5這一可替代它的技術出現之后
Flash立馬就被拋棄了
咱看看Google的Chrome怎么說

其實咱也不能奢求什么
畢竟人家Adobe是搞藝術套餐的(笑
Flash效率低下 資源占用較大
關於內存,flash頁游做得好的,大概控制在150m到200m,做得不好的,分分鍾跑到500m,1g都有。就內存這一項,就可以讓你想用也用不了。此外,flash9的avm2虛擬機+as3類js語言,語言和性能都遠遠落后於java和c#虛擬機,導致cpu功耗也比較高。[2]
直觀感受就是過於吃內存 內存小的情況下還會感覺卡
Flash的末路
Flash相對於較新的HTML5標准來說 已經是老大爺級別
但俗話說得好 百足之蟲,死而不僵
Flash在互聯網時代產生了相當巨大的影響
一如當年的Windows XP
雖然官方宣布在2020年底停止支持
想必還是會有一定的應用
但我怕的就是這個
如何看待Chrome將在2020年底不再支持Flash,這將會對國內互聯網造成什么樣的沖擊? - Apisa的回答 - 知乎
現在的Flash早就已經開始使壞了
之前我裝個Flash 竟然蹦出一堆頁游廣告
Flash你變了 再見罷
(再懷念一波4399和QQ農場什么的)
為何需安裝腳本才能正常解碼播放網課視頻?
這個問題有點復雜 我研究了好久的說
因為我們上網課的網站視頻源格式為m3u8,而這種格式無法支持Windows上的HTML5播放器
引用個我也不是很看得懂的圖

從圖片里可以看出來 只有Safari和Edge是完美支持的
所以說 使用Windows10的同學
可以直接開掛跳過安裝插件的階段 直接修改user agent就行
而這個操作 Edge瀏覽器可以直接通過按下F12后出現的仿真界面設置
簡單而美好[狗頭]
咳咳我還是硬着頭皮試着講一下。。。
m3u8 是一種基於 HTTP Live Streaming (HLS) 文件視頻格式,它主要是存放整個視頻的基本信息和分片(Segment)組成。目前 由 Apple.inc 率先提出的 HLS 協議在 Mac 的 Safari 上原生支持[4]
原生的 HTML5 <video> 元素在 Windows PC 上僅支持 mp4 (H.264 編碼)、webm、ogg 等格式視頻的播放。[1]
從這兩段材料中可以看出 我們是無法通過HTML5的視頻播放器來播放m3u8格式的網課視頻的
然而……程序員可是萬能噠!
於是MSE就應運而生了
我們可以把<video>標簽看做擁有解封裝和解碼功能的瀏覽器自帶播放器。隨着視頻點播、直播等視頻業務的發展,視頻通過流媒體傳輸協議(目前常用的有兩種,MPEG-DASH和Apple的HLS)從服務器端分發給客戶端,媒體內容進一步包含在一層傳輸協議中,這樣<video>就無法識別了。以HLS為例,將源文件內容分散地封裝到了一個個TS文件中。
僅靠<video>標簽無法識別這樣的TS文件,那么就引入了MSE拓展來幫助瀏覽器識別並處理TS文件,將其變回原來可識別的媒體容器格式,這樣<video>就可以識別並播放原來的文件了。那么支持HTML5的瀏覽器就相當於內置了一個能夠解析流協議的播放器。[5](奇怪的是[6]中也有一模一樣的一段 這就雨我無瓜了awa)
簡而言之,MSE技術可以將視頻實時轉碼為瀏覽器支持播放的格式
我們上面安裝的hls.user.js就是運用了這種技術。
參考資料
我畢竟還是菜啊,說也說不清qaq
這里提供一些我查閱引用過的質量不錯的資料,感興趣的同學們推薦看一看
[1] 為什么國內大部分視頻廠商不對PC開放HTML5? - 張一環的回答 - 知乎
[2] iOS 不支持 Flash 的真實原因是什么? - 顧雷的回答 - 知乎
[4] 有支持M3U8格式的HTML5播放器嗎? - 蒲小花的回答 - 知乎
[5] 粗識 HTML5 video 標簽和MSE媒體源擴展
[6] H5直播系列二 MSE(Media Source Extensions) - 簡書
P.s. 上述引用的資料,如有侵權請聯系我,我會在第一時間將其刪除並致歉。
快樂補課時間
emmm如果有不懂的同學可以通過QQ聯系我喔
博客左側菜單那個應該能用awa
那么教程到這里就結束了(哈欠)
不說了補課去(悲

