小程序转app ios Android 视频播放

问题:uniapp uni.previewMedia 只支持微信 鸿蒙 OS 版不支持 ios 和 android

使用HTML5 Plus 原生开发 plus.video 解决当前问题

HTML5 Plus地址

https://www.html5plus.org/doc/zh_cn/video.html

import { ref } from 'vue'; let videoInstance = null // 视频实例 let currentWebview = null // DOM let view = null let videoCtx = ref(null) /** * ios Android 视频播放 * @param {string} url 视频地址 */ export async function handleVideoReady(url) { try { if (view) { // 清空之前视频实例 await closeDom() } const pages = getCurrentPages(); const page = pages[pages.length - 1]; currentWebview = page.$getAppWebview(); videoInstance = plus.video.createVideoPlayer('videoplayer', { src: url, top: '0', left: '0', width: '100%', height: '100%', position: 'static', autoplay:true, 'show-loading':true, // 加载视频时是否展示loading 'how-play-btn':false, // 是否显示视频底部控制栏的播放按钮 }); // 最重要的一步, 挂载在页面上 currentWebview.append(videoInstance); // 在视频上方创建一个按钮 view = new plus.nativeObj.View('button', { top: '50px', left: '0', width: '100px', height: '44px' }, [{ tag: 'font', id: 'text', text: '< 关闭', textStyles: { color: '#ffffff', size: '20px', weight: 'bold' } }]); view.addEventListener("click", onClick, false); // 关闭方法 currentWebview.append(view); videoInstance.play() // 播放 } catch (e) { console.log(e, "err::错误信息"); } } const onClick = () =>{ videoInstance.close() // 关闭视频画面 videoInstance = null view.close(); // 关闭控件 } // 关闭视频画面 export async function closeDom () { if(view) { view.close(); // 关闭控件 view = null } }