一般是瀏覽器里禁用,進入瀏覽器設(shè)置找到隱私或高級或擴展功能,再找到j(luò)s并開啟即可。具體要看是哪個瀏覽器里提示,不同瀏覽器操作也略有不同。

專注于為中小企業(yè)提供成都網(wǎng)站設(shè)計、做網(wǎng)站服務(wù),電腦端+手機端+微信端的三站合一,更高效的管理,為中小企業(yè)貴德免費做網(wǎng)站提供優(yōu)質(zhì)的服務(wù)。我們立足成都,凝聚了一批互聯(lián)網(wǎng)行業(yè)人才,有力地推動了近1000家企業(yè)的穩(wěn)健成長,幫助中小企業(yè)通過網(wǎng)站建設(shè)實現(xiàn)規(guī)模擴充和轉(zhuǎn)變。
在安卓手機上,使用video播放視頻有個問題,video控件層級會永遠在頂層,不利于視頻互動H5開發(fā),而IOS手機上不會有此問題。
video src="" x5-video-player-type="h5"/
x5-video-player-type="h5"? ?只適用于微信瀏覽器
注意:
1.jsmpeg 需要將視頻轉(zhuǎn)為.ts的文件
?先安裝ffmpeg,然后執(zhí)行以下命令,將mp4格式的文件轉(zhuǎn)成 .ts(用命令行轉(zhuǎn)的才能正常播放)
ffmpeg -i video.mp4 -f mpegts -codec:v mpeg1video -codec:a mp2 out.ts(文件的路徑不太好找,建議全局搜索一下)
2.安卓上使用jsmpeg插件渲染canvas,ios上正常使用video并加入隱藏控制條等設(shè)置
3. ? ?請使用此js,原作者的js沒有回調(diào)設(shè)置
4. ? 原作者github地址
!DOCTYPE html
html lang="en"
head
meta charset="UTF-8"
titleJSMpegPlayer/title
meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0"
style
html,body{
? ? padding: 0;
? ? margin: 0;
}
.msg-wrap{
? ? position: fixed;
? ? top: 0;
? ? left: 0;
? ? background: #fff;
? ? border: 1px solid #000;
}
.video-wrap{
? ? width: 100%;
? ? display: none;
}
/style
/head
body
video class="video-wrap" id="video-ios" x5-playsinline webkit-playsinline playsinline src="1_BG_4s_2.mp4"/video
canvas class="video-wrap" id="video-android"/canvas
div class="msg-wrap" id="msgTxt"loading.../div
script src=""/script
script
? ? var msgTxt = document.getElementById('msgTxt');
? ? var video = document.getElementById('video-ios');
? ? var canvas = document.getElementById('video-android');
? ? //檢測是否為非安卓瀏覽器并作處理
? ? var check = !! navigator.userAgent.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
? ? if(check){
? ? ? ? msgTxt.innerHTML = "not Android mode"
? ? ? ? video.style.display="block"
? ? ? ? video.play()
? ? ? ? //監(jiān)聽video加載完成
? ? ? ? video.addEventListener("loadedmetadata",function(){
? ? ? ? ? ? msgTxt.innerHTML = "not Android mode:videoPlaying"
? ? ? ? })
? ? ? ? //監(jiān)聽video播放結(jié)束
? ? ? ? video.addEventListener("ended",function(){
? ? ? ? ? ? msgTxt.innerHTML = "not Android mode:videoEnd"
? ? ? ? })
? ? }else{
? ? ? ? // jsmpegPlay(canvas,'1_BG_4s_5.ts',startCallBack,playingCallBack,endCallBack)
? ? ? ? jsmpegPlay(canvas,'out.ts',startCallBack,playingCallBack,endCallBack)
? ? }
? ? function jsmpegPlay(Vcanvas,vVideo,startFun,playingFun,endFun) {
? ? ? ? var player = new JSMpeg.Player(
? ? ? ? ? ? vVideo ,{
? ? ? ? ? ? ? ? canvas: Vcanvas,
? ? ? ? ? ? ? ? loop: false,
? ? ? ? ? ? ? ? autoplay: true,
? ? ? ? ? ? ? ? startSign: true,
? ? ? ? ? ? ? ? startCallBack: startFun,
? ? ? ? ? ? ? ? playingCallBack: playingFun,
? ? ? ? ? ? ? ? endCallBack: endFun
? ? ? ? ? ? });
? ? }
? //視頻開始播放(即解碼完成)執(zhí)行
? ? function startCallBack() {
? ? ? ? msgTxt.innerHTML = "Android mode:videoPlaying"
? ? ? ? canvas.style.display="block"
? ? }
? ? //視頻播放進度
? ? function playingCallBack(currentTime) {
? ? ? ? // console.log(currentTime)
? ? }
? ? //視頻播放完成執(zhí)行
? ? function endCallBack() {
? ? ? ? msgTxt.innerHTML = "Android mode:videoEnd"
? ? }
/script
/body
/html
項目中遇到的坑,把使用方法記錄一下
在線演示DOMO
JSMpegPlayer
github地址,歡迎小星星~~~
1、設(shè)置webview對js的支持
2、在html中添加 evaluateNativeToJS 方法
3、在Android中調(diào)用 evaluateNativeToJS 方法
1、創(chuàng)建js調(diào)用的接口(添加js要調(diào)用的方法 evaluateJsToNative)
2、設(shè)置webview對js的支持
3、js調(diào)用 evaluateJsToNative方法
onclick="window.Android.show()"
你的語法寫錯了,js調(diào)用Android要用window.TAG
這個TAG就是
webView.addJavascriptInterface(new Object(), TAG); // 設(shè)置javaScript可用于操作Activity類
看你的代碼,你傳遞了一個Android
因此你的js里應(yīng)改成window.Android.show();
當(dāng)前名稱:javascript安卓,javascript安卓范例
URL網(wǎng)址:http://chinadenli.net/article5/dsgcpii.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供品牌網(wǎng)站制作、App開發(fā)、做網(wǎng)站、網(wǎng)站制作、品牌網(wǎng)站設(shè)計、移動網(wǎng)站建設(shè)
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)