S3 용 Plupload HTML4 업로드 사용 방법은 무엇입니까?

Question

Plupload의 html4 런타임을 S3와 함께 사용하려고합니다. 불행하게도 example I found here은 실제로 오래된 버전의 plupload이거나 제대로 문서화되어 있지 않아야하며 라이브로 작동하는 예제 나 소스 코드 다운로드가 없어야합니다.

그래서 나는 S3에 Plupload/플래시 런타임의 내 작업 버전을했다 단순히 대신 플래시의 HTML4 런타임을 넣어 'success_action_redirect': (나는 파일 업로드가 완료되면이가 알고 plupload을 위해 필요하다고 plupload 포럼에서 배운) 추가. 실제로 작동한다는 것을 알게되었지만 일부 스크립트는 실패합니다. 여기

내 소스 코드는 ...

PHP :

<?php 
$bucket = 'MyBucket'; 
$accessKeyId = 'MyKey'; 
$secret = 'MySecret'; 

// Policy Setup 
if (!function_exists('hash_hmac')) : function hash_hmac($algo, $data, $key, $raw_output = false){ 
    $blocksize = 64; 
    if (strlen($key) > $blocksize) 
     $key = pack('H*', $algo($key)); 

    $key = str_pad($key, $blocksize, chr(0x00)); 
    $ipad = str_repeat(chr(0x36), $blocksize); 
    $opad = str_repeat(chr(0x5c), $blocksize); 
    $hmac = pack('H*', $algo(($key^$opad) . pack('H*', $algo(($key^$ipad) . $data)))); 

    return $raw_output ? $hmac : bin2hex($hmac); 
} 
endif; 
// prepare policy 
$policy = base64_encode(json_encode(array(
    'expiration' => date('Y-m-d\TH:i:s.000\Z', strtotime('+1 day')), 
    'conditions' => array(
     array('bucket' => $bucket), 
     array('acl' => 'authenticated-read'), 
     array('success_action_redirect' => 'http://mydomain.com/ThisCanBeAnyPage.php'), 
     array('starts-with', '$key', ''), 
     array('success_action_status' => '201'), 
     array('starts-with', '$name', ''), 
     array('starts-with', '$Filename', ''), 
    ) 
))); 
// Sign Policy 
$signature = base64_encode(hash_hmac('sha1', $policy, $secret, true)); 
?> 

자바 스크립트 :

<script type="text/javascript" src="js/plupload.full.js"></script> 
<script type="text/javascript" src="js/plupload.html4.js"></script> 
<script type="text/javascript"> 
// Custom example logic 
$(function() { 
    var uploader = new plupload.Uploader({ 
     preinit : { 
      UploadFile: function(up, file) { 
     // When file is loaded, directory on S3 is set here. 
       up.settings.multipart_params.key = 'myFolder/'+file.name; 
      } 
     }, 
     runtimes : 'html4', 
     browse_button : 'pickfiles', 
     container : 'container', 
     url : 'http://<?php echo $bucket; ?>.s3.amazonaws.com/', 
     max_file_size : '300mb', 
     multipart: true, 
     multipart_params: { 
      'key': '${filename}', // use filename as a key 
      'success_action_redirect':'http://mydomain.com/ThisCanBeAnyPage.php', 
      'Filename': '${filename}', // adding this to keep consistency across the runtimes 
      'acl': 'authenticated-read', 
      'success_action_status': '201', 
      'AWSAccessKeyId' : '<?php echo $accessKeyId; ?>',  
      'policy': '<?php echo $policy; ?>', 
      'signature': '<?php echo $signature; ?>' 
     }, 
     file_data_name: 'file', 
     multiple_queues: true, 
     filters : [ 
      {title : "Image Files", extensions : "jpg,jpeg"}, 
     ], 
     flash_swf_url : 'js/plupload.flash.swf', 
     silverlight_xap_url : 'js/plupload.silverlight.xap' 
    }); 

    uploader.bind('Init', function(up, params) { 
     //$('#filelist').html("<div>Current runtime: " + params.runtime + "</div>"); 
    }); 

    $('#uploadfiles').click(function(e) { 
     uploader.start(); 
     e.preventDefault(); 
    }); 

    uploader.bind('FilesAdded', function(up, files) { 
     $.each(files, function(i, file) { 
     // file.name seems to be the only thing that is returned so file.size is displayed as 'N/A' 
      $('#filelist').append(
       '<div class="Section" id="'+file.id+'">' 
        +file.name+' ('+plupload.formatSize(file.size)+')&nbsp;&nbsp;<b>' 
        +'</b><div class="PlupLoadingBarWrap"><div class="PlupLoadingBar"></div></div>' 
       +'</div>' 
      ); 
     }); 
     up.refresh(); // Reposition Flash/Silverlight 
    }); 

    uploader.bind('UploadProgress', function(up, file) { 
     // file.name seems to be the only thing that is returned 
     // This triggers when file is complete before 'FileUploaded' and not during upload process. 
    }); 

    uploader.bind('Error', function(up, err) { 
     // Haven't received an error to know if this works. 
     $('#filelist').append("<div>Error: " + err.code + 
      ", Message: " + err.message + 
      (err.file ? ", File: " + err.file.name : "") + 
      "</div>" 
     ); 

     up.refresh(); // Reposition Flash/Silverlight 
    }); 

    uploader.bind('FileUploaded', function(up, file) { 
     // file.name seems to be the only thing that is returned 
     // This does trigger once file is completely loaded 
    }); 

    uploader.bind('UploadComplete', function(up, files){ 
     // Calls a function 
    }); 

    uploader.init(); 
}); 
</script> 

HTML :

<h3>Custom example</h3> 
<div id="container"> 
    <div id="filelist">No runtime found.</div> 
    <br /> 
    <a id="pickfiles" href="#">[Select files]</a> 
    <a id="uploadfiles" href="#">[Upload files]</a> 
</div> 

결론적으로이 스크립트는 작동하지만 file.size가 부족하고 내가 찾은 결과에 따라 진행 상황이 표시되지 않습니다. 여기에 누락 된 것들을 포함하는 plupload html4 스크립트가 있는지 알고 싶습니다. 나는 아직 테스트하지 않았 음을 염두에두고 해결책을 가지고있다. 그러나 나는 이것을 최신 상태로 유지할 것이다.

Answer 1

간단한 대답은 아니오입니다.

HTML4 자체는 이러한 기능을 지원하지 않습니다.

하지만 제출 기능을 사용하면 문제를 해결할 수 있습니다. 기본적으로 클라이언트에서 청크를 조작하고 게시물을 사용하여 청크를 제출하고 청크 수를 제어하여 진행률 표시 줄을 만들어야합니다. 그 이론은 단순하지만 실제로는 못생긴 것입니다. 왜 당신은 플래시 또는 실버 주사를 사용할 수 있습니까?