javascript - 如何在 Javascript 中从本地 URL 获取图像并转换为 Base64

Question

我有一个像这样的 URL -> blob:http%3A//localhost%3A4400/a558ba4c-076b-490a-999d-92bc85f2bcee，但是这个 URL 只能在我的浏览器中读取，而不能在另一个浏览器中读取。

.controller('cameraCtrl', function ($scope, Camera) { 
    $scope.takePhoto= function () { 
        Camera.takePhoto().then(function (urlImage) { 
            $scope.lastPicture = urlImagen; 
        }, 
        function (err) { 
            console.err(err); 
        }, 
        { 
            quality: 50, 
            targetWidth: 50, 
            targetHeight: 50, 
            saveToPhotoAlbum: true 
        }); 
    }; 
}

问题是:如何获取该 URL 的图像并将其转换为 Base64 字符串？任何帮助都会很棒，谢谢。

Answer 1

您应该添加代码，这样人们就不必从头开始编写解决方案，但是。

function  ConvertBlobToDataUrl(blobUrl, complete){
   var canvas = document.createElement("canvas");
   var ctx = canvas.getContext("2d");
   var tempImg = new Image();

   tempImg.onload = function(){
      canvas.width = tempImg .width;
      canvas.height = tempImg .height;
      ctx.drawImage(tempImg , 0,0, tempImg.width, tempImg.height);
      complete(canvas.toDataURL())
   }

   tempImg.src = blobUrl;

}

那么用法就是

var dataUrl = "";
ConvertBlobToDataUrl(blobUrl, function(url){
    dataUrl = url;
}

凭内存写的，但应该按原样工作。