使用jQuery将文件添加到输入类型文件

Question

我正在使用一个名为Croppie.js的库来裁剪图像。我想做的是：

• 由于输入type = file仅接受图像文件，因此上传图片
• 借助Croppie.js方法对其进行编辑
• 将生成的图像放回文件输入中，替换原始图像

Croppie.js能够产生斑点，这要归功于其功能result。因此，这是它的样子：

$("#confirm-photo-edit").click(function(){
    $("#photo-to-crop").croppie('result', 'blob').then(function(editedImg){
        // Here something like $("#photo-input").files.push(editedImg);
    });
});

所以我的问题是：

• 我必须从Blob转换为File吗？
• 如何用编辑后的editedImg替换输入中的原始图像？

谢谢。

Answer 1

在大多数浏览器中，这不可能使用类型文件访问输入文件本身。这是由于安全原因。但是，可以将文件存储为基于字符的字符串表示形式。例如，base64字符串。几乎每个编程环境都可以对base64进行解码。