ios - 带有 WebAudio API 的 iOS 7.1 中的音频失真

Question

在 iOS 7.1 上，当使用 Web Audio API 播放音频时，我总是听到嗡嗡声/嘈杂/失真的声音。听起来distorted like this , 代替 normal like this .

相同的文件在使用 HTML5 音频时没问题。在桌面(Firefox、Chrome、Safari)上一切正常。

编辑:

• iOS 模拟器版本 iOS 7.1、8.1、8.2 中的音频失真。嗡嗡声通常在我播放任何内容之前就开始了。
• 运行 iOS 7.1 的实体 iPhone 在 Chrome 和 Safari 中的音频失真。
• 在 Chrome 和 Safari 中运行 iOS 8.1 的实体 iPhone 上的音频都很好。

即:嗡嗡声是在 iOS 7.1 上。只要。

Howler.js 不是问题。像这样使用纯 JS 问题仍然存在:

var context;
var sound;
var extension = '.' + ( new Audio().canPlayType( 'audio/ogg' ) !== '' ? 'ogg' : 'mp3');


/** Test for WebAudio API support **/
try {
    // still needed for Safari
    window.AudioContext = window.AudioContext || window.webkitAudioContext;

    // create an AudioContext
    context = new AudioContext();
} catch(e) {
    // API not supported
    throw new Error( 'Web Audio API not supported.' );
}

function loadSound( url ) {
    var request = new XMLHttpRequest();
    request.open( 'GET', url, true );
    request.responseType = 'arraybuffer';

    request.onload = function() {
        // request.response is encoded... so decode it now
        context.decodeAudioData( request.response, function( buffer ) {
        sound = buffer;
        }, function( err ) {
            throw new Error( err );
        });
    }

    request.send();
}

function playSound(buffer) {
    var source = context.createBufferSource();
    source.buffer = buffer;
    source.connect(context.destination);
    source.start(0);
}

loadSound( '/tests/Assets/Audio/En-us-hello' + extension );


$(document).ready(function(){ 

    $( '#clickme' ).click( function( event ) {
        playSound(sound);
    });


}); /* END .ready() */

此代码的实时版本可在此处获得:Web Audio API - Hello world

Google 没有针对 iOS 7.1 上的此类声音失真问题提出任何结果。

还有其他人遇到过吗？我应该向 Apple 提交错误报告吗？

Answer 1

我认为问题是由于重置 audioContext.sampleRate 属性引起的，这似乎是在浏览器/操作系统播放以不同采样率录制的内容之后发生的。

我设计了以下解决方法，它基本上是静默播放以设备当前播放的采样率记录的短 wav 文件:

"use strict";

var getData = function( context, filePath, callback ) {
    var source = context.createBufferSource(),
        request = new XMLHttpRequest();

    request.open( "GET", filePath, true );

    request.responseType = "arraybuffer";

    request.onload = function() {
        var audioData = request.response;

        context.decodeAudioData(
            audioData,
            function( buffer ) {
                source.buffer = buffer;

                callback( source );
            },
            function( e ) {
                console.log( "Error with decoding audio data" + e.err );
            }
        );
    };

    request.send();
};

module.exports = function() {
    var AudioContext = window.AudioContext || window.webkitAudioContext,
        context = new AudioContext();

    getData(
        context,
        "path/to/short/file.wav",
        function( bufferSource ) {
            var gain = context.createGain();
            gain.gain.value = 0;
            bufferSource.connect( gain );
            gain.connect( context.destination );
            bufferSource.start( 0 );
        }
    );
};

显然，如果某些设备具有不同的采样率，您将需要为每个速率检测和使用特定文件。