Ajax 发送多个 base64 图像答案

【问题标题】：Ajax send multiple base64 imageAjax 发送多个 base64 图像
【发布时间】：2016-10-02 15:51:45
【问题描述】：

我通过 ajax 请求发送多个图像。但是发送多个图像存在问题，因为它是内存。

当我尝试 json_decode 这个对象 thumbnailArray。我得到了这个

致命错误：允许的内存大小为 134217728 字节已用尽（已尝试分配1048655字节）

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 图像或改进此代码之类的？

【问题讨论】：

thumbnailArray 是什么？您的代码 sn-p 很有用，但不知道您要序列化什么以及为什么它这么大，您不会得到太多帮助。
@TomášHübelbauer 我说那是对象。没关系，我更新帖子，并添加thumbnailArray，你现在可以看到

标签： javascript php ajax image base64

【解决方案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
        }
    });

【讨论】：

感谢您的回复。我无法更改 php.ini 文件。我正在上传多个文件，在提交时，我需要将所有图像发送到 php，而不是上传等等......并保存在数据库中。如果您对此有解决方案。这会很棒
我试试这个，如果我有大于 10-15MB 的图像，它是一样的，有没有另一种方法可以用 ajax 发送图像？
你需要访问你的 php.ini 或者你的双手被束缚
我在共享服务器上，我无法更改 php.ini :/
那你就不能随心所欲地做你的网络了：/

【解决方案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);
}

我直接在 FileReader 中附加 formData 文件。而不是通过 ajax 发送

【讨论】：