时间戳

首页 > 解决方案 > Croppie JS 使用 jquery 分离裁剪功能和上传功能

jquery - Croppie JS 使用 jquery 分离裁剪功能和上传功能

问题描述

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

我已经尝试搜索与我相同的问题，所以我不需要在这里发布问题并打扰任何人但仍然没有运气我也阅读了文档但我仍然不知道该怎么做。请帮助我卡在这里..谢谢

** 这是我的 JSfiddle **

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

** 这是我的上传.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" />';
}
?>

标签： jqueryajaxcroppie

解决方案

尝试这个 ：

$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) );

     }
}

推荐阅读