1. 什么情況下可以使用HTML5播放？
要支持HTML5播放，瀏覽器必須同時滿足兩個條件：
1. 瀏覽器能解析HTML5標准的Video標簽。
2. 瀏覽器能對H.264編碼的視頻做解碼。
我們再來細細的說一說這個問題，我們先來解釋下什么是HTML5。HTML5是用於取代1999年所制定的 HTML 4.01 和 XHTML 1.0 標准的 HTML（標准通用標記語言下的一個應用）標准版本；現在仍處於發展階段，但大部分瀏覽器已經支持某些 HTML5 技術。HTML5播放視頻，使用的是HTML5標准里的 video 標簽，基本用法查看這里，更高級的接口定義請參閱W3C規范文檔。 由於Video是HTML5規范里新增的標簽，那么一定要瀏覽器能解析Video標簽，否則肯定無法使用HTML5。
那么單單能解析HTML5的Video標簽是否就能這個正常播放呢？視頻是經過編碼的，編碼格式是H.264視頻格式。所謂編碼，其實就是一種壓縮算法，要壓縮，那么一定要解壓縮，視頻格式的解壓縮就是解碼，如果瀏覽器本身無法對視頻文件進行解碼，那么同樣播放不出來。
所以綜上，視頻播放必須要滿足上述兩個條件，缺一不可。
2. 為什么有些安卓手機無法播放視頻？
首先，要解答這個問題，請先看問題1。
看過問題1，我們知道安卓播放跟廠商支持情況有關，其實前端JS這邊對VIDEO標簽的解析和H264的解碼做不了什么實質的事情，我們只能盡量使用html5的API接口找到hack各種設備的方案，但關鍵還是看廠商支持情況，所以要在前端實現適配難度很大。
安卓由於嚴重的系統碎片化問題，導致不同的廠商、不同的瀏覽器對上述兩種條件的支持各不相同，所以安卓沒法簡單的說到底是否支持HTML5播放，甚至同一個廠商的不同機型，其特點都不一樣，我們遇到過單獨支持flash的，單獨支持html5的，或者二者都支持的，甚至還有都不支持的，另外還有明明實際上能使用HTML5播放但API又返回說不支持播放的。對此我們針對不同的Android設備和瀏覽器做了些矯正和強制判斷，許多問題需要Case by Case去解決。
3. 對於HTML5和flash都不支持的安卓，我們怎么辦？
問題1里我們說過，安卓設備上我們遇到過單獨支持flash的，單獨支持html5的，或者二者都支持的。但基於web的視頻播放無非就這兩種功能方案，如果都不支持怎么辦？
其實還有個方案，就是MP4鏈接的形式，我們稱之為MP4Link?，如下圖：
這個看起來像個播放器，其實我們只是在播放區域放了一張長得像播放器的靜態圖片，在圖片上我們設置了鏈接，指向到視頻MP4文件，用戶點擊”播放按鈕“（實際點擊的是圖片鏈接），觸發瀏覽器本身的特性，會自動打開MP4文件，這個時候有些瀏覽器會自動調用設備默認的視頻播放器，或者會問用戶，當前是要下載還是要播放。
這個圖片的真實DOM結構是：
<div style="background-image: url(http://i.gtimg.cn/qqlive/images/20121119/i1353305744_1.jpg); width: 480px; height: 320px; background-position: 50% 50%; background-repeat: no-repeat no-repeat;"> <a style="width:100%;height:100%;display:block" class="tvp_mp4_link" href="http://121.14.123.15/vlive.qqvideo.tc.qq.com/i001216370f.mp4?vkey=A3ACE7BB0CEE0BBFF97146833176996528C34F0146E430ACBE5628C93D4885463181382FFA4E5E0F&br=66&platform=2&fmt=mp4&level=3&sdtfrom=v1010" target="_blank"></a> </div>
4. 我們已知的一些播放問題
| 設備和瀏覽器 | 現象 | 解決方案 |
|---|---|---|
| 小米1 & 小米2（MIUI V5系統） | 系統自帶的瀏覽器API返回不支持H.264，但實際上點擊可以進入全屏，MIUI自己拉起系統播放器播放視頻 | 矯正為使用HTML5 |
| 三星系列，主要是Note2，S3等 | 系統自帶的瀏覽器API返回不支持H.264，但實際上可以播放 | 矯正為使用HTML5 |
| QQ手機瀏覽器 | 點擊播放以后強制使用瀏覽器自帶的皮膚，無法使用騰訊視頻用CSS3制作的皮膚 | QQ瀏覽器的皮膚外觀和體驗都還不錯，可以接受該體驗 |
| 微信4.*版本運行在安卓4.0+的系統 | 播放無法全屏，點擊全屏沒反應 | 建議升級到微信5.0+，微信自身未針對安卓4.0做播放適配，未實現安卓4.0要求的全屏API |
| 微信5.0+版本運行在MIUI系統 | 概率性出現點擊無法播放，點擊全屏按鈕以后即可播放 | 前端邏輯做了hack處理，針對微信for安卓，點擊視頻以后自動全屏播放（體驗有點仿iPhone） |
| 騰訊微博 Android版 | 安卓4.0+概率性出現視頻可以播放，但不顯示畫面，安卓2.3.*無法拉起flash，同時也不支持HTML5 | 正在跟微博跟進中 |
| 微信4.*版本在安卓4.0+系統 | 播放視頻點全屏按鈕無效 | 安卓4.0開始全屏功能需要APP響應安卓的系統接口才有效，而微信4.*版本並未實現該接口，微信在5.0才開始支持，可以使用偽全屏解決，詳見問題9 |
| 微信5.0版本在搭載MIUIV5的小米1手機上 | 全屏以后會花屏 | 微信內部邏輯處理問題，可以使用偽全屏解決，詳見問題9 |
5. 統一播放器是如何選擇當前設備應該用什么內核的播放器呢？
統一播放器在移動設備的判斷流程如下圖：
- ios設備除Mac系統以外都在html5
- PC設備，含Mac系統都走flash
- Android設備低於4.0都走flash
- Android4.0以上系統會做些矯正，QQ手機瀏覽器3.×版本和Firefox瀏覽器使用MP4鏈接。微信4.2以上版本、MIUI原生瀏覽器實際是支持HTML5但JS API返回不支持，這里做了矯正強制使用HTML5。其他瀏覽器根據canPlayType接口判斷是否支持H.264解碼，支持則使用HTML5，否則使用Flash.
5. 移動設備能在網頁里播放直播嗎？
ios的HTML5直播是使用HLS技術，該技術只有ios系統才支持，所以用chrome、safari修改userAgent模擬是看不到效果的，可能會黑屏。
安卓手機基本不支持HLS，則只能使用flash播放直播，如果您使用的安卓設備不支持flash（能安裝flash跟支持flash是兩回事），則無法播放直播節目。
那么對於安卓這個問題該怎么解決？好消息是，安卓的手機QQ瀏覽器4.2版本開始原生支持HLS，使用手機QQ瀏覽器就能播放直播，遇到這個問題，我們建議是引導用戶使用手機QQ瀏覽器。那么如果你是自己App里內嵌WebView?，希望支持直播，那么要么搞定flash，要么搞定HLS，或者直接找wwjs要騰訊視頻適合安卓的SDK開發包。
6. 移動設備播放能做到自動播放嗎？
由於移動設備系統的限制，在打開一個網頁以后，必須要用戶手動物理點擊一次才能自動播放，而且在點擊一次以后，再播放其他視頻，就可以做到自動播放不需要再點擊了。
那有沒有辦法突破呢？經過我們測試，部分iPhone設備，可以先調用video.pause()，然后再調用video.play()接口可以實現自動播放，但僅僅是部分設備有效，而且是同樣的機型、同樣的系統版本、同樣的設置，有些機器可以有些無效，初步估計可能跟越獄有關，但還不完全確認。
安卓設備上目前還沒發現可以自動播放的情況。
如果你不是在普通瀏覽器上使用統一播放器，而是自己的webview，那么其實可以在調用webview的時候設置幾個屬性，就可以打開視頻的自動播放功能：
uiWebView.allowsInlineMediaPlayback = YES; uiWebView.mediaPlaybackRequiresUserAction = NO;
微信是已經實現了自動播放接口，但需要根據域名申請權限，默認是禁止的，申請權限請聯系微信的同學。
7. 移動設備能通過接口調整音量嗎？
這個系統限制了，不能通過接口去修改音量，移動設備其實用戶很方便的使用手機側面調整音量大小。
為此，apple對限制接口做過解釋：https://developer.apple.com/library/safari/documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/Device-SpecificConsiderations/Device-SpecificConsiderations.html#//apple_ref/doc/uid/TP40009523-CH5-SW11
8. 移動設備能全屏后強制橫屏嗎？
全屏播放目前在移動設備上播放基本沒啥問題，但全屏后強制橫屏這個同樣受到系統限制，暫時還沒找到方案突破系統限制，需要用戶手動旋轉屏幕。另外，微信默認是關閉了屏幕旋轉功能的，所以在微信里全屏即使旋轉屏幕也不能橫過來，可以打開設置，以微信5.0為例：”我“->"設置"->"通用"->”開啟橫屏模式"。
9. 系統全屏和偽全屏的區別和使用場景
首先，先明確下系統全屏和偽全屏的區別。
| 系統全屏 | 偽全屏 | |
|---|---|---|
| 定義 | 在點擊視頻全屏的時候，調用瀏覽器遵循HTML5的全屏API，將播放器占滿整個屏幕 | 點擊全屏時，通過頁面的DOM元素和樣式修改播放器的尺寸，讓播放器撐大到當前頁面的100%寬度或者高度 |
| 截圖示例 |  |
 |
