简体   繁体   English

哈克在Android上播放MP3?

[英]Hack for playing mp3 on Android?

I have a mp3 file that I want to play automatically when opening the website. 我有一个要在打开网站时自动播放的mp3文件。 On the same page, there is a button (icon) that, if clicked on, "cuts" the sound (actually pauses it) and if you click it again, the sound is played (from where it stopped) and so on... 在同一页面上,有一个按钮(图标),如果点击,“剪切”声音(实际上暂停它),如果再次点击它,播放声音(从停止的地方)等等。 。

HTML page: HTML页面:

<body>
...
...
<audio id="sound" src="<?php echo $song; ?>" autoplay="autoplay" loop="loop"></audio>
<div id="sound_button" onClick="playpause()"><img id="snd_btn" src="/images/On32.png" /></div>
...
...

JavaScript: JavaScript的:

function playpause() {
   var snd = document.getElementById("sound");
   var snd_btn = document.getElementById("sound_button");
   snd.muted = !snd.muted;
   //var snd_mut = 0;

   if(snd.muted){
      snd_btn.innerHTML = "<img src='/images/Off32.png' />";
      snd.pause();
   }
      else {
         snd_btn.innerHTML = "<img src='/images/On32.png' />";
         snd.play();
      }

   //if (snd_mut != 0) {
      //snd.innerHTML="<embed src='<?php echo $song; ?>' hidden='true' autostart='true' loop=true>";
      //snd_mut = 0;
   //}
   //else {
      //snd.innerHTML="<embed src='<?php echo $song; ?>' hidden='true' autostart='false' loop=true>";
      //snd_mut = 1;
   //}

}

In Windows, on all major browsers (IE, FF, Chrome, Opera and Safari) when opening the website everything works fine: the song that is meant to play starts automatically and can be heard (without any other action). 在Windows中,在所有主要浏览器(IE,FF,Chrome,Opera和Safari)上打开网站时,一切正常:要播放的歌曲会自动启动并且可以被听到(没有任何其他操作)。

On Android instead, both on the implicit browser of the OS and on FF and Chrome, I face the following situation: I have to click the button (as if I want to stop the sound) and then click it again (as if I want to hear it again) so that the songs starts. 在Android上,无论是在操作系统的隐式浏览器上还是在FF和Chrome上,我都面临以下情况:我必须单击按钮(好像我想要停止声音),然后再次单击它(就好像我想要的一样)再听一遍)这样歌就开始了。

I do not understand why and especially why this happens only on Android. 我不明白为什么(尤其是为什么)仅在Android上发生。 if Android hadn't supported mp3 formats, I think nothing should be heard (in spite the little "trick" described above).. 如果Android不支持mp3格式,我认为什么也听不见(尽管上面描述了“小窍门”)。

Is there any hack? 有什么黑客攻击吗? Did I miss anything or what could I do to fix the problem? 我是否错过了任何事情,或者该如何解决该问题?

Many thanks. 非常感谢。

PS. PS。 Do you think that creating and manipulating the element directly in javascript could help? 您认为直接在javascript中创建和操作元素会有所帮助吗? - although I do not know very well how to do this, either... - 虽然我不太清楚如何做到这一点,要么......

The reason is, that mobile browsers are built in such a way, that they allow such things like playing sounds or other things controlled via JS only on user action not automatically. 原因是,移动浏览器的构建方式使其仅允许在用户不自动执行用户操作的情况下允许播放声音或通过JS控制其他内容,例如播放声音或其他内容。

There is a hacky way to get around this problem, you could use a library for example "Howler.js" which uses sound sprites . 有一种解决该问题的方法,您可以使用例如使用声音精灵的 “ Howler.js”库。 So you could create a sound file with silence in the beginning. 所以你可以在开始时用静音创建一个声音文件。 Let the user click a button to visit the website on which the sound should be played. 让用户单击按钮访问应播放声音的网站。 And with the click on the button you could "initialize" the sound file. 只需单击按钮,您就可以“初始化”声音文件。 You use Howler to play one silent second of the sound sprite. 你使用咆哮来播放声音精灵中的一个静音。 At this moment the playing of the sound was a user action, with Howler you can now start the sound sprite file at any position for the desired length and it is still recognized as a user action. 此时声音的播放是用户操作,使用Howler,您现在可以在任意位置启动声音精灵文件达到所需的长度,并且仍然可以将其识别为用户操作。

I hope I could explain it so you can understand what I mean. 我希望我能解释一下,这样你才能明白我的意思。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM