是什么选项有跨浏览器兼容的音频？ [英] What Options Are There for Cross-Browser Compatible Audio?

问题描述

我使用这个功能：

function playSound(file) {

MyAudio = new Audio(file);
MyAudio.play();

}

不幸的是，我苦苦寻找的文件类型将在所有的浏览器。在Chrome，Safari浏览器，IE浏览器的MP3作品，但不是FF和Opera，而.OGG文件似乎只在FF工作。

Unfortunately, I'm struggling to find a file type which will work in all browsers. Mp3 works in Chrome, Safari, IE but not FF and Opera, while .ogg files only seem to work in FF.

任何建议，解决的办法？我presume不存在编程检测正在使用的浏览器，然后播放相应的文件类型的方式？任何建议/想法AP preciated。谢谢你。

Any suggestions as to a way around this? I presume there is no way of programmatically detecting which browser is being used and then playing the appropriate file type? Any advise/ideas appreciated. Thanks.

推荐答案

无奈，没有普遍可玩的类型。 WAV最接近，但它是相当大的，并在IE9不支持。你需要有多种类型可用，并选择一个类型的浏览器可以播放。

Frustratingly, there is no universally playable type. WAV comes closest, but it is quite large and is not supported in IE9. You'll need to have multiple types available and choose a type the browser can play.

要做到这一点，使用特征检测，而不是浏览器检测。媒体类型，每个浏览器支持会随着时间的推移让你的code假定火狐无法播放MP3的变化，很可能会从现在已经过时了几年，当Mozilla的采用它（专利到期后）。使用 canPlayType ，这表明是否支持给定的格式：

To do this, use feature detection, not browser detection. The media types that each browser supports will change over time, so your code that assumes Firefox can't play MP3 will probably be outdated a few years from now, when Mozilla adopts it (after the patents expire). Use canPlayType, which indicates if a given format is supported:

var audio = new Audio();
if(audio.canPlayType("audio/mpeg") == "probably") {
    playSound("myMedia.mp3");
} else if(audio.canPlayType("audio/webm") == "probably") {
    playSound("myMedia.webm");
}
// do checks for other types...

另外，如果你正在写的音频标记为HTML，您可以使用多个＆lt;信源＆GT; 标签，浏览器将扮演第一个它可以：

Also, if you are writing the audio tag as HTML, you can use multiple <source> tags, and the browser will play the first one it can:

<audio controls="controls">
    <source src="mymedia.ogg" type="audio/ogg" />
    <source src="mymedia.mp3" type="audio/mpeg" />
    Update your browser! This sentence is fallback content for browsers that do not support the audio element at all.
</audio>

如果你想测试OGG音频的支持，你可能想测试的Ogg Vorbis明确。奥格是可以假设使用其他codeCS 除了Vorbis和Theora格式（例如，作品格式）。可以测试的Ogg Vorbis，像这样：

If you want to test for Ogg audio support, you probably want to test for Ogg Vorbis specifically. Ogg is a "container" format that can hypothetically use other codecs besides Vorbis and Theora (for example, the Opus format). You can test for Ogg Vorbis like so:

audio.canPlayType('audio/ogg; codecs="vorbis"') == "probably";

注意 canPlayType 有三种可能的返回值：

• 可能 - 媒体类型可以几乎肯定会起到


• 也许 - 媒体类型的可能的播放。这是当你问有关在浏览器的一般的Ogg支持具有特定codeCS（即Vorbis和Theora格式）的Ogg支持什么返回。一个奥格文件的可以的使用没有浏览器支持，所以如果你不指定codec的codeC，浏览器只能猜测它的可能的能够发挥它。


• ， （空字符串）的 - 媒体类型肯定是不能播放

• "probably" - the media type can almost certainly be played
• "maybe" - the media type might be playable. This is what is returned when you ask about general Ogg support in a browser has Ogg support for specific codecs (i.e. Vorbis and Theora). An Ogg file may use a codec that is not supported by the browser, so if you don't specify the codec, the browser can only guess that it might be able to play it.
• "" (the empty string) - the media type is certainly not playable

如果你真的想考OGG的支持，那么，而不是对的可能的，你可以测试一个非空字符串测试（即测试不是可能或可能），像这样：

If you really wanted to test for ogg support, then instead of testing for "probably", you could test for a non-empty string (i.e., test for either "probably" or "maybe"), like so:

// test for *any* Ogg codecs
if(audio.canPlayType("audio/ogg") != "") {  
    playSound("myMedia.ogg");
}

您应该测试任何特定的codeC的媒体文件使用，例如，用'音频/ OGG; codeCS =Vorbis的的Vorbis格式。测试一般奥格的支持不太可能是有用的。

You should test for whatever specific codec your media file uses, e.g., with 'audio/ogg; codecs="vorbis"' for Vorbis. Testing for general Ogg support is not likely to be useful.

这篇关于是什么选项有跨浏览器兼容的音频？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！