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

Question

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

• 由于输入 type=file 只接受图像文件，因此上传图片
• Croppie.js通过方法编辑它
• 将生成的图像放回文件输入中，替换原始图像

Croppie.js由于它的功能，它能够生成一个 blob 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 的东西。