Get the Data URL from a local url
<p>I'm programming a Web App with Cordova, Ionic, Angular and Sqlite as client database. </p>

<p>I'm doing a module for taking photos and trying to get and send the Base64 encode (Data URL) from the taken image.<br>
The URL that my image returns is like this: <code>blob:http%3A//localhost%3A4400/705ade8b-5330-4aad-8afa-516d559211a2</code>, this url is local, therefore when refreshing the browser, url dies. I just want to extract the Base64 encode from the image that is referenced by that url, so having that encode I will can INSERT it to my Sqlite database (I'm using the camera plugin from Cordova). </p>

<p>I was thinking to take the src from <code>&lt;img&gt;</code> (that is the (local/temporal)) tag and extract the Base64 encode but I don't know how. Any help would be great, thank you.</p>

<p>The Code:</p>

<p>app.js:</p>

<pre class="lang-js prettyprint-override"><code>  .controller('cameraCtrl', function($scope, Camera) {

    $scope.takePhoto = function() {
      Camera.takePhoto().then(function(urlImage) {

        $scope.lastImage = urlImage;
        //console.log($scope.lastImage);            
      }, function(err) {
        console.err(err);
      }, {
        quality: 50,
        targetWidth: 50,
        targetHeight: 50,
        destinationType: Camera.DestinationType.DATA_URL,
        saveToPhotoAlbum: false
      });
    };
    $scope.savePhoto = function() {
      //This function should get the Base64 encode (Data URL) from the &lt;img/&gt; tag in tab-camera.html
      addImagenCamara(Camara.makeHashBase64ForId(), $scope.lastImage);
    };
    //makeHashBase64ForId is only for the _id field into database, this isn't the image
  });
</code></pre>

<p>service.js:</p>

<pre class="lang-js prettyprint-override"><code>  .factory('Camera', ['$q',
    function($q) {
      return {
        takePhoto: function(options) {
          var q = $q.defer();
          navigator.camera.getPicture(function(result) {
            q.resolve(result);
          }, function(err) {
            q.reject(err);
          }, options);

          return q.promise;
        },
        makeHashBase64ForId: function() {
          var date = new Date();
          return btoa(date.getTime());
        }
      };
    }
  ]);;
</code></pre>

<p>tab-camera.html:</p>

<pre class="lang-html prettyprint-override"><code>&lt;ion-view view-title="Cámara"&gt;
  &lt;ion-content&gt;
    &lt;button ng-click="takePhoto()" class="button button-block button-primary"&gt;Take photo!&lt;/button&gt;
    &lt;button ng-click="savePhoto()" class="button button-block button-primary"&gt;Save&lt;/button&gt;
    &lt;img src="{{lastImage}}" id="myImage" /&gt;//Here goes the (local/temporal) url indeed
  &lt;/ion-content&gt;
&lt;/ion-view&gt;
</code></pre>