0

我有一种情况，用户选择照片并对其进行裁剪。裁剪传递给隐藏输入的编码数据已成功，但在发布我的表单时，图像数据未发布。仅显示空白页。

相同的代码在本地服务器上运行良好。但是在实时服务器上，这发生在我身上。

让我分享我的代码。请指导我哪里做错了。

$(".gambar").attr("src", "<?php echo base_url().'assets/img/users/defualt.jpg");
  var $uploadCrop,
  tempFilename,
  rawImg,
  imageId;
  function readFile(input) {
    if (input.files && input.files[0]) {
            var reader = new FileReader();
            reader.onload = function (e) {
        $('.upload-demo').addClass('ready');
        $('#cropImagePop').modal('show');
              rawImg = e.target.result;
            }
            reader.readAsDataURL(input.files[0]);
        }
        else {
          swal("Sorry - you're browser doesn't support the FileReader API");
      }
  }

  $uploadCrop = $('#upload-demo').croppie({
    viewport: {
      width: 150,
      height: 150,
      type: 'circle'
    },
    boundary: {
      width: 265,
      height: 265
    },
    enforceBoundary: false,
    enableExif: true,
    enableOrientation: true,
    orientation: 4,
  });
  $('#cropImagePop').on('shown.bs.modal', function(){
    $uploadCrop.croppie('bind', {
          url: rawImg
        }).then(function(){
        });
  });

  $('.item-img').on('change', function () { 
    imageId = $(this).data('id'); 
    tempFilename = $(this).val();
    $('#cancelCropBtn').data('id', imageId); 
    readFile(this); });
  $('#cropImageBtn').on('click', function (ev) {
    $uploadCrop.croppie('result', {
      type: 'canvas',
      format: 'jpeg',
      size: {width: 150, height: 150}
    }).then(function (resp) {
      $('#imageEncoder').val(resp);
      $('#item-img-output').attr('src', resp);
      $('#cropImagePop').modal('hide');
      $('#profile_form').submit();
    });
  });
<form action="<?= base_url().'userController/update_staff_picture' ?>" method="post" enctype="multipart/form-data" id="profile_form">
      <input type="hidden" name="imageEncoder" id="imageEncoder">
      <label class="cabinet center-block">
       <figure>
        <img src="" class="gambar img-responsive img-thumbnail img-circle" id="item-img-output" />
         <figcaption><i class="fa fa-camera"></i></figcaption>
       </figure>
       <input type="file" class="item-img file center-block" name="file_photo"/>
      </label>
    </form>

用户控制器

public function update_staff_picture(){

        $data = $this->input->post('imageEncoder');

        echo "<pre>";
        print_r($data);
        exit();
        list($type, $data) = explode(';', $data);
        list(, $data)      = explode(',', $data);
        $data = base64_decode($data);
        $image_name = date('ymdgis').'.png';
        $req['image']=$image_name;


        file_put_contents('./assets/img/users/'.$image_name, $data);

        $this->db->set($req);
        $this->db->where('userID',$userID);
        $this->db->update('users');

        redirect(base_url().'staff-profile/'.$_POST['userID']);

}
4

0 回答 0