上传croppie插件之前的jquery裁剪图片

Question

您好我在使用 croppie插件图像时在CakePHP中保存裁剪图像时遇到困难但是在保存图像时，它会在裁剪后保存整个图像而不是裁剪后的图像{1}}裁剪图像是正确的，但每当我尝试保存它时，它都会保存整个默认图像。

＆＃13;

＆＃13;

src

＆＃13;

$uploadCrop = $('#upload-demo').croppie({
  enableExif: true,
  viewport: {
    width: 180,
    height: 180,
    type: 'circle'
  },
  boundary: {
    width: 190,
    height: 190
  },
  showZoomer: false
});

$('#my_file').on('change', function() {
  $('#tttssss').show();
  $('#user-select-image').hide();

  var reader = new FileReader();
  reader.onload = function(e) {
    $uploadCrop.croppie('bind', {
      url: e.target.result
    }).then(function() {
      console.log('jQuery bind complete');
    });

  }
  reader.readAsDataURL(this.files[0]);
});

$('.upload-result').on('click', function(ev) {
  $uploadCrop.croppie('result', {
      type: 'canvas',
      size: 'viewport'
    })


    .then(function(resp) {

      $('#user-select-image').attr('src', resp);
      $('#user-select-image').show();
      $("#tttssss").hide();
    });
});
$(document).ready(function() {
  $("#user-select-image").click(function() {
    $("input[id='my_file']").click();
  });
});

＆＃13;

＆＃13;

＆＃13;

上传上传整个图片的图片

这是我的代码

Answer 1

功能： $uploadCrop.croppie('result', { type: 'canvas', size: 'viewport' })

.then(function(resp) {

  $('#user-select-image').attr('src', resp.target.result);
  $('#user-select-image').show();
  $("#tttssss").hide();
});});

.then(function(resp) { $('#user-select-image').attr('src', resp.target.result); $('#user-select-image').show(); $("#tttssss").hide(); });}); 您必须使用：代替resp.toDataURL()