背景：
在維護公司內(nèi)播放器組件的過程中中贝，被業(yè)務方反饋了一個問題：在iphone 13 / iOS 15.0.1環(huán)境的webview中播放器播放異常。異常表現(xiàn)為：正常播放直播流(HLS/m3u8)時簸淀，有聲音寄啼，封面不消失，無視頻展示盖呼。
嘗試路徑
-
以業(yè)務方播放器配置蠢挡，嘗試穩(wěn)定復現(xiàn)
- 在 iphone 其他機型上(非 iOS 15下)測試弧岳，表現(xiàn)正常凳忙。
- 在 iOS 15.4上測試，表現(xiàn)正常禽炬。
- 在安卓機型上測試涧卵，表現(xiàn)正常。
- 在iOS 15.0.1 上腹尖，穩(wěn)定復現(xiàn)柳恐。
移除播放器多余配置后(隱藏修改)，嘗試播放直播流桐臊。發(fā)現(xiàn)靜音狀態(tài)下胎撤，可以正常播放。
-
調(diào)試之前靜音起播流程断凶。
a. 科普一個知識：web瀏覽器對于音視頻的播放策略正朝著更嚴格的方向進展 相關文檔??
常規(guī)通過使用 Video 的靜音起播來繞過瀏覽器對視頻的限制伤提。但是即便有了繞過方案，仍舊會有一些機型例如 三星S6认烁，播放失效肿男。
b. 調(diào)試靜音起播流程正常。
-
調(diào)試流程中發(fā)現(xiàn)一些促使重繪的手段可以強制視頻正常展示却嗡。(例如切出App舶沛、跳轉(zhuǎn)到其他view再調(diào)回)。嘗試對播放器DOM 進行重繪嘗試窗价。
a. 科普另一個知識：如何促使瀏覽器的重繪和重排 相關文檔?? 相關文檔2??
b. 對分層結構進行修改嘗試后如庭，發(fā)現(xiàn) Video 標簽的重繪后可在視頻加載后，強制渲染視頻首幀撼港，并且促使視頻正常播放坪它。 至此，我以為我解決了問題帝牡。興致勃勃的和業(yè)務方進行溝通往毡，但是得到的回復是 ==> 只有第一幀，不符合預期靶溜。對比了一下積木的配置和我本地的配置开瞭，發(fā)現(xiàn) Video 上的人畜無害 poster屬性，竟然會有意想不到的影響罩息？嗤详？？ 然后我以上面的一些debug思路進行搜索扣汪，找到了一下的問題答案断楷。
解決方案
核心參考: 蘋果開發(fā)者論壇回復
課代表畫一下重點：
在 iOS 15系統(tǒng)的某些版本里，<video>標簽的 poster屬性會有展示上的問題崭别，會在播放HLS視頻的時候有影響冬筒。
總結了一下網(wǎng)友們的熱心回復(會有一些hack的方式)：
- CSS hack
- 講 Video 標簽的position 定位為絕對值。
- 為 Video 標簽設置非透明的背景顏色茅主。
- video 屬性
- 為video標簽設置 playinline autoplay muted loop(直播)舞痰。
- 自定義實現(xiàn) poster。
最后诀姚，以在特定機型繞過原生poster設置响牛，以及設置全必需的屬性繞過了本異常。
希望本經(jīng)驗會對你開發(fā)有所幫助赫段。以上呀打。
