Ajax发送多张base64图片

Question

我正在通过 ajax 请求发送多张图片。但是发送多张图片会有问题，因为它是内存。

当我尝试 json_decode 这个对象时 thumbnailArray。我明白了

Fatal error: Allowed memory size of 134217728 bytes exhausted (tried to allocate 1048655 bytes)

thumbnailArray = {
    image1 : {
        image : base64,
        rotate : 0,
        order : 1
    },
    image2 : {
        image : base64,
        rotate : 0,
        order : 2
    }
}

我在对象中发送 base64 图像，其中包含图像旋转和顺序等一些值。这是代码：

    var formData = new FormData( $(this)[0] );
    formData.append('ab-user-image', JSON.stringify(thumbnailArray));

    $.ajax({
        url : baseUrl+'user/ajax_user_add/',
        type : 'POST',
        data : formData,
        async : true,
        cache : false,
        contentType : false,
        processData : false,
        success : function(data) {
            //success
        }
    });

是否有更好的方法来发送 base64 图像或改进此代码或其他什么？

Answer 1

您必须提高 php.ini 中的限制：

upload_max_filesize post_max_size

或重新创建 ajax 函数以对每个图像进行 1 次调用

您可以使用如下方式重新创建 ajax 函数：

var formData

 = new FormData( $(this)[0] );
    formData.append('ab-user-image', JSON.stringify(thumbnailArray));

    $(formData).each().ajax({
        url : baseUrl+'user/ajax_user_add/',
        type : 'POST',
        data : this,
        async : true,
        cache : false,
        contentType : false,
        processData : false,
        success : function(data) {
            //success
        }
    });

Answer 2

我用这个

var picReader = new FileReader();
picReader.onload = function(event){
    $('.ab-image-upload .ab-image-uploaded').append(createContainerThumbnail(event.target.result, j));
    thumbnailArray['ab-user-image'+j] = {
         image: event.target.result,
         rotate: 0,
         order: 0
    };
    j++;
};
picReader.readAsDataURL(file);
if(formData) {
    formData.append('images[]', file);
}

我将 formData 文件直接附加到 FileReader 中。而不是通过 ajax

发送

Ajax发送多张base64图片

Ajax send multiple base64 image

javascript

php

ajax

base64

image