CORS Problem when playing Dropbox shared link mp3 file

I can't speak to the behavior of AudioContext, but for reference, if you just use an audio tag by itself, this does work:

<audio controls src="https://www.dropbox.com/s/sbw9hfghk4pqqiw/Laughter.mp3?dl=1"></audio>

For that kind of link, Dropbox will redirect the client, with the resulting URL containing the proper CORS headers.

If you do need to use AudioContext, it looks like there are two issues:

1) You have to specify crossOrigin, e.g., as covered here.

2) AudioContext apparently won't follow the redirects, so you need to give a direct URL. Dropbox does not officially support this, but it does currently work:

<audio crossorigin="anonymous" src="https://dl.dropboxusercontent.com/s/sbw9hfghk4pqqiw/Laughter.mp3?dl=1"></audio>

<script>
  var audioContext = new (window.AudioContext || window.webkitAudioContext)();
  var audioNode = document.querySelector("audio");
  var playable = false;
  window.onload = function() {
    document.body.addEventListener("click", function() {
      if (playable) {
        audioNode.play();
      } else {
        audioNode.addEventListener("loadstart",      function(event) { console.log(event.type); });
        audioNode.addEventListener("loadedmetadata", function(event) { console.log(event.type); });
        audioNode.addEventListener("canplay",        function(event) { console.log(event.type);
          playable = true;
          audioContext.createMediaElementSource(audioNode).connect(audioContext.destination);
          audioNode.play();
        });
        audioNode.load();
      }
    });
  }
</script>

Again though, this isn't officially supported, so it's subject to change/break without warning, and accordingly I don't recommend you rely on it.