无法使HTML5audio标签在移动浏览器上正常工作

我有一个使用HTML5 <audio>标记的web应用程序，出于某种原因，它在Windows和Mac电脑上运行良好，但在iOS和Android上无法使用。 这是我的代码的相关片段：

使用Javascript：

 var audioElement = document.querySelector('#audioplayer'); var source = document.querySelector('#mp3'); source.src = tokObject._url; audioElement.load(); audioElement.play(); 

HTML：

 <center> <audio id="audioplayer" style="width:480px;"> <source id="mp3" src="random-placeholder" type="audio/mp3" /> </audio> </center> 

Answer 1

您通常无法在移动设备上自动播放audio或video文件，这通常受到Android和iOS等操作系统的限制，无法停止网站下载大量媒体文件并自动对其进行自动播放。

如果这样的代码是从一个点击或触摸处理程序中调用，它可能会工作，但不是你正在做的方式。

此外， <center>元素已被弃用，您不应该再使用它了。

Answer 2

不知道这是否有帮助，但我做了这个，而它为我工作。 虽然我不是在播放MP3，但我得到一个声音来提示用户循环播放。

 function speak(text) { var msg = new SpeechSynthesisUtterance(); var voices = speechSynthesis.getVoices(); msg.voice = voices[2]; msg.voiceURI = 'native'; msg.volume = 1; msg.rate = 1; msg.pitch = 1; msg.text = text; msg.lang = 'en-US'; speechSynthesis.speak(msg); } 

/ /插入这个底部位来调用该函数，它会读取移动设备的本地语音你inputie ….rest工程上的Android还没有尝试iPhone。

说话（ 'rest'）;

Answer 3

你有没有尝试过这样做：

 var aud=new Audio(file.mp3); aud.play();