在浏览器中将音频转换为 MP3 - Javascript 教程

这周是我儿子的一岁生日。妻子为了庆祝生日下载了60多首儿歌，让我把它们转换成MP3格式，因为她的音箱不支持她用的m4a格式。

我首先想到的是打开任何在线转换网站，上传歌曲，然后等待转换完成。但大多数网站的免费套餐最多只允许转换 2 到 5 个文件。

当然，我也可以付费使用其中一个网站。但就像任何喜欢重新发明轮子的优秀程序员一样，我决定自己开发这个转换器。

作为一名 Web 开发者，我很好奇这是否可以直接在浏览器中实现。经过一番研究，我找到了Lame.js库，它允许你对 MP3 文件进行编码。

不到一个上午的时间，我就创建了一个简单的页面，几分钟内就能将所有文件转换为 MP3。我非常喜欢这个效果，甚至还买了个域名，做了一些改进，然后把它放到了网上：www.mxwd.cc

MP3 转换器网站打印

在这个简短的教程中，我想向您展示使用这个小型库获取音频文件并将其转换为 MP3 是多么简单。

首先，从存储库下载lame.all.js文件并将其放入项目文件夹中。

然后，创建一个带有文件输入和按钮的简单 HTML 页面来开始转换：

Audio to MP3 Converter

Convert Audio to MP3

Convert 现在让我们实现convertToMP3方法。首先，我们从输入中读取音频文件：

async function convertToMP3() { const fileInput = document.getElementById('audioFile'); if (!fileInput.files[0]) return alert('Select a file first.');

const file = fileInput.files[0];
// ... rest of the code

} 然后我们使用 AudioContext api 将文件解码为缓冲区：

const buffer = await file.arrayBuffer(); const audioCtx = new AudioContext(); const audioBuffer = await audioCtx.decodeAudioData(buffer); 现在我们将数据转换为 Lame.js 接受的格式（从 Float 到 Int16）：

const channels = Math.min(audioBuffer.numberOfChannels, 2); const sampleRate = audioBuffer.sampleRate; const int16Data = [];

for (let ch = 0; ch < channels; ch++) { const floatData = audioBuffer.getChannelData(ch); const intData = new Int16Array(floatData.length); for (let i = 0; i < floatData.length; i++) { intData[i] = Math.max(-32768, Math.min(32767, floatData[i] * 32767)); } int16Data.push(intData); } 这样，现在就可以使用 Lame 生成最终的 mp3 文件了：

const encoder = new lamejs.Mp3Encoder(channels, sampleRate, 96); const mp3Data = []; const blockSize = 1152; // Better to use multiples of 576 const length = int16Data[0].length;

for (let i = 0; i < length; i += blockSize) { const leftChunk = int16Data[0].subarray(i, i + blockSize); let mp3buf; if (channels === 2) { const rightChunk = int16Data[1].subarray(i, i + blockSize); mp3buf = encoder.encodeBuffer(leftChunk, rightChunk); } else { mp3buf = encoder.encodeBuffer(leftChunk); } if (mp3buf.length > 0) { mp3Data.push(mp3buf); } }

const finalMp3 = encoder.flush(); if (finalMp3.length > 0) { mp3Data.push(finalMp3); } 最后，下载trx租赁生成的文件：

const blob = new Blob(mp3Data, { type: 'audio/mp3' }); const url = URL.createObjectURL(blob); const a = document.createElement('a'); a.href = url; a.download = file.name.replace(/.[^/.]+$/, '') + '.mp3'; a.click(); URL.revokeObjectURL(url); 如果您对完整代码感兴趣，请参见：

Audio to MP3 Converter

Convert Audio to MP3

Convert 基本上就是这样。就我而言，我实现了一些改进，例如使用 Web Worker 来加快转换速度（这在我的机器上至少将转换速度提高了 5 倍）。

希望这篇短文对你有帮助。