測試經驗整理
- 使用 chunked 是為了
- 避免無止盡的設定上傳大小
- 避免逾時 Timeout
--
Plupload
--
測試第一步
u.html
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 |
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <script src="../Component_Front/jquery-1.11.3.min.js"></script> <script src="../Component_Front/plupload-2.3.1/js/plupload.full.min.js"></script> </head> <body> <div id="drag-area" class="col-xs-12">拖曳檔案、資料夾或點選上傳</div> <input type="button" value="上傳" id="upload-btn" class="btn btn-primary" /> <script> var uploader = new plupload.Uploader({ runtimes : 'html5', chunk_size: '2mb', file_data_name : 'DSLRFile', drop_element : 'drag-area', browse_button : 'drag-area', //max_file_size : '10mb', url : "./u.php", multipart_params: { Date:'', Category:'', Title:'' } }); uploader.init(); //初始化 //绑定文件添加进队列事件 uploader.bind('FilesAdded',function(uploader,files) { for(var i = 0, len = files.length; i<len; i++) { var file_name = files[i].name; //文件名 //构造html来更新UI var html = '<div id="file-' + files[i].id +'" class="statusbar"><div class="filename">' + file_name + '</div><div class="FileLoaded">0</div><div class="FileSlash">/</div><div class="FileSize">'+ files[i].size +'</div><div class="progressBar"><div style="width: 0;"></div></div></div>'; $(html).appendTo('#file-list'); } }); //绑定文件上传进度事件 uploader.bind('UploadProgress',function(uploader,file){ console.log(file.loaded); $('#file-'+file.id+' .FileLoaded').text(file.loaded); // $('#file-'+file.id+' .FileSize').text(file.size); // $('#file-'+file.id+' .progressBar>div').css('width',file.percent + '%');//控制进度条 }); // 上傳完成 uploader.bind("UploadComplete", function() { $('#file-list').find('div').remove(); }); // 上傳結果 uploader.bind('FileUploaded', function(upldr, file, object) { // 獲取回傳 var Return; try { Return = eval(object.response); } catch(err) { Return = eval('(' + object.response + ')'); } // 失敗顯示錯誤訊息 if ( Return['Result'] ==true ) { $('#Main').append(); } // else { alert( Return['Message'] ); } }); // 開始上傳 $('#upload-btn').click(function() { uploader.start(); }); </script> </body> </html> |
u.php
1 2 |
<?php print_r($GLOBALS); |
輸出
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 |
Array ( [_GET] => Array ( ) [_POST] => Array ( [name] => Serebro - Mi Mi Mi.mp3 [chunk] => 0 [chunks] => 4 ) [_COOKIE] => Array ( [location] => zh-tw ) [_FILES] => Array ( [DSLRFile] => Array ( [name] => blob [type] => application/octet-stream [tmp_name] => /tmp/php01RmfW [error] => 0 [size] => 2097152 ) ) [GLOBALS] => Array *RECURSION* ) Array ( [_GET] => Array ( ) [_POST] => Array ( [name] => Serebro - Mi Mi Mi.mp3 [chunk] => 1 [chunks] => 4 ) [_COOKIE] => Array ( [location] => zh-tw ) [_FILES] => Array ( [DSLRFile] => Array ( [name] => blob [type] => application/octet-stream [tmp_name] => /tmp/phpwcnchg [error] => 0 [size] => 2097152 ) ) [GLOBALS] => Array *RECURSION* ) : : |
--
把分塊的檔案組合
1 2 3 |
<?php $Filename = '/tmp/'.$_POST['name']; exec( ' cat '.$_FILES['DSLRFile']['tmp_name'] .' >> "'. $Filename .'"' ); |
--
原程式修改
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
// 檔案分塊未完成 $Filename = '/tmp/'.$_POST['name']; // 大於兩塊處理 if ( $_POST['chunks'] > 1 ) { if ($_POST['chunks'] - $_POST['chunk'] > 1) { exec(' cat ' . $_FILES['DSLRFile']['tmp_name'] . ' >> "' . $Filename . '"'); echo '1'; exit; } else{ exec(' cat ' . $_FILES['DSLRFile']['tmp_name'] . ' >> "' . $Filename . '"'); rename( $Filename, $_FILES['DSLRFile']['tmp_name'] ); // 還原 _FILES['name'] $_FILES['DSLRFile']['name'] = $_POST['name']; // 完成之後做的事 // ... } } |
--
2,367 total views, 1 views today