Загрузить и преобразовать наиболее распространенные типы изображений в png для фонового изображения холста ткани

0

Я пытаюсь правильно загрузить этот сценарий для загрузки и преобразования изображений. У меня был сценарий, загружающий любые допустимые изображения и переименовывая их в порядке, но затем я добавил код преобразования, и я не могу заставить его работать правильно. Я прокомментировал //imagepng ($ image); потому что это заставило успех div заполнить "PNG IHDR G, } IDATx я u' s ] %....... Я работал над этим в течение двух дней глядя на множество сообщений на Stack и думал, что я понял, что нужно. Если бы кто-нибудь мог посмотреть на это и, возможно, пролить свет на мою проблему, я бы очень признателен. В текущей конфигурации я не получаю ошибок на сервере. Благодарю!

PHP

 <?php
    include_once $_SERVER['DOCUMENT_ROOT'].'/include/session.php';

     // Detect the file params according to need
 $filename = $_FILES["myfile"]["name"];
 $filesize = $_FILES["myfile"]["size"];
 $tmp_name = $_FILES["myfile"]["tmp_name"];
 $custnum = $session->custnum; //Users account number from session

// Valid extensions for Upload
    $validExtensions = array('.jpeg', '.jpg', '.gif', '.png');

// Valid size in KB
  $max_size = 6000;

  // Detect file extension
    $extension = strtolower(strrchr($filename, "."));

      // Convert filesize in KB
       $getFileSize = round($filesize / 1024, 1);

         //Make the storage directory
           if (!file_exists("maps/accounts/".$custnum)) {
          mkdir("maps/accounts/".$custnum, 0777, true);
           }

            // Location to store the file
         $path = str_replace('\/\\', '/', dirname(__FILE__)) . "/maps/accounts/".$custnum;

if( in_array($extension, $validExtensions) ){

 if( $getFileSize < $max_size ){

     if(is_dir($path)){

        //***********Start of image conversion***********

         $srcFile = $tmp_name;

list($width_orig, $height_orig, $type) = getimagesize($srcFile);        

// Get the aspect ratio
$ratio_orig = $width_orig / $height_orig;

//Set max size
$width  = 900; 
$height = 600;

// resize to height (orig is portrait) 
if ($ratio_orig < 1) {
    $width = $height * $ratio_orig;
} 
// resize to width (orig is landscape)
else {
    $height = $width / $ratio_orig;
}

// Temporarily increase the memory limit to allow for larger images
ini_set('memory_limit', '32M'); 

switch ($type) 
{
    case IMAGETYPE_GIF: 
        $image = imagecreatefromgif($srcFile); 
        break;   
    case IMAGETYPE_JPEG:  
        $image = imagecreatefromjpeg($srcFile); 
        break;   
    case IMAGETYPE_PNG:  
        $image = imagecreatefrompng($srcFile);
        break; 
    default:
        throw new Exception('Unrecognized image type ' . $type);
}

         // create a new blank image
   $newImage = imagecreatetruecolor($width, $height);

       // Copy the old image to the new image
   imagecopyresampled($newImage, $image, 0, 0, 0, 0, $width, $height, $width_orig, $height_orig);  

      imagepng($newImage, $path . '/' . $custnum.'.png');
      imagedestroy($image);
      imagedestroy($newImage);      

        //******End of image conversion****************     



                // Success Message
           echo "<div id='success' class='alert alert-success'><strong>Your map image was uploaded!</strong>
                    <button type=\"button\" class=\"close\" data-dismiss=\"alert\">&times;</button>
                 </div>";


     } else {
                  trigger_errors("Directory not Found!<br /> $path");
                  }

      } else {
      $error_msg = "<strong>Filesize should be less then $max_size KB!</strong><br />Your file is about $getFileSize KB";
     trigger_errors($error_msg);
  }

    } else {
         $error_msg = "<strong>File not Supproted for Upload!</strong><br />
                Please try with the files that has following extensions: .jpg, .jpeg, .gif, .png";
      trigger_errors($error_msg);
      }

   // Make function that
  // generate the Error
  function trigger_errors( $error_msg ){
   echo "<div class='alert alert-error'>
     <button type=\"button\" class=\"close\" data-dismiss=\"alert\">&times;</button>
     $error_msg
     </div>";
   }

   ?>

Здесь мой сценарий JQuery Ajax, который является isty.int.com.js kitchensink.js, который вызывает вышеупомянутый PHP-скрипт.

JQuery Ajax

$('#loading').hide();
$(function(){
var $form = $('#myform'),
    $result = $('#result');

$('form').on('change','#myfile', function(){
    $('#loading').show();
    $result.ajaxStart(function(){

    }); 

    $form.ajaxForm({
        target: $result

    }).submit();

          $( document ).ajaxComplete(function() {
               $('#loading').delay(1500).hide('slow');

            if ($('#success').hasClass('alert-success')){    
               canvas.setBackgroundImage(fullurl  , function() {
               canvas.renderAll();
                 });};
          });
});            

})

Здесь мой текущий html, который вызывает процессор изображения Ajax и php. Этот html получает обратную связь от успеха php и ajax или не дает обратной связи пользователю.

HTML

<div>
  <form id="myform" action="image_uploader.php" method="post" enctype="multipart/form-data">
      <table align="center">
          <tr>
              <td width="100"><label>Select File: </label></td>
             <td>
                  <input class="btn shape" type="file" id="myfile" name="myfile">
              </td>
          </tr>
      </table>
  </form>
<div id="loading"><img src="fabric/img/loadingbar.gif" width="200" height="15" alt="" border="0"><img src="fabric/img/uploading-text.GIF" width="128" height="19" alt="" border="0"></div>
</div>
<div id="result"></div>
Теги:
fabricjs

2 ответа

2

Вам не нужно называть move_uploaded_file самом деле. Фактически, вы не получите желаемых результатов, если вы это сделаете.

// create a new blank image
$newImage = imagecreatetruecolor($width, $height);

// Copy the old image to the new image
imagecopyresampled($newImage, $image, 0, 0, 0, 0, $width, $height, $width_orig, $height_orig);  

imagepng($newImage, $path . '/' . $custnum);
imagedestroy($image);
imagedestroy($newImage);

Причина, по которой вы захотите сделать это, заключается в том, что вторым аргументом imagepng может быть путь для сохранения файла. Поскольку вы перешли на все проблемы с преобразованием файла, вызов move_uploaded_file переместит исходный файл в имя файла png. Поэтому, если я загружу JPEG со своим скриптом, он перенесет этот JPEG в example.png. Другими словами, это не будет PNG, это все равно будет JPEG.

Причина, по которой он сбрасывает то, как вы пишете, заключается в том, что без этого пути функция возвращает необработанное изображение, поэтому ваш браузер пытается интерпретировать эти двоичные данные как текст и, таким образом, вы получаете тарабарские и случайные символы.

  • 0
    Чувак! Это сработало. Большое спасибо. Я добавлю свой код, чтобы другие могли его использовать.
1

Вы просто перемещаете загруженный файл.

Итак.. Удалите эту строку..

header('Content-Type: image/png');

Ещё вопросы

Сообщество Overcoder
Наверх
Меню