Изображение после обрезки становится больше по размеру

Question

Я использую ember-cli-image-cropper в своем веб-приложении. Все работает отлично. Но если изображение, которое обрезано, имеет размер более 3 МБ. После изображения (например, 5 мб). И когда я отправляю изображения на свой бэкэнд, он бросает 413 (сущность слишком большая ошибка).

Мой код.

appliction.hbs

<div class="cropper"> 
    <div class="cropper-container" style="max-width:400px;max-height:400px"> 
    <img src="{{image}}"> 
    </div> 
</div> 

<button {{action "getCroppedAvatar"}}>Done</button> 

controller.js

import imageCropper from 'ember-cli-image-cropper/components/image-cropper'; 


export default imageCropper.extend({ 
    //override default options of cropper 
    aspectRatio: 16/9, 
    minCanvasWidth:150, 
    minCanvasHeight:150, 
    minContainerWidth:400, 
    minContainerHeight:400, 
    minCropBoxWidth: 150, 
    minCropBoxHeight:150, 
    cropperContainer: '.cropper-container > img', 
    previewClass: '.img-preview', 
    resizable:false, 
    zoomable: false, 
    zoomOnWheel: false, 
    zoomOnTouch: false, 
    croppedAvatar: null, 
    background:false, 
    viewMode:1, 


    actions: { 
    getCroppedAvatar: function() { 
     var container = this.$(this.get('cropperContainer')); 
     var croppedImage = container.cropper('getCroppedCanvas'); 
     console.log(croppedImage); 
     this.set('croppedAvatar', croppedImage); 
     var ImageUrl = this.get('croppedAvatar').toDataURL(); 
     raw({ 
     url:'https://exmaple.com", 
     type:'Post', 
     data:{imageUrl:ImageUrl} 
     }) 
    } 
    } 
}); 

Я меняю холст на dataUrl (с использованием toDataURL(); метод) .Не знаю, почему это happening.The уголек аддон, который Я использую реализацию из этого jQuery-плагина https://github.com/fengyuanchen/cropper. Я использую https://github.com/mhretab/ember-cli-image-cropper

Answer 1

Это, похоже, известная проблема с плагином jQuery, который вы используете. См. this.

Решение состоит в том, чтобы установить тип файла при использовании функции toDataURL, как и в

var type = this.get('croppedAvatar.type'); 
toDataURL(type, 1.0)