摘要:做開發的童鞋應該都遇到過低版本安卓以下安卓微信上播放視頻之后就會有一堆廣告呈現在你面前。但是嚴重影響了視頻的體驗感。這完美地將安卓微信播放器的廣告屏蔽掉了。
做H5開發的童鞋應該都遇到過低版本(安卓6.0以下)安卓微信上播放video視頻之后就會有一堆廣告呈現在你面前。
每次瞪著騰訊自己出來的H5產品,五花八門的視頻!重點是還解除了廣告的限制。簡直是恨!!!!這么專制真的好嗎?哈哈,泄憤。
參考了很多視頻類型的H5代碼,比較牛的是把mp4按幀數轉成jpg圖片,然后通過createjs將幀圖片的播放來達到視頻的效果!
頻轉出來都是上千張圖片,即使每一張只有幾K的大小,但是如果需求較大(比如需要播放三四個視頻),全部圖片加起來就會有幾十M。
這對于一個H5來說是不能忍的!這也是小編我入坑的地方。
天真的我應客戶要求升級了寬帶,現在就想拿一塊板磚敲死自己啊!
在客戶一而再,再而三地強調加載速度情況下,我試圖將圖片分開加載,盡管這對于首頁加載是有利的。
但是嚴重影響了視頻的體驗感。而且經常出現音面對不上的情況,這把客戶激怒了,也把小編逼瘋了(視頻不能少,還要順暢)。
就在這時……
在這個夜黑風高,凌晨半夜的時間
你以為會有什么事情發生嗎?No~~~并沒有美女大哭
因為這個需求的特殊性,偶然讓我發現了‘新大陸’。
我發現微信視頻和音頻是同一個播放器的!而且可以用音頻去頂掉視頻!
這……這……發現這個的時候我是跳起來的
就順著這個思路,我去下載了一段什么空白的mp3——時間最好比1S稍微長一點,小編發現1S的音頻太短,視頻播放器并不會自動退出。
然后video在ended和pause狀態時,就將音頻play。這完美地將安卓微信播放器的廣告屏蔽掉了。并自動跳到你想要的頁!
$("#video").on("ended pause", function () { $("#music").play(); //空白mp3; });
小編親測!
不過安卓6.0以上這個標簽已經非常類似IOS了!所以6.0以上表現出來的畫面是跟蘋果一樣的!
通過上面的處理方式,在視頻不用加載的情況下,整個H5的大小瞬間變成不到3M,相對于原來處理方式的22M,有坐上了火箭去旅行的感覺。客戶體驗瞬間爆炸,連忙稱贊!
有問題可以留言咨詢哦!么么噠~~~
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/86500.html
摘要:和部分組件表現的差異微信最小化后正在播放的會暫停,需要再次點擊播放按鈕,如果視頻設置的是不可控,沒有開始播放按鈕,視頻暫停了就無法繼續播放了,沒有該問題。 1、原生組件的層級問題 video、canvas、camera等原生組件層級最高,其他組件無論z-index為多少,都無法覆蓋在原生組件上。 這里拿video組件做示例,如果需要點擊視頻支持微信開放能力,例如授權手機號,獲取用戶信息...
摘要:然而我真的太天真,微信瀏覽器怎樣會讓你這樣好過問題集中于自動播放視頻這塊,需求很簡單自動播放全屏不顯示工具條自動播放一步步來,自動播放這個問題在十分肯定默認是不支持的,必須基于用戶操作下才能加載視頻。至于在微信下和一個樣。 某天收到舊同事的信息說希望我幫手做一下一個簡單的H5,然后我看了看的確很簡單: 就是圖片滾動到最后自動播放視頻,播完顯示個按鈕交互。 然而我真的太天真,微信瀏覽器怎...
閱讀 1762·2021-11-24 09:39
閱讀 1551·2021-11-16 11:54
閱讀 3497·2021-11-11 16:55
閱讀 1655·2021-10-14 09:43
閱讀 1445·2019-08-30 15:55
閱讀 1233·2019-08-30 15:54
閱讀 3421·2019-08-30 15:53
閱讀 1338·2019-08-30 14:18