<div class="base64"></div>
<script>
console.log(new Date());
setInterval(() => {
setTimeout(() => {
console.log(new Date().toTimeString());
}, 500);
}, 500);
function genAudio(base64Video) {
let audio = document.createElement('audio');
audio.id = 'audio1';
audio.loop = 'true';
audio.autoplay = 'true';
audio.controls = true;
audio.src = base64Video;
audio.volume = 0.5; // 最小值0.5
return audio;
}
// 新键文件输入框元素
const input = document.createElement('input');
input.type = 'file';
// 文件输入框插入位置
document.querySelector('.base64').append(input);
input.onchange = function () {
const files = input.files; // e.target.files; // FileList
const reader = new FileReader();
reader.readAsDataURL(files[0]); // 转Base64
reader.onload = function () {
console.log('base64 result:', reader.result);
const video = genAudio(reader.result);
// 音频插入位置
document.querySelector('.base64').append(video);
};
};
</script>
原来我之前用的循环播放视频没起作用。
实测循环播放音频方法有效,但不好用,会让标签显示正在播放音频,音量最低到0.5,耳机依然会有噪音。
Web worker 是唯一好用的方案。