обрезка и ajax загрузка изображения

Question

Я хочу загрузить и обрезать изображение через ajax.

Просьба предложить, как я могу это сделать.

Answer 1

Чтобы загрузить изображение, вам понадобится обработчик javascript, обрабатывающий загрузку, для его использования есть много плагинов, если вы используете библиотеку jquery. Чтобы обработать процесс загрузки, вам понадобится PHP-скрипт. Вы отправляете запрос на php-скрипт из ajax и загружаете его.

Для обрезки изображения вам нужен инструмент кадрирования или кадрировании сценарий здесь прохладный один http://www.webresourcesdepot.com/jquery-image-crop-plugin-jcrop/

После обработаны кадрирований вам нужно выполнить UPLOADING процесс (PHP) с помощью JQuery загрузчика плагина или другого JQuery или JavaScript У Аякса код.

Answer 2

Here is the code Jquery + PHP [Cake PHP] 

View file upload.ctp 

<script type="text/javascript" src="http://demos.9lessons.info/ajaximageupload/scripts/jquery.form.js"></script> 
<script type="text/javascript"> 
$(document).ready(function(){ 
    $('#photoimg').on('change', function(){ 
    $("#preview").html(''); 
    $("#preview").html('<img src="/images/ajax-loader.gif" alt="Uploading...."/>'); 
    $("#imageform").ajaxForm({target: '#preview',success: showResponse}).submit(); 
    }); 

}); 


</script> 

<form id="imageform" method="post" enctype="multipart/form-data" action='/media/upload'> 
Upload image <input type="file" name="photoimg" id="photoimg" /> 
</form> 

<div id='preview'></div> 



create a function with name upload in Media controller 



    function upload(){ 
     $this->layout = ''; 

     $session_id='1'; // User session id 
     $path = "images/media/images/original/"; 
     $valid_formats = array("jpg", "png", "gif", "bmp","jpeg"); 

if(isset($_POST) and $_SERVER['REQUEST_METHOD'] == "POST"){ 
     //pr($_FILES);die; 
     //if(isset($_POST) and $_SERVER['REQUEST_METHOD'] == "POST"){ 
     $name = $_FILES['photoimg']['name']; 
     $size = $_FILES['photoimg']['size']; 
      if(strlen($name)) { 
      list($txt, $ext) = explode(".", $name); 
      if(in_array($ext,$valid_formats)){ 
       if($size<(1024*1024)) { // Image size max 1 MB 
       $txt=str_replace(" ","_",$txt); 
       $actual_image_name = $txt."_".time().".".$ext; 
       $tmp = $_FILES['photoimg']['tmp_name']; 
       App::import('Vendor', 'resize'); 
       if(move_uploaded_file($tmp, $path.$actual_image_name)) { //Code for image resize 
        //mysql_query("UPDATE users SET profile_image='$actual_image_name' WHERE uid='$session_id'"); 
        // save this to DB into Temp Selection table set USer wise and Capsule or individual Board wise 
        echo "<img src='/images/media/images/".$actual_image_name."' class='preview'><br/><a href='javascript:void(0);' id='upload_submit'>Submit</a>"; 
       } 
       else 
       echo "failed"; 
       } 
      else 
      echo "Image file size max 1 MB"; 
      } 
      else 
      echo "Invalid file fo`enter code here`rmat.."; 
      } 
     else 
     echo "Please select image..!"; 
     exit; 
     } 

    }