ホーム / JavaScript /

【JavaScript】lamejsでWAVファイルをMP3ファイルに変換する

3/24/2023

JavaScript

t f B! P L

WAVファイルをMP3ファイルに変換します。

WAVファイルをMP3ファイルに変換するコード

フォルダ構成

|-- index.html
`-- script.js

index.html

<!DOCTYPE html>
<html lang="ja">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>ファイル変換のテスト</title>
</html>

<body>
    <form method="post" enctype="multipart/form-data">
        <label>
            <input id="file" type="file" name="file" accept="audio/*">
        </label>
    </form>

    <script defer src="https://cdn.jsdelivr.net/npm/lamejs@1.2.1/lame.min.js "></script>
    <script defer src="./script.js"></script>
</body>

lamejsの読み込みはjsdelivrにアクセスして最新版を取得してください。

script.js

function convertWavToMp3(file) {
    return new Promise((resolve, reject) => {
        const reader = new FileReader();
        reader.onload = (event) => {
            // Lamejsを使ってmp3に変換
            const wavHeader = lamejs.WavHeader.readHeader(new DataView(event.target.result));
            const samples = new Int16Array(event.target.result, wavHeader.dataOffset, wavHeader.dataLen / 2);
            const mp3encoder = new lamejs.Mp3Encoder(1, wavHeader.sampleRate * 2, 64);

            const mp3Data = [];
            const blockSize = 1152;
            for (let i = 0; i < samples.length; i += blockSize) {
                const mono = samples.subarray(i, i + blockSize);
                const mp3buf = mp3encoder.encodeBuffer(mono);
                if (mp3buf.length > 0) {
                    mp3Data.push(new Int8Array(mp3buf));
                }
            }
            const mp3buf = mp3encoder.flush();
            if (mp3buf.length > 0) {
                mp3Data.push(new Int8Array(mp3buf));
            }
            // ファイル名を.mp3に変更
            const mp3FileName = file.name.replace(/\.[^/.]+$/, "") + ".mp3";
            const mp3File = new File(mp3Data, mp3FileName, { type: 'audio/mp3' });
            resolve(mp3File);
        };
        reader.readAsArrayBuffer(file);
    });
}


const input = document.querySelector('#file');
input.addEventListener('change', () => {
    const file = input.files[0];
    console.log("ファイルを変換中...");
    console.log(file);
    convertWavToMp3(file).then((mp3File) => {
        console.log("変換完了");
        // 変換後のファイル
        console.log(mp3File);
        // 選択したWAVファイルを強制的にMP3ファイルに置き換える
        const dt = new DataTransfer();
        dt.items.add(mp3File);
        input.files = dt.files;
    });
});

convertWavToMp3(file)でWAVファイルをMP3ファイルに変換しています。

lamejs.Mp3Encoder()の引数については以下の通りです。 

lamejs.Mp3Encoder(channels, samplerate, kbps);
  • channels:
    出力される音声データのチャンネル数を表す整数値で、モノラルの場合は1、ステレオの場合は2を指定します。
  • samplerate:
    サンプリング周波数を表す整数値で、単位はHzです。
  • kbps:
    ビットレートを表す整数値で、出力されるMP3ファイルの1秒間あたりのデータ量を指定します。一般的な音楽の場合、128kbpsから320kbpsの範囲がよく使われます。

まとめ

ブラウザのコンソールで変換前と後のファイルを見るときちんと変換されていることがわかります。