从 base64 解码字符串保存的 Django 图像已损坏

Question

我不知道这里有什么问题，所以我将整个过程描述一下：

首先，我使用 Croppie 让用户在客户端裁剪图像。这个 javascript 库应该 return 一个以 base64 编码的有效 canvas 对象。然后我用 $.ajax():

发送图像

croppie_div.croppie('result', {
            type: 'canvas',
            size: 'original',
            format: 'jpeg'
        }).then(function(resp){
            $.ajax({
                url: "{% url 'recortar_carta_ajax' %}",
                method: "POST",
                data: {'csrfmiddlewaretoken': "{{ csrf_token }}", 'imagen': resp, 'carta_id': "{{ carta_magicpy.id }}"},
                success: function(r){
                    alert(r)
                },
                error: function(r){
                    alert(r)
                }
            });

然后，我在 django 中获取编码后的字符串，对其进行解码并将其保存到 ImageField:

if request.is_ajax():

        carta_id = request.POST.get("carta_id")
        imagen_b64 = request.POST.get("imagen")

        imagen_decodificada = base64.b64decode(imagen_b64)

        carta_magicpy = CartaMagicPy.objects.get(id=carta_id)
        imagen_django = ContentFile(imagen_decodificada, "imagen.jpeg")
        carta_magicpy.imagen.save("imagen.jpeg", imagen_django, save=True)

保存的图像已损坏。当我尝试使用文件浏览器打开它时出现错误：

Error interpreting JPEG image file (Not a JPEG file: starts with 0x75 0xab)

我不知道如何调试它。我怎样才能找到错误？任何建议都会有所帮助。

这是型号：

def ubicar_magicpy(instance, filename):
    # Para ubicar las imágenes de magicpy
    path = "/".join([instance.grupo.nombre, "imagen.jpeg"])
    return path

class CartaMagicPy(models.Model):
    imagen = models.ImageField(null=True, upload_to=ubicar_magicpy)

Answer 1

您应该删除 Base64 声明，因为它们本身不是 base64 字符串的一部分。您可以在客户端或服务器端执行此操作，但在服务器端执行此操作的优势在于，如果您决定切换图像格式，该字符串可帮助您确定要发送的文件格式。

这不是最优雅的方式，但您可以：

imagen_decodificada = base64.b64decode(imagen_b64.replace('data:image/jpeg;base64,',''))

从 base64 解码字符串保存的 Django 图像已损坏

Django image saved from base64 decoded string is corrupted

django

ajax

base64

encoding

image