Sync all

Webエンジニアの気になる事。困った事もろもろ。

NodeWebkitでMP3再生

NodeWebkitでWebAudioでMP3を再生する。

できません

NodeWebkitのデフォルトではMP3の読み込みはサポートされていません。

ajaxでarraybuffer読み込んでdecodeAudioData()実行するとerrorが発生してしまう。

なので方法考えてみます。

.oggへ変換

潔く.oggフォーマットへ変換をする。

オンラインオーディオコンバーター
http://media.io/ja/

これなら何の問題も無い。

でもそんなツールなんぞ使いたくない人は他の手を考える。

Base64 → Arraybuffer

これならどのプラットフォームでも大丈夫。たぶん。

モバイルでも大丈夫。たぶん。

メリットはキャッシュが楽な点ですかね。

IndexedDBとかにほり込んでおけば色々とajaxで読み込むより早くていいかと思います。

MP3 → Base64エンコード

ではまず、audioファイルをOpenSSLでbase64エンコーディング

openssl base64 -in [audiofile] -out [outfile]

これでOK。

Base64 → ArrayBuffer

以下の方法があります。

ライブラリ使う人向け。
blog-examples/js/base64-binary.js at master · danguer/blog-examples · GitHub

var buffer = Base64Binary.decodeArrayBuffer(sound);

自分で書きたい人向け。

function convertToBinary (base64strings){
    var raw = window.atob(base64strings)
    var rawLength = rawData.length;
    var buffer = new Uint8Array(new ArrayBuffer(rawLength));
 
    for(i = 0; i < rawLength; i++) {
        buffer[i] = raw.charCodeAt(i);
    }
    return buffer;
}
再生

後は通常の再生の処理を実行する。

window.AudioContext = window.AudioContext || window.webkitAudioContext || window.mozAudioContext || window.msAudioContext;
var context = new AudioContext;

var arrayBuffer = convertToBinary(base64strings);

context.decodeAudioData(arrayBuffer, function(buffer) {
    var source = context.createBufferSource();
    source.buffer = buffer;
    source.connect(context.destination);
    source.start();
}, function(error) {
    console.error('decode error', error);
});

結局MP3自体の再生は不可能なので何かしら変換しないと行けません。