Croppie JS使用jquery分离裁剪函数和上载函数

我已经得到了这个工作代码，但我想调整一些东西，我想分开裁剪和上传，但问题是我不知道如何获得裁剪图像的结果，当我点击裁剪按钮，然后使用它发送我的upload.php时，上传按钮被点击

我已经尝试搜索和我一样的问题，所以我不需要在这里发布问题，也不需要打扰任何人，但仍然没有运气。我也阅读了文档，但我仍然不知道该怎么办。请帮帮我，我困在这里了。。 多谢各位

**这是我的护照**

https://jsfiddle.net/eds_gavino/n34ybcwm/11/

**这是我的upload.php**

//upload.php

if(isset($_POST["image"]))
{
    $data = $_POST["image"];
    $image_array_1 = explode(";", $data);
    $image_array_2 = explode(",", $image_array_1[1]);
    $data = base64_decode($image_array_2[1]);
    $imageName = time() . '.png';
    file_put_contents($imageName, $data);
    echo '<img src="'.$imageName.'" class="img-thumbnail" />';
}
?>

//upload.php
如果（isset（$_POST[“image”]））
{
$data=$_POST[“图像”]；
$image_array_1=分解（“；”，$data）；
$image\u array\u 2=分解（“，”，$image\u array\u 1[1]）；
$data=base64_解码（$image_数组_2[1]）；
$imageName=time（）.'.png'；
文件内容（$imageName，$data）；
回声'；
}
?>

试试这个：

$data = filter_input(INPUT_POST, 'image', FILTER_SANITIZE_STRING);

if($data) {

    $splited = explode(',', substr( $data , 5 ) , 2);
    $mime=$splited[0]; 
    $data=$splited[1]; 

    $mime_split_without_base64 = explode(';', $mime,2);
    $mime_split = explode('/', $mime_split_without_base64[0],2);
    if(count($mime_split) == 2)
    {
        $extension = $mime_split[1]; 

        // change png to jpg if required
        $extension = 'jpg';

        $new_file_name = 'avatar.'.$extension; // create new file avatar.jpg

        $directory = $_SERVER['DOCUMENT_ROOT'].'/upload/'; // directory upload in root document

        file_put_contents( $directory.$new_file_name, base64_decode($data) );

     }
}

---

我更新了我的Jsfidle，我能够得到裁剪图像的结果，但是我仍然不知道如何使用AJAX在upload.php中传递数据。希望有人能在这方面帮助我，我已经尝试过在croppie js GIT中发布这篇文章，但也没有得到回应