PHP 远程文件下载的进度条实现

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 }