title: How do I get external image and encode it to base64 on client WebApp?
body: <p>Here is current code:</p>
  
  <pre><code>toBase64(url, callback, outputFormat){
    var img = new Image();
    img.crossOrigin = 'Anonymous';
    img.onload = function(){
      var canvas = document.createElement('CANVAS');
      var ctx = canvas.getContext('2d');
      var dataURL;
      canvas.height = this.height;
      canvas.width = this.width;
      ctx.drawImage(this, 0, 0);
      dataURL = canvas.toDataURL(outputFormat);
      callback(dataURL);
      canvas = null; 
    };
    img.src = url;
  }
  </code></pre>
  
  <p>I can't find the way over CORS error to retrieve external image.<br>
  Also, I use <a href="https://github.com/lapwinglabs/x-ray" rel="nofollow">x-ray</a> in my NodeJS server, and it is able to retrieve the same images. I assume, this means that it is possible to go over CORS error on client side too.</p>