Web Audio API: decodeAudioData doesn't decode opus in Chrome

3
votes

I'm currently trying to make Opus packets work with Web Audio API. The problem is however, while it should be natively supported by FireFox and Chrome, only FireFox can decode a stream of OPUS samples using decodeAudioData from the Web Audio API. Chrome does recognize the file when I drag the opus file into the browser and it also does play it! So I'm wondering that I may be doing something wrong here causing failure in Chrome.

Then I used some sample code from http://awm.jp/~yoya/js/audio/meow.html just load an opus file and try to decode it. Again Firefox does, and Chrome doesn't. So I'm wondering if someone can confirm my finding or tell me what I'm doing wrong here. Below is the modified version from the earlier link. Thanks!

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-15">
<title> decodeAudioData sample </title>
</head>

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
//$(document).ready(function() {
    var catMeowingBuffer = null;
    window.AudioContext = window.AudioContext||window.webkitAudioContext;
    var context = new AudioContext();

    function onError(err) {
       console.log("unable to decode");
    }

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

      // Decode asynchronously
      request.onload = function() {
          context.decodeAudioData(request.response, function(buffer) {
          catMeowingBuffer = buffer;
           var src = context.createBufferSource();
           src.buffer = catMeowingBuffer
           src.connect(context.destination);
           src.start(0);
        }, onError);
      }
      request.send();
    }

    loadCatSound("opus.opus");

    function playCatSound() {
        if (catMeowingBuffer !== null) {
           var src = context.createBufferSource();
           src.buffer = catMeowingBuffer
           src.connect(context.destination);
           src.start(0);
        }
    }
//});
</script>

<body>
<h1> decodeAudioData sample </h1>


<button onclick="playCatSound();"> playCatSound </button>

<hr>
<address></address>
</body> </html>
1
audiowebdecodeopus

1 Answers