使用本地文件为Web音频加载mp3作为ArrayBuffer
Loading mp3 as ArrayBuffer using local file for Web Audio
我希望加载一个mp3本地文件,然后使用库进行处理,我不能使用XMLHttpRequest,然后我使用下一个代码读取本地mp3文件:
<!DOCTYPE html>
<html>
<head>
</head>
<body onload="carga();">
<input id="audio_file" type="file" accept="audio/*" />
<audio id="audio_player" />
<script>
function carga() {
audio_file.onchange = function(){
var files = this.files;
console.log(files);
alert(files);
var file = URL.createObjectURL(files[0]);
console.log(file);
alert(file);
audio_player.src = file;
audio_player.play();
};
}
</script>
</body>
</html>
但是XMLHttpRequest返回ArrayBuffer,我的代码返回一个FileList,我需要一个ArrayBuffer为我的下一个处理,我怎么能加载一个本地mp3文件作为ArrayBuffer?
在现代浏览器中,您可以使用FileReader
和它的方法readAsArrayBuffer
。
document.querySelector('input').onchange = function(){
var fileReader = new FileReader;
fileReader.onload = function(){
var arrayBuffer = this.result;
snippet.log(arrayBuffer);
snippet.log(arrayBuffer.byteLength);
}
fileReader.readAsArrayBuffer(this.files[0]);
var url = URL.createObjectURL(this.files[0]);
audio_player.src = url;
audio_player.play();
};
<!-- Provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>
<input id="audio_file" type="file" accept="audio/*" />
<audio id="audio_player" />
相关文章:
- 如何在html5/JS中只预加载音频文件的一部分
- 加载音频的Javascript库无法工作
- HTML,JS:加载音频是否需要在移动浏览器上进行用户交互
- 如何在加载音频源文件时使用 js/jquery 来处理事件
- 媒体元素 - 动态加载音频
- 在流星应用程序中加载音频文件
- 使用附加组件 SDK 加载音频文件并使用 Aurora.js 播放
- 如何在向用户显示内容之前以html预加载音频
- 如何延迟播放HTML5音频,但忽略加载音频文件的延迟
- 通过导航栏中的单个播放按钮,在电子书中的每一页加载音频文件
- 预加载音频文件/事件
- JavaScript预加载音频
- 如何在播放之前完全加载音频
- Javascript中预加载音频的问题
- 动态加载音频Javascript
- 动态改变源后加载音频元素
- audio.js:是否可以在特定时间加载音频
- 从本地内存加载音频并播放精灵
- 在javascript中完全预加载音频
- 从另一个域加载音频