在 android 浏览器中播放 html5 音频

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/3069124/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-20 08:34:09  来源:igfitidea点击:

Playing html5 audio in android browser

javascriptiphoneandroidaudiohtml

提问by Anders Sundnes L?vlie

I have a javascript that plays audio in the browser, using the html5 <audio>tag. It works fine in the iPhone browser, but not in Android. (Testing using a htc desire with android 2.1.) Anyone know why?

我有一个使用 html5<audio>标签在浏览器中播放音频的 javascript 。它在 iPhone 浏览器中运行良好,但不适用于 Android。(使用 android 2.1 的 HTC 欲望进行测试。)有人知道为什么吗?

My code:

我的代码:

   function playHTML5(sound, soundcv){
                // sound = url to m4a audio file
                // soundcv = div in which the audioplayer should go

  var audio = document.createElement('audio');
  audio.src = sound;
  audio.controls = "controls";
  if (currentSound != null){
   soundcv.replaceChild(audio,currentSound);
  } else {
   soundcv.appendChild(audio);
  }
  currentSound = audio;
 }

By the way, I am also trying to enlarge the audio button that shows up in the iphone (the default one is quite small), with no luck so far - would be grateful for any ideas!

顺便说一句,我还试图放大 iphone 中显示的音频按钮(默认按钮非常小),到目前为止还没有运气 - 如果有任何想法,我们将不胜感激!

回答by Pierre-Antoine LaFayette

The latest Android browser in FroYo does not yet support the HTML5 audio element. This is not a bug, rather a feature that has yet to be implemented. It may come in Gingerbread.

FroYo 中最新的 Android 浏览器尚不支持 HTML5 音频元素。这不是错误,而是尚未实现的功能。它可能来自姜饼。

Update: The Gingerbread browser has the audio element.

更新:姜饼浏览器具有音频元素。

回答by Slavik

Here is link to Google Android bug, which filed for lack of support of AUDIO tag in Android. Please, vote on it.

这是谷歌 Android 错误的链接,该错误因在 Android 中缺乏对 AUDIO 标签的支持而提交。请投票吧。

http://code.google.com/p/android/issues/detail?id=10546

http://code.google.com/p/android/issues/detail?id=10546

BTW, there is work around, which let you play natively MP3 in Android 1.6 .. 2.2, like that:

顺便说一句,有变通办法,可以让您在 Android 1.6 .. 2.2 中本地播放 MP3,如下所示:

<video src="test.mp3" onclick="this.play();"></video>

回答by Rick

I cannot figure this out either. BUT, this test page created by Apple plays HTML5 audio on the Android: http://www.apple.com/html5/showcase/audio

我也想不通。但是,这个由 Apple 创建的测试页面在 Android 上播放 HTML5 音频:http: //www.apple.com/html5/showcase/audio

how did apple do it?

苹果是怎么做到的?

回答by Jla

Have you checked your audio format?

你检查过你的音频格式吗?

回答by Kevin

I was having trouble on my Kindle Fire, and found one small thing which seemed to fix it.

我在 Kindle Fire 上遇到了问题,发现了一件似乎可以解决问题的小东西。

<audio>
  <source src="someclip.mp3" type="audio/mpeg" />
</audio>

I had mistakenly been using "audio/mp3". I'm using a player without its native controls (using HTML5/JS).

我错误地使用了“音频/mp3”。我正在使用没有本机控件的播放器(使用 HTML5/JS)。

回答by gavD_UK

I got this working on a project using trigger.iodeploying to a Nexus 7 running Android Jellybean, but the audio only plays if I use absolute URLs at the moment. I'm not sure what the relative path is yet to use audio from within my project, but hopefully this will help somebody out...

我在一个项目上使用trigger.io部署到运行 Android Jellybean 的 Nexus 7,但音频仅在我目前使用绝对 URL 时播放。我不确定在我的项目中使用音频的相对路径是什么,但希望这会对某人有所帮助......

(function() {

    var currentSound;
    // I have a div called "page"
    var soundcv = document.body;

    // This only works for one sound for simplicity's sake
    function playSound(sound){

        if (currentSound == null){
            var audio = document.createElement('audio');
            audio.src = sound;
            soundcv.appendChild(audio);
            currentSound = audio;
        }

        currentSound.play();
    }

    // This isn't a real audio file URL - replace it with one of your own
    playSound('http://example.com/example.mp3');
})();

回答by Robert Beltran

I've been tinkering all day on this and I finally got mine to work on my old Samsung Droid browser with the yahoo webplayer:

我一整天都在修补这个问题,我终于让我的老三星 Droid 浏览器和雅虎网络播放器一起工作了:

<a href="somefolder/file.mp3"></a>
<script type="text/javascript" src="http://webplayer.yahooapis.com/player.js"></script>

Works great puts a little arrow icon next to the text that you can click to play your mp3. Thanks Yahoo.

效果很好,在文本旁边放了一个小箭头图标,您可以单击它来播放 mp3。谢谢雅虎。

I forgot to mention that the audio does NOT show up in my Chrome or Firefox browser when testing this locally. Works great on my phone browser though.

我忘了提到在本地测试时音频没有显示在我的 Chrome 或 Firefox 浏览器中。不过在我的手机浏览器上效果很好。

回答by Nikos

I know this is a hack, but it works everywhere (as far as I know)!

我知道这是一个黑客,但它在任何地方都有效(据我所知)!

You can use the video element and convert your mp3s into mp4 and ogg files (ogg for firefox on android). You could also style it so it doesn't display any uneccesary default players. See code below:

您可以使用 video 元素并将您的 mp3 转换为 mp4 和 ogg 文件(ogg for firefox on android)。您还可以设置样式,使其不显示任何不必要的默认播放器。见下面的代码:

<video id="audioTest" width="1" height="1" style="top: -100px; left: -100px; position: absolute;" preload >
    <source src="audio.mp4" type="video/mp4">
    <source src="audio.ogv" type="video/ogg">
</video>

You could then play it in your js code using:

然后,您可以使用以下方法在您的 js 代码中播放它:

var audioTest = document.getElementById("audioTest");
audioTest.addEventListener("ended",onSoundComplete,false);
audioTest.play();