Open mishe opened 7 years ago
// 问题来由:公司小伙伴制作最近的一个活动页面,通过手机的摇一摇事件,然后调取接口展示结果,同时播放一段MP3;
html 页面代码:
<audio id="Music" src="<%= $.getStaticOrgin()%>/yaowang/dist/music.mp3" style="display: none;"></audio>
JavaScript 代码:
audio = document.getElementById("Music"), audio.play();
在chrome模拟器和手机端浏览器及微信中,都可以正常的工作,正常的播放MP3
但页面内嵌app的webview中后,MP3并没有声音出现;
搜索百度google并没有发现现成解决方案;
但也有所启发,似乎只要给audio标签增加controls属性,让audio控制器显示在页面中,然后可以被手工点击播放。
然后的操作就是给audio绑定click事件,但摇一摇触发后,js通过trigger 触发audio的click
大前提是webview 把mediaPlaybackRequiresUserAction 设置为false
http://fqk.io/issues-of-audio-video-in-webview/
// 问题来由:公司小伙伴制作最近的一个活动页面,通过手机的摇一摇事件,然后调取接口展示结果,同时播放一段MP3;
html 页面代码:
JavaScript 代码:
在chrome模拟器和手机端浏览器及微信中,都可以正常的工作,正常的播放MP3
但页面内嵌app的webview中后,MP3并没有声音出现;
解决方案
搜索百度google并没有发现现成解决方案;
但也有所启发,似乎只要给audio标签增加controls属性,让audio控制器显示在页面中,然后可以被手工点击播放。
然后的操作就是给audio绑定click事件,但摇一摇触发后,js通过trigger 触发audio的click