1. 程式人生 > >PHP 遠程文件下載的進度條實現

PHP 遠程文件下載的進度條實現

其他 compact AS lose 信息 tint spinner ajax style

download.php

 1 <?php 
 2 // 當前文件:download.php
 3 
 4 $action = @$_GET[‘action‘];
 5 
 6 // 自己獲取這些信息
 7 $remote_url  = get_remote_file_url();
 8 $file_size   = get_remote_file_size($remote_url);
 9 $tmp_path    = get_tmp_path();
10 
11 switch ($action) {
12     case ‘prepare-download‘:
13         // 下載緩存文件夾
14 $download_cache = __DIR__."/download_cache"; 15 16 if (!is_dir($download_cache)) { 17 if (false === mkdir($download_cache)) { 18 exit(‘創建下載緩存文件夾失敗,請檢查目錄權限。‘); 19 } 20 } 21 22 $tmp_path = $download_cache."/update_".time().".zip";
23 24 save_tmp_path(); // 這裏保存臨時文件地址 25 26 return json(compact(‘remote_url‘, ‘tmp_path‘, ‘file_size‘)); 27 28 break; 29 30 case ‘start-download‘: 31 32 // 這裏檢測下 tmp_path 是否存在 33 34 try { 35 set_time_limit(0); 36 37 touch($tmp_path);
38 39 // 做些日誌處理 40 41 if ($fp = fopen($remote_url, "rb")) { 42 43 if (!$download_fp = fopen($tmp_path, "wb")) { 44 exit; 45 } 46 47 while (!feof($fp)) { 48 49 if (!file_exists($tmp_path)) { 50 // 如果臨時文件被刪除就取消下載 51 fclose($download_fp); 52 53 exit; 54 } 55 56 fwrite($download_fp, fread($fp, 1024 * 8 ), 1024 * 8); 57 } 58 59 fclose($download_fp); 60 fclose($fp); 61 62 } else { 63 exit; 64 } 65 66 } catch (Exception $e) { 67 Storage::remove($tmp_path); 68 69 exit(‘發生錯誤:‘.$e->getMessage()); 70 } 71 72 return json(compact(‘tmp_path‘)); 73 74 break; 75 76 case ‘get-file-size‘: 77 78 // 這裏檢測下 tmp_path 是否存在 79 80 if (file_exists($tmp_path)) { 81 // 返回 JSON 格式的響應 82 return json([‘size‘ => filesize($tmp_path)]); 83 } 84 85 break; 86 87 default: 88 # code... 89 break; 90 }

js

 1 // 咋觸發這個函數我就不舉例了
 2 function downloadFile() {
 3     var file_size = 0;
 4     var progress  = 0;
 5 
 6     console.log("Prepared to download");
 7 
 8     $.ajax({
 9         url: ‘./download.php?action=prepare-download‘,
10         type: ‘GET‘,
11         dataType: ‘json‘,
12         beforeSend: function() {
13             $(‘#update-button‘).html(‘<i class="fa fa-spinner fa-spin"></i> 正在準備‘).prop(‘disabled‘, ‘disabled‘);
14         },
15     })
16     .done(function(json) {
17         console.log(json);
18 
19         file_size = json.file_size;
20 
21         $(‘#file-size‘).html(file_size);
22 
23         // 顯示進度條
24 
25         console.log("started downloading");
26         $.ajax({
27             url: ‘./download.php?action=start-download‘,
28             type: ‘POST‘,
29             dataType: ‘json‘
30         })
31         .done(function(json) {
32             // set progress to 100 when got the response
33             progress = 100;
34 
35             console.log("Downloading finished");
36             console.log(json);
37         })
38         .fail(showAjaxError);
39 
40         var interval_id = window.setInterval(function() {
41 
42             $(‘#imported-progress‘).html(progress);
43             $(‘.progress-bar‘).css(‘width‘, progress+‘%‘).attr(‘aria-valuenow‘, progress);
44 
45             if (progress == 100) {
46                 clearInterval(interval_id);
47               
48                 // 到此遠程文件下載完成,繼續其他邏輯
49             } else {
50                 $.ajax({
51                     url: ‘./download.php?action=get-file-size‘,
52                     type: ‘GET‘
53                 })
54                 .done(function(json) {
55                     progress = (json.size / file_size * 100).toFixed(2);
56                   
57                     updateProgress(progress);
58 
59                     console.log("Progress: "+progress);
60                 })
61                 .fail(showAjaxError);
62             }
63 
64         }, 300);
65 
66     })
67     .fail(showAjaxError);
68 
69 }

PHP 遠程文件下載的進度條實現