Question

我正在使用输入来加载图像，然后以数据uri格式转换它以将其传递到ngImgCrop指令以裁剪该图像。

到目前为止，我已经完成了所有这些工作，但我正在努力尝试使用ngFlow上传数据uri格式的裁剪图像。

我已经尝试了几种方法但没有成功，有没有人能够做到这一点？

我担心我遗漏了一些东西，我尝试使用.addFile()方法并以数据uri格式传递图像，但它不能以这种方式工作。

Answer 1

我终于找到了一个解决方案，创建一个Blob并将其推送到Flow的文件数组中工作！

This StackOverflow answer也有帮助，因为我必须将数据uri格式的图像转换为二进制以创建Blob（函数dataURItoBlob()为我做了）。

这是执行此操作的代码：

function uploadImage($flow) {
  if ($flow) {
    // 'vm.img.cropped' is the image in data uri format to upload
    var blob = dataURItoBlob(vm.img.cropped);
    blob.name = 'file.png';

    var file = new Flow.FlowFile($flow, blob);
    $flow.files.push(file)

    $flow.upload();
  }
}

function dataURItoBlob(dataURI) {
  var binary = atob(dataURI.split(',')[1]);
  var mimeString = dataURI.split(',')[0].split(':')[1].split(';')[0];
  var array = [];
  for(var i = 0; i < binary.length; i++) {
    array.push(binary.charCodeAt(i));
  }
  return new Blob([new Uint8Array(array)], {type: mimeString});
};

使用ngFlow以数据uri格式发送图像

1 个答案: