东台猛甘教育咨询有限公司

微信視頻是我在開發(fā)一個微信網(wǎng)站的時候遇到的一個問題，相信有很多人遇到過，所以記錄一下，方便下次遇到類似的問題時可以快速排查。

根據(jù)客戶要求，一個頁面里的視頻要求不影響頁面加載速度，頁面加載以后就要播放，播放完畢以后要把視頻隱藏掉。覺得沒有啥問題，就和客戶說可以了，然后就可是寫。

為了不影響網(wǎng)頁加載速度，使用了js把視頻video插入頁面，然后寫了一個監(jiān)控，播放視頻，等視頻播放完畢，在把視頻隱藏，一切看起來很完美，本地測試也沒有問題，線上測試也很好，可是發(fā)給客戶就不行了，頁面加載視頻不播放，點(diǎn)擊視頻播放直接全屏播放，而且播放過程中視頻還會遮擋到別的彈窗。和客戶溝通了半天，才知道客戶是直接在微信中打開的，知道了以后直接先百度問題，隨便找了一個，用同事的果X看了一下，除了不能自動播放，其他的都沒有問題了，然后繼續(xù)上網(wǎng)找答案，偶然發(fā)現(xiàn)微信官方文檔里面說，視頻播放必須要點(diǎn)擊動作才能觸發(fā)播放，無奈，和客戶溝通了一下，等待客戶反饋。結(jié)果是安卓手機(jī)全屏播放，會遮擋彈窗，蘋果手機(jī)已經(jīng)正常了。

說到這的時候，有一點(diǎn)小奔潰了，查看了官方文檔《X5內(nèi)核視頻之問答匯總》X5內(nèi)核視頻在用戶點(diǎn)擊后默認(rèn)會進(jìn)入全屏播放，前端可以設(shè)置video的x5-playsinline屬性來將視頻限定于網(wǎng)頁內(nèi)部播放，這個說的很詳細(xì)，

按照文檔處理了一下，用自己的安卓手機(jī)試了一下，沒毛病，同事卻反饋蘋果不行了。當(dāng)時就傻眼了，返回仔細(xì)看了一下文檔，才發(fā)現(xiàn)安卓和蘋果是有區(qū)別的，安卓用的是X5瀏覽器內(nèi)核，蘋果的不是，無奈，只好在js里加了一個判斷，判斷用戶手機(jī)是蘋果還是安卓的，分開操作。再次測試，兩端都通過了，終于舒了一口氣。


代碼先貼出來，寫的比較糙,歡迎大家批評指點(diǎn)