How to convert Uint8ClampedArray to node-like Buffer;

I am working on a node module that uses xmlrpc to post images to wordpress. The
postIMGRPC method accepts the raw image data and submits it via the wp.uploadFile uri. I have successfully tested the method in node using an image file:

  var imgData;
  fs.readFile("anyImage.jpg", function(e,d){  imgData = d  }   );
  wp.postIMGRPC("anyImage.jpg", imgData, 1)
      .then(function(r){console.log(r)})

Now, I would like to be able to grab the imgData of a canvas in client-side javascript, and submit it in the same fashion via my node.js module:

Read More
  var c=document.getElementById("myCanvas");
  var ctx=c.getContext("2d");
  var img=document.getElementById("myImg");
  ctx.drawImage(img,0,0);

  var imgData = ctx.getImageData(0,0,250,300);
  var data = imgData.data;

However, when I attempt to pass data (type Uint8ClampedArray) to my node module, the file uploaded is a blank image. I have tried:

  wp.postIMGRPC("anyImage.jpg", imgDataFromJS, 1)
      .then(function(r){console.log(r)})

as well as

 buf = new Buffer(imgDataFromJS)
 wp.postIMGRPC("anyImage.jpg", buf, 1)
      .then(function(r){console.log(r)})

How do I convert the Uint8ClampedArray from imgData to a Buffer that is similar to the one returned by fs.readFile()?

Related posts

Leave a Reply

1 comment