zoukankan      html  css  js  c++  java
  • Ajax大文件切割上传

    1问:在不更改php.ini中post_max_size的情况下怎么实现大文件的上?

      答把大文件切割成许多小块,分块上传,传完后,重新合并成大文件即可。

    2问:怎么切割?

      答:用html5中的file API,这个API继承自Blob对象,Blob中有slice方法,可以截取二进制对象的一部分,实现切割大文件的效果。

    3问:具体思路呢?

      答:截取10M上传,判断是否截取完毕

        

    while 还有数据{
          截取,
         Ajax上传            
    }
     1 <script type="text/javascript">
     2 unction sendfile() {
     3     const LENGTH = 10 * 1024 * 1024;
     4     var sta = 0;
     5     var end = sta + LENGTH;
     6     var blob = null;
     7     var fd = null;
     8 
     9     /*
    10         xhr 对象
    11     */
    12     var xhr = null;
    13 
    14     var mov = document.getElementsByName('mov')[0].files[0];
    15     //console.log(mov);return;
    16     
    17     var totalsize = mov.size;
    18     var percent = 0;
    19 
    20     while(sta < totalsize) {
    21         blob = mov.slice(sta,end);
    22         fd = new FormData();
    23         fd.append('part',blob);
    24 
    25         xhr = new XMLHttpRequest();
    26         xhr.open('POST','06-sliceup.php',false);
    27 
    28         xhr.send(fd);
    29 
    30         sta = end;
    31         end = sta + LENGTH; 
    32 
    33         percent = 100 * end / totalsize;
    34         if(percent > 100) {
    35             percent = 100;
    36         }
    37         document.getElementById('bar').style.width = percent + '%';
    38         document.getElementById('bar').innerHTML = parseInt(percent) + '%';
    39     }
    40 
    41 }
    42 
    43 
    44 </script>

    html页面

    </head>
        <body>
            <h1>html5大文件切割上传</h1>
            <div id="progress">
                <div id="bar"></div>
            </div>
            <input type="file" name="mov" onchange="sendfile();" />
        </body>
    </html>
    

      

    后台要有个php页面,把文件接收并合并起来

    1 if(!file_exists('./upload/hhr.mov')) {
    2     move_uploaded_file($_FILES['part']['tmp_name'],'./upload/hhr.mov');
    3 } else {
    4     file_put_contents('./upload/hhr.mov',file_get_contents($_FILES['part']['tmp_name']),FILE_APPEND);
    5 }
    6 
    7 echo 'ok';
  • 相关阅读:
    设计模式
    包装类
    php 闭包的理解
    is_null empty isset等的判定
    PHP基础一 $this ,static 和 self的区别
    lumen安装踩过得坑
    composer的使用和安装
    使用submine来写c++
    php 和 thinkphp中的常量一览
    路径问题 ./ / ../ 空 的区别
  • 原文地址:https://www.cnblogs.com/a2762/p/4106995.html
Copyright © 2011-2022 走看看