title: sending a png image over a websocket and rendering the received image
body: <p>On server:
  I am loading a png image:</p>
  
  <pre><code>var myimage = png.load('test.png');
  
  then sending over websocket connection:
  ws.send(myimage);
  </code></pre>
  
  <p>On client:</p>
  
  <pre><code>function onMessage(evt) {
      if (evt.data instanceof ArrayBuffer) {
          var length = evt.data.byteLength;
          var bytes = new Uint8Array(evt.data);
          var image = document.getElementById("image");
          var img = new Image();
          img.src = 'data:image/png;base64,'+ window.btoa(bytes);
          var ctx = image.getContext("2d");
          ctx.drawImage(img, 0, 0);
  }
  </code></pre>
  
  <p>Not getting anything to display on canvas. Any ideas about what I'm doing incorrectly? </p>