| 差異描述 | 控制欄和播放界面使用瀏覽器或者系統的樣式，前端不可修改，也不能增加或刪減元素，無法控制其表現 | 視頻文件播放解析是瀏覽器或系統，控制欄和播放界面使用自己通過CSS設計的樣式，可以新增或刪減元素，能看到瀏覽器的標題欄和底部的控制欄 |
為什么有偽全屏的場景？有以下幾個原因：
1. 系統全屏無法滿足需求，比如需要在全屏的時候展示視頻標題、App下載按鈕、清晰度切換等
2. 規避系統全屏的bug，我們已知有如下幾個場景：
| 設備 | 現象 | 原因 |
|---|---|---|
| 微信4.*版本在安卓4.0+系統 | 播放視頻點全屏按鈕無效 | 安卓4.0開始全屏功能需要APP響應安卓的系統接口才有效，而微信4.*版本並未實現該接口，微信在5.0才開始支持 |
| 微信5.0版本在搭載MIUIV5的小米1手機上 | 全屏以后會花屏 | 微信內部邏輯處理問題 |
可能還有我們未知的全屏問題，所以為了規避系統全屏的bug，我們可以偽全屏的形式實現。
那么是不是任何場景或者設備都能實現偽全屏呢？
| 設備或系統 | 是否可使用偽全屏 |
|---|---|
| 安卓2.3.* | √ 默認使用flash播放，由flash player負責全屏邏輯，目前未發現不能全屏的情況 |
| 安卓4.0 | √ 可以使用偽全屏 |
| iPad | √ 可以使用偽全屏 |
| iPhone、iPod Touch | × 由於系統限制，播放視頻自動進入系統全屏，所以無法使用偽全屏 |
10. iPhone、iPod全屏播放樣式能修改嗎？
iPhone、iPad播放視頻是使用的系統全屏，見問題9的詳細說明，系統全屏是系統接管，是調用的系統播放器實現的播放，所以前端不能修改其樣式和表現。