音频在HTML中的音频标签不加载 [英] Audio not loading in HTML's audio tag

查看:219
本文介绍了音频在HTML中的音频标签不加载的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我测试音频HTML标记。

I'm testing the audio HTML tag.

和它正在我的测试ENV,但由于某种原因不能在我的生产ENV。

And it is working on my testing env, but for some reason not on my production env.

我简单地使用:<音频SRC =/沙箱/请将test.mp3控制=控制>< /音频>

测试站点是在Windows和生产现场是在Linux上,但应该让我觉得任何区别。

The testing site is on Windows and the production site is on Linux, but that should make any difference I think.

所以我知道这是在正确的地方,我可以下载的曲目。

I can download the track so I know it is in the right place.

生产网址是: http://pieterhordijk.com/sandbox

如前所述完全相同的code工作在测试网站。

As stated the exact same code works on testsite.

任何人有任何想法,为什么它不会加载我的音乐?

Anybody has any idea as to why it doesn't load my audio?

PS

我使用的测试:

的Chrome 11.0.696.68

Chrome 11.0.696.68

修改

现在我在Chrome 13(金丝雀版本)和MP3负载。

Now I'm on Chrome 13 (Canary Build) and the MP3 loads.

但WAV只加载第一秒。

But the WAV only loads the first second(s).

推荐答案

http://pieterhordijk.com/沙盒/请将test.mp3 是担任音频/ MPEG,这是很好的。然而,当我使用Opera下载它,它出来损坏出于某种原因,我不能把它添加到Foobar的的播放列表或任何东西。但是,它确实精细下载用wget,这样可能只是在Opera的问题或一些时髦的服务器会为歌剧。以&lt加载MP3;音频>在Opera不工作,当然无论如何,因为Opera不支持该格式。

http://pieterhordijk.com/sandbox/test.mp3 is served as audio/mpeg, which is good. However, when I download it with Opera, it comes out corrupted for some reason and I cannot add it to Foobar's playlist or anything. But, it does download fine with wget, so that may just be an issue with Opera or something funky the server gives to Opera. Loading the mp3 with <audio> doesn't work in Opera of course anyway since Opera doesn't support that format.

http://pieterhordijk.com/sandbox/test.ogg 是担任音频/ OGG,这是很好的。而且,它也包含Vorbis格式,而不是现在的FLAC(因为你固定它)。它不会在Opera玩远程的,但如果我下载的文件,并在Opera打开本地正常播放。它在Foobar的也没关系。

http://pieterhordijk.com/sandbox/test.ogg is served as audio/ogg, which is good. And, it also contains vorbis now instead of flac (since you fixed it). It won't play in Opera remotely, but plays fine if I download the file and open it in Opera locally. It plays in Foobar fine too.

http://pieterhordijk.com/sandbox/test.oga 供应与错误MIME类型。它为text / plain的,但应担当的音频/ OGG(你可以在.htaccess解决这个问题)。但是,它确实含有Vorbis和可播放与Foobar的。另外,这不会在远程播放歌剧。但是,如果我下载它,并在Opera打开本地,它起着没有问题的。

http://pieterhordijk.com/sandbox/test.oga is served with the wrong mime type. It's served as text/plain, but should be served as audio/ogg (you can fix this in .htaccess). But, it does contain vorbis and is playable with Foobar. Again, this one won't play remotely in Opera. But, if I download it and open it in Opera locally, it plays no problem.

http://pieterhordijk.com/sandbox/test.wav 是担任音频/的X WAV,这是很好的。但是,因为它是30.9MB大小和播放可能会很可怕,除非它完全被取的wav文件不是流接受。这其中确实在Opera远程至少玩了。

http://pieterhordijk.com/sandbox/test.wav is served as audio/x-wav, which is good. But, the wav file isn't acceptable for streaming since it's 30.9MB in size and playback can be horrible unless it's fully been fetched. This one does play in Opera remotely at least.

然而,事情在我的网站正常工作。请参见 http://shadow2531.com/opera/testcases/plugins/temp/ peehaa / test_audio_vorbis.html 。您的OGA文件中戏没问题起到它应该回落到MP3对于不支持Vorbis格式的UA。

However, things work fine on my site. See http://shadow2531.com/opera/testcases/plugins/temp/peehaa/test_audio_vorbis.html. Your oga file plays in Opera no problem and it should fall back to the mp3 for UAs that don't support Vorbis.

随着中说,它看起来像它的东西与你的服务器是如何提供的文件。我注意到,唯一的区别是,你的服务器发送一个有所不同:Accept-Encoding头。但是,不知道这是原因还是不行。

With that said, it seems like it's something with how your server is serving up the files. The only difference I noticed is that your server is sending a Vary: Accept-Encoding header. But, not sure if that's the cause or not.

现在,因为你会从我的测试页面看到,它的使用:

Now, as you'll see from my test page, it's using:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        <p>
            <audio controls width="300">
                <source src="test.oga" type='audio/ogg; codecs="vorbis"'>
                <source src="test.mp3" type="audio/mpeg">
                <a href="test.oga">test.oga</a>
                <a href="test.mp3">test.mp3</a>
            </audio>
        </p>
    </body>
</html>

这是你如何能回落到其他类型。见<一href=\"http://www.whatwg.org/specs/web-apps/current-work/multipage/the-iframe-element.html#the-source-element\" rel=\"nofollow\">http://www.whatwg.org/specs/web-apps/current-work/multipage/the-iframe-element.html#the-source-element获取更多信息。如果MP3和Vorbis是不够的,你可以在MP4 / M4A容器作为另一个后备补充AAC音频。

That's how you can fall back to other types. See http://www.whatwg.org/specs/web-apps/current-work/multipage/the-iframe-element.html#the-source-element for more info. If mp3 and vorbis are not enough, you could add aac audio in an mp4/m4a container as another fallback.

这篇关于音频在HTML中的音频标签不加载的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