简体   繁体   English

如何使 swiffy HTML5 文件中的音频在移动浏览器中播放?

[英]How to make audio in swiffy HTML5 files play in mobile browsers?

I have taken this problem to various forums, and here once (where was it blocked as off-topic).我已经把这个问题带到了各种论坛,在这里一次(它在哪里被阻止为题外话)。 It seems on-topic to me - a specific programming problem, a software algorithm, and a software tool commonly used by programmers.这对我来说似乎很切题——一个特定的编程问题、一个软件算法和一个程序员常用的软件工具。

I have a website of Flash SWF animations with sound.我有一个带有声音的 Flash SWF 动画网站。 I converted the SWF to HTML5 using Google's swiffy .我使用Google 的 swiffy将 SWF 转换为 HTML5。 On desktop PCs, using Chrome, FF and IE, there is sound, but not in Mobile Safari and Android browsers .在使用 Chrome、FF 和 IE 的台式电脑上,有声音,但在Mobile Safari 和 Android 浏览器中没有 And not in Chrome on my iPad.而不是在我 iPad 上的 Chrome 中。

The audio is embedded in the code generated by swiffy, and it looks like it's MP3 encoded in base64 (see "data:audio/mpeg;base64," and "format":"MP3" in the html).音频嵌入在由 swiffy 生成的代码中,看起来像是采用 base64 编码的 MP3(请参阅 html 中的“data:audio/mpeg;base64”和“format”:“MP3”)。

Since there is no developer forum for swiffy, and I get no replies from thefeedback form , I looked around to identify what's stopping Mobile Safari, Android browers and iPad Chrome playing the sound.由于没有 swiffy 的开发者论坛,我也没有从反馈表中得到回复,我环顾四周以确定是什么阻止了 Mobile Safari、Android 浏览器和 iPad Chrome 播放声音。 For Safari, I find things like " You cannot preload sound files " but since the sound is embedded in swiffy, there's no sound file to preload.对于 Safari,我发现诸如“ 您无法预加载声音文件”之类的内容,但由于声音嵌入在 swiffy 中,因此没有要预加载的声音文件。 Why no sound in Android and iPad Chrome, both Google products, is also a mystery.为什么Android和iPad Chrome这两款谷歌产品没有声音也是一个谜。

I imagine there's no hack that will solve the problem, if Google hasn't managed to, but insights are appreciated.我想如果谷歌没有设法解决这个问题,没有黑客可以解决这个问题,但我们很欣赏洞察力。

I know it's quite late for you but i think some people may also face the same problem and come to this post.我知道对你来说已经很晚了,但我认为有些人可能也面临同样的问题并来到这篇文章。 So I would like to offer my answer here所以我想在这里提供我的答案

As Victor said, you can use getURL to trigger sound outside.正如维克多所说,你可以使用 getURL 来触发外面的声音。 But if I use getURL, I would use Web Audio API in the javascript side.但是如果我使用 getURL,我会在 javascript 端使用 Web Audio API。 Because using Web Audio API, it is possible to play multi tracks simultaneously in mobile.因为使用 Web Audio API,可以在移动设备中同时播放多首曲目。 I intergrated library SoundJS to my project.我将库 SoundJS 集成到我的项目中。

However, as you have to change every audio frame into a getURL function, it actually costs you quite a lot of time.但是,由于您必须将每个音频帧更改为 getURL 函数,因此实际上会花费您相当多的时间。 I found another optional idea that you can just edit the swiffy core once and for all, which use native audio object (but it also mean you can only play one sound at a time in mobile).我发现了另一个可选的想法,您可以一劳永逸地编辑 swiffy 核心,它使用原生音频对象(但这也意味着您一次只能在移动设备中播放一种声音)。

originally, swiffy creates native audio object to play base64 encoded sound.最初,swiffy 创建原生音频对象来播放 base64 编码的声音。 Because of the mobile limitation, it's silent if the sound is not triggered by an input event.由于移动设备的限制,如果声音不是由输入事件触发,则它是无声的。 However it's possible to reuse an active audio object.但是,可以重用活动的音频对象。

First, I have a button to start the animation,which also create an audio object and play it (with a zero length base64 encoded sound);首先,我有一个按钮来启动动画,它还创建一个音频对象并播放它(使用零长度的 base64 编码声音);

audio = new Audio("data:audio/mpeg;base64,");
audio.play();

in swiffy core script, search keyword "new Audio", you will see the part that swiffy plays sound.在 swiffy 核心脚本中,搜索关键字“新音频”,您将看到 swiffy 播放声音的部分。 Instead of createing a new audio object, make swiffy use your old audio object不要创建新的音频对象,而是使用旧的音频对象进行 swiffy

audio.src = a.sound;
audio.play();

After that, without revising, your swf should be able to play sound even in mobile.之后,无需修改,您的 swf 应该甚至可以在移动设备中播放声音。

However, as it's quite like a hack.然而,因为它很像一个黑客。 It may get some unexpected problem它可能会遇到一些意想不到的问题

You can communicate the swiffy flash with the main HTML file so, inside actionscript, you can send a getURL call to javascript where you have a hidden html5 mp3 player, something like:您可以将 swiffy flash 与主 HTML 文件进行通信,因此,在 actionscript 中,您可以向具有隐藏 html5 mp3 播放器的 javascript 发送 getURL 调用,例如:

getURL("Javascript:playSound();");

In HTML, inside the javascript function, something like:在 HTML 中,在 javascript 函数中,类似于:

 <audio controls>
 <source src="test.ogg" type="audio/ogg">
 <source src="test.mp3" type="audio/mpeg">
 </audio> 

I'm still working in this but I hope this help you.我还在这方面工作,但我希望这对你有帮助。

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

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