Plupload 여러 크기의 미리보기 이미지 만들기

미리보기 이미지 생성 및 업로드시이 스레드를 발견했습니다. 트레드는 첫 번째 이미지를 업로드 한 다음 크기를 조정하고 다시 업로드하여 후속 조치하는 방법을 보여줍니다. 최종 결과는 생산 할 수 있도록 또 다른 단계를 추가하는 쉬운 방법이 있는지 궁금 해서요 원래, 중간 크기의 썸네일Plupload 여러 크기의 미리보기 이미지 만들기

A better solution is to trigger QueueChanged in the FileUploaded handler, and then call refresh. This will initiate the upload again for the same file and you can set a property that you read in the BeforeUpload handler to adjust the file size.

경고 # 1 : 전체 크기 이미지 후에 썸네일을 업로드해야합니다, 그렇지 않으면 전체 크기 이미지에 약간의 버퍼 문제가있어 잘릴 수 있습니다.

경고 # 2 : FileUploaded에 대한 바인드 호출이 uploader.init() 이후에 발생하는 경우에만 작동합니다. 그렇지 않으면 FileUploaded의 업 로더 자체 처리기가 처리기 후에 file.status를 다시 덮어 씁니다.

아래 Plupload Thumbnail

uploader.bind('BeforeUpload', function(up, file) { 
    if('thumb' in file) 
     up.settings.resize = {width : 150, height : 150, quality : 100}; 
    else 
     up.settings.resize = {width : 1600, height : 1600, quality : 100}; 
} 

uploader.bind('FileUploaded', function(up, file) { 
    if(!('thumb' in file)) { 
     file.thumb = true; 
     file.loaded = 0; 
     file.percent = 0; 
     file.status = plupload.QUEUED; 
     up.trigger("QueueChanged"); 
     up.refresh(); 
    } 
}

출처

2013-02-07 Mark Hollas

, 나는이 개 약간의 조정과 함께, 내 프로젝트에 있다고했다 매우 간단이 스레드에서 원래의 반응이다.

$diretorio = $_REQUEST["diretorio"]; 
$targetDir = 'upload/'.$diretorio;

및 업로드 인터페이스의 코드를 변경 : 나는 동적으로 디렉토리 정보를 만든 upload.php로에서

uploader.bind('BeforeUpload', function(up, file) { 
    if('thumb' in file){ 

     //thumb 
     up.settings.url = 'upload/upload.php?diretorio=thumbs', 
     up.settings.resize = {width : 100, height : 75, quality : 60}; 

     // medium size 
     up.settings.url = 'upload/upload.php?diretorio=medium', 
     up.settings.resize = {width : 200, height : 150, quality : 60}; 

    }else{ 
     up.settings.url = 'upload/upload.php?diretorio=full-size', 
     up.settings.resize = {quality : 100}; 
    }  
     uploader.bind('FileUploaded', function(up, file) { 
      if(!('thumb' in file)) { 
       file.thumb = true; 
       file.loaded = 0; 
       file.percent = 0; 
       file.status = plupload.QUEUED; 
       up.trigger("QueueChanged"); 
       up.refresh(); 
      } 
    });    
});

출처

2013-04-04 16:14:02

Eduardo de Souza에 의해 주어진 대답은 나에게 매우 유용하지만 이 코드를 작업하기 위해 약간의 변경이 필요합니다. 여기에는 중간 파일을 업로드 할 수 없으며 다른 이미지는 크기 변경 매개 변수로 크기를 조정할 수 없습니다. 내 경우에는 몇 가지 변경 사항을 발견했습니다.

var i = 1; 
uploader.bind('BeforeUpload', function (up, file) { 
       if ('thumb' in file) { 
        if (i == 1) { 
         //thumb 
         up.settings.url = 'http://localhost/plupload_new/public_html/upload.php?diretorio=thumb', 
           up.settings.resize = {width: 80, height: 80, enabled: true}; 
        } else { 
         // medium size 
         up.settings.url = 'http://localhost/plupload_new/public_html/upload.php?diretorio=medium', 
           up.settings.resize = {width: 800, height: 600, enabled: true}; 
        } 
       } else { 
        up.settings.url = 'http://localhost/plupload_new/public_html/upload.php?diretorio=full'; 
       } 
       uploader.bind('FileUploaded', function (up, file) { 
        if (!('thumb' in file)) { 
         file.thumb = true; 
         file.loaded = 0; 
         file.percent = 0; 
         file.status = plupload.QUEUED; 
         up.trigger("QueueChanged"); 
         up.refresh(); 
        } else { 
         if (i < 2) { 
          i++; 
          file.medium = true; 
          file.loaded = 0; 
          file.percent = 0; 
          file.status = plupload.QUEUED; 
          up.trigger("QueueChanged"); 
          up.refresh(); 
         } 
        } 
       }); 
      });

은 이미지 크기를 조절하는 resize 매개 변수에 enabled:true 속성을 추가했으며 i 매개 변수를 사용하여 중간 URL에도 알림을 표시합니다. 유용하다고 생각합니다.

출처

2015-08-10 04:31:41 Priyank

Plupload 여러 크기의 미리보기 이미지 만들기

답변

관련 문제