How to write .wav file from blob in Javascript/Node

Question

I'm trying to write a .wav file with fs.writeFile. The file is created successfully, however it's only 8-13bytes long, so obviously I'm not doing something right.

If the blob is already audio/wav can I write to disk or do I need to convert it to Base 64?

I'm pretty much at a loss here, I found another similar thread with no answer - Here

Any input would be appreciated.

routerApp.controller('audiotest', function($scope) {
 $scope.saveToDisk = function(){
  var nw = require('nw.gui');
  var fs = require('fs');
  var path = require('path');
  fs.writeFileSync('test.wav', $scope.recordedInput)
 };
}

console.log($scope.recordedInput) returns Blob {size: 294956, type: "audio/wav"}

It's not really relevant, but here's my HTML

<div class="row" ng-controller="audiotest">
<div class="row">
    <button type="button" ng-click="saveToDisk()"> Write this sucker to disk </button>
    </div>

<ng-audio-recorder id='audioInput' audio-model='recordedInput'>
  <!-- Start controls, exposed via recorder-->
  <div ng-if="recorder.isAvailable">
    <button ng-click="recorder.startRecord()" type="button" ng-disabled="recorder.status.isRecording">
        Start Record
    </button>
    <button ng-click="recorder.stopRecord()" type="button" ng-disabled="recorder.status.isRecording === false">
        Stop Record
    </button>

</ng-audio-recorder>
</div>

mscdex · Accepted Answer · 2016-09-08 22:11:11Z

11

You can convert the Blob to a Typed Array and then to a Buffer for passing directly to fs.writeFileSync():

var fileReader = new FileReader();
fileReader.onload = function() {
  fs.writeFileSync('test.wav', Buffer.from(new Uint8Array(this.result)));
};
fileReader.readAsArrayBuffer($scope.recordedInput);

edited Sep 8, 2016 at 22:11

answered Sep 8, 2016 at 16:20

mscdex

107k15 gold badges201 silver badges159 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

angularchobo Over a year ago

I definitely don't understand what you're doing here, but anyway I get an uncaught TypeError buffer.js:259 Uncaught TypeError: First argument must be a string, Buffer, ArrayBuffer, Array, or array-like object..

mscdex Over a year ago

What does console.log(this.result) show inside the callback?

angularchobo Over a year ago

[object ArrayBuffer]

mscdex Over a year ago

Ok, there shouldn't be a problem then. What version of nw.js are you using?

angularchobo Over a year ago

The version is 0.16.0

|

rickrizzo · Accepted Answer · 2017-07-07 18:47:27Z

1

I had issues getting either of these to work for me. I found success, and much easier implementation with this node module express-fileupload. Here's some code:

var express = require('express');
var fileUpload = require('express-fileupload');

app.use(fileUpload());

app.post('/', function(req, res) {


  console.log(req.files.data);
  req.files.data.mv('test.wav', function(err) {
    if (err) {
      console.log(err);
    }
  });
});

answered Jul 7, 2017 at 18:47

rickrizzo

6426 silver badges13 bronze badges

Comments

Doctor · Accepted Answer · 2016-10-16 04:17:22Z

-1

Using mscdex answer.

This is what worked for me when using NodeWebkit as browser.

var fileReader = new FileReader();
fileReader.onload = function () {
       fs.writeFileSync('test.wav', Buffer(new Uint8Array(this.result)));
};
fileReader.readAsArrayBuffer(blob);

Notice the "from" method of Buffer has disappear. And "blob" that is passed in my last line is audio data encoded in wav.
For the rest, its only magic. Don't ask me...

answered Oct 16, 2016 at 4:17

Doctor

8,0865 gold badges44 silver badges62 bronze badges

Collectives™ on Stack Overflow

How to write .wav file from blob in Javascript/Node

3 Answers 3

8 Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

8 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related