title: how to convert an image into base 64 in angular5?
body: <p>how to convert an image into base 64 in angular5 ?
  the image is an url gotten from facebook or google authentification api.</p>
  
  <p>what have i done wrong ?</p>
  
  <pre><code>   getBase64Image(img) {
  var canvas = document.createElement("canvas");
  canvas.width = img.src.width;
  canvas.height = img.src.height;
  var ctx = canvas.getContext("2d");
  ctx.drawImage(img, 0, 0);
  var dataURL = canvas.toDataURL("image/png");
  return dataURL.replace(/^data:image\/(png|jpg);base64,/, "");
  }
  </code></pre>
  
  <p>// Usage</p>
  
  <pre><code>    var url=" https://www.livemint.com/rf/Image-621x414/LiveMint/Period2/2017/06/12/Photos/Opinion/telecom-km8--621x414@LiveMint.JPG";
  
  
  var base64 = this.getBase64Image(url);
  </code></pre>
  
  <p>//error</p>
  
  <pre><code>ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'width' of undefined TypeError: Cannot read property 'width' of undefined
  </code></pre>