从签名板存储为 Png 图像？

Question

我已经实现了 Signature-Pad 并且它正在运行。所以，现在我想将签名作为 .png 图像存储到 local/cloudinary.

$scope.saveCanvas = function() {
  var sigImg = signaturePad.toDataURL('image/png');
  $scope.signature = sigImg;
  console.log("$scope.signature :",$scope.signature);
}

上面的代码给出了 base64 字符串，例如：data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAASwAAACWCAYAAABkW7XSAAAY

如何将 base64 转换为 .png 图像？

我试过了:angular-base64

 $scope.decoded = $base64.decode(sigImg);

我不知道怎么用this..

谢谢..!

Answer 1

您可以使用以下代码完成：

const dataURL = this.signaturePad.toDataURL('image/png');
const data = atob(dataURL.substring('data:image/png;base64,'.length)),
  asArray = new Uint8Array(data.length);

for (var i = 0, len = data.length; i < len; ++i) {
  asArray[i] = data.charCodeAt(i);
}

const blob = new Blob([asArray], { type: 'image/png' });

然后你应该可以上传 blob 到 cloudinary。

我从以下Whosebug answer

中获取了这段代码

从签名板存储为 Png 图像？

Store as Png Image from Signature pad?

angularjs

ionic-framework

signaturepad