php ajax jcrop 裁剪图片,并预览

        </div>
        
       <div id="setCutPic" class="form-group" style="display:none">
            <label class="col-sm-1 control-label control-label-alignr"
                   style="padding-right:15px;width:auto">剪图设置</label>
            <div class="col-sm-1 mr20">
                <input type="text" class="form-control" id="target_w" name="target_w" value=""/>
            </div>
            <label class="mr20 china-center"><code>&nbsp;X&nbsp;</code></label>
            <div class="col-sm-1 mr20">
                <input type="text" class="form-control" id="target_h" name="target_h" value=""/>
            </div>
            <label class="mr20 china-center"><code>&nbsp;(宽X高)&nbsp;</code></label>
            <div class="col-sm-1 mr20">
                <input type="button" id="ar_lock" class="btn btn-info-alt" value="设置裁区"/>
            </div>
            <div class="col-sm-1">
                <input type="button" name="btn" class="btn btn-info-alt" value="裁剪"/>
            </div>
          
            <label class="china-center col-sm-8" style="margin-left: 90px"><code>若不设置图片宽高<b style="color: #46b8da;">裁剪后</b>默认尺寸为:<i id="default_size"></i></code></label>
            <!-- 其他裁剪位置参数-->
            <input type="text" type="hidden" id="x" name="x"/>
            <input type="text" type="hidden" id="y" name="y"/>
            <input type="text" type="hidden" id="x2" name="x2"/>
            <input type="text" type="hidden" id="y2" name="y2"/>
           
       </div>
       <div id="preview-div" class="form-group" style="display:none">
        <label class="col-sm-1 control-label control-label-alignr"
               style="padding-right:15px;width:auto">预览图片</label>
        <div id="target_box" class="col-sm-1 mr20">
            <canvas id="can" ></canvas>
        </div>
    </div>
     
<input type="hidden" id="uploadId" value="">

以下是php

public function save_stream_to_image_fine(){
$result = $data = array();

    $data =  $_POST['img'];
    if($data){
        $data = urldecode($data);
        if(strstr($data,",")){
            $data = explode(',',$data);
            $data = $data[1];
        }
        //echo $data;
        $data=base64_decode($data);
    }

    if($data){
        $tmp_name = rand(0,1000000099).".jpg";
        file_put_contents($tmp_name,$data);
         
        $result['msg']  = '上传图片成功';
        $result['code'] = 200;
        $result['url']  = $tmp_name;
     }
    echo json_encode($result);
}

Jcrop jquery bootstrap 需要自己下载

posted @ 2021-04-08 17:01  经验源于积累  阅读(59)  评论(0编辑  收藏  举报