本站业务范围:1、PC端软件开发、网站开发 2、移动端APP、网站、微信接口、微商城开发 3、视频教程、毕业设计辅导
 当前位置:文章中心 >> Java_Jsp_Jdk_eclipse_tomcat
立即购买视频教程 php实现大文件断点续传功能
夜鹰教程网 来源:www.yyjcw.com 日期:2017/6/30 16:09:21
分享到:
php实现大文件断点续传功能

这篇文章不能解决你的问题?我们还有相关视频教程哦!

QQ:1416759661 新手QQ群:7835003  加Q远程协助!

在线解答|Demo制作|远程调试| 点击查看相关的视频教程

技术咨询: 购买教程  技术咨询:购买教程  大胆的加QQ咨询。

js代码

[html] view plain copy 在CODE上查看代码片派生到我的代码片

  1. <!DOCTYPE html>  

  2. <html>  

  3.     <head>  

  4.         <meta charset="UTF-8"/>  

  5.         <title>xhr2</title>  

  6.     </head>  

  7.     <body>  

  8.         <div  id="drop_area" style="border:3px dashed silver;width:200px; height:200px">  

  9.             将图片拖拽到此  

  10.         </div>  

  11.           

  12.         <progress value="0" max="10" id="prouploadfile"></progress>  

  13.           

  14.         <span id="persent">0%</span>  

  15.         <br />  

  16.         <!--<button onclick="xhr2()">ajax上传</button>-->     

  17.         <button onclick="stopup()" id="stop">上传</button>      

  18.         <script>  

  19.         //拖拽上传开始  

  20.         //-1.禁止浏览器打开文件行为  

  21.         document.addEventListener("drop",function(e){  //拖离   

  22.             e.preventDefault();      

  23.         })  

  24.         document.addEventListener("dragleave",function(e){  //拖后放   

  25.             e.preventDefault();      

  26.         })  

  27.         document.addEventListener("dragenter",function(e){  //拖进  

  28.             e.preventDefault();      

  29.         })  

  30.         document.addEventListener("dragover",function(e){  //拖来拖去    

  31.             e.preventDefault();      

  32.         })  

  33.         //上传进度  

  34.         var pro = document.getElementById('prouploadfile');  

  35.         var persent = document.getElementById('persent');  

  36.         function clearpro(){  

  37.             pro.value=0;  

  38.             persent.innerHTML="0%";  

  39.         }  

  40.           

  41.         //2.拖拽  

  42.         var stopbutton = document.getElementById('stop');  

  43.           

  44.         var resultfile=""  

  45.         var box = document.getElementById('drop_area'); //拖拽区域     

  46.         box.addEventListener("drop",function(e){           

  47.             var fileList = e.dataTransfer.files; //获取文件对象    

  48.             console.log(fileList)  

  49.             //检测是否是拖拽文件到页面的操作            

  50.             if(fileList.length == 0){                

  51.                 return false;            

  52.             }             

  53.             //拖拉图片到浏览器,可以实现预览功能    

  54.             //规定视频格式  

  55.             //in_array  

  56.             Array.prototype.S=String.fromCharCode(2);  

  57.             Array.prototype.in_array=function(e){  

  58.                 var r=new RegExp(this.S+e+this.S);  

  59.                 return (r.test(this.S+this.join(this.S)+this.S));  

  60.             };  

  61.             var video_type=["video/mp4","video/ogg"];  

  62.               

  63.             //创建一个url连接,供src属性引用  

  64.             var fileurl = window.URL.createObjectURL(fileList[0]);                

  65.             if(fileList[0].type.indexOf('image') === 0){  //如果是图片  

  66.                 var str="<img width='200px' height='200px' src='"+fileurl+"'>";  

  67.                 document.getElementById('drop_area').innerHTML=str;                   

  68.             }else if(video_type.in_array(fileList[0].type)){   //如果是规定格式内的视频                    

  69.                 var str="<video width='200px' height='200px' controls='controls' src='"+fileurl+"'></video>";  

  70.                 document.getElementById('drop_area').innerHTML=str;        

  71.             }else{ //其他格式,输出文件名  

  72.                 //alert("不预览");  

  73.                 var str="文件名字:"+fileList[0].name;  

  74.                 document.getElementById('drop_area').innerHTML=str;      

  75.             }         

  76.             resultfile = fileList[0];     

  77.             console.log(resultfile);      

  78.               

  79.             //切片计算  

  80.             filesizeresultfile.size;  

  81.             setsize=500*1024;  

  82.             filecount = filesize/setsize;  

  83.             //console.log(filecount)  

  84.             //定义进度条  

  85.             pro.max=parseInt(Math.ceil(filecount));   

  86.               

  87.               

  88.               

  89.             i =getCookie(resultfile.name);  

  90.             i = (i!=null && i!="")?parseInt(i):0  

  91.               

  92.             if(Math.floor(filecount)<i){  

  93.                 alert("已经完成");  

  94.                 pro.value=i+1;  

  95.                 persent.innerHTML="100%";  

  96.               

  97.             }else{  

  98.                 alert(i);  

  99.                 pro.value=i;  

  100.                 p=parseInt(i)*100/Math.ceil(filecount)  

  101.                 persent.innerHTML=parseInt(p)+"%";  

  102.             }  

  103.               

  104.         },false);    

  105.           

  106.         //3.ajax上传  

  107.   

  108.         var stop=1;  

  109.         function xhr2(){  

  110.             if(stop==1){  

  111.                 return false;  

  112.             }  

  113.             if(resultfile==""){  

  114.                 alert("请选择文件")  

  115.                 return false;  

  116.             }  

  117.             i=getCookie(resultfile.name);  

  118.             console.log(i)  

  119.             i = (i!=null && i!="")?parseInt(i):0  

  120.               

  121.             if(Math.floor(filecount)<parseInt(i)){  

  122.                 alert("已经完成");  

  123.                 return false;  

  124.             }else{  

  125.                 //alert(i)  

  126.             }  

  127.             var xhr = new XMLHttpRequest();//第一步  

  128.             //新建一个FormData对象  

  129.             var formData = new FormData(); //++++++++++  

  130.             //追加文件数据  

  131.               

  132.             //改变进度条  

  133.             pro.value=i+1;  

  134.             p=parseInt(i+1)*100/Math.ceil(filecount)  

  135.             persent.innerHTML=parseInt(p)+"%";  

  136.             //进度条  

  137.               

  138.               

  139.             if((filesize-i*setsize)>setsize){  

  140.                 blobfileresultfile.slice(i*setsize,(i+1)*setsize);  

  141.             }else{  

  142.                 blobfileresultfile.slice(i*setsize,filesize);  

  143.                 formData.append('lastone', Math.floor(filecount));  

  144.             }  

  145.                 formData.append('file', blobfile);  

  146.                 //return false;  

  147.                 formData.append('blobname', i); //++++++++++  

  148.             formData.append('filename', resultfile.name); //++++++++++  

  149.                 //post方式  

  150.                 xhr.open('POST', 'xhr2.php'); //第二步骤  

  151.                 //发送请求  

  152.                 xhr.send(formData);  //第三步骤  

  153.                 stopbutton.innerHTML = "暂停"  

  154.                 //ajax返回  

  155.                 xhr.onreadystatechange = function(){ //第四步  

  156.                 if ( xhr.readyState == 4 && xhr.status == 200 ) {  

  157.                   console.log( xhr.responseText );  

  158.                         if(i<filecount){  

  159.                             xhr2();  

  160.                         }else{  

  161.                             i=0;  

  162.                         }         

  163.                 }  

  164.               };  

  165.                 //设置超时时间  

  166.                 xhr.timeout = 20000;  

  167.                 xhr.ontimeout = function(event){  

  168.                 alert('请求超时,网络拥堵!低于25K/s');  

  169.               }           

  170.                   

  171.                 i=i+1;  

  172.                 setCookie(resultfile.name,i,365)  

  173.                   

  174.         }  

  175.           

  176.         //设置cookie  

  177.         function setCookie(c_name,value,expiredays)  

  178.         {  

  179.             var exdate=new Date()  

  180.             exdate.setDate(exdate.getDate()+expiredays)  

  181.             document.cookie=c_name+ "=" +escape(value)+  

  182.             ((expiredays==null) ? "" : ";expires="+exdate.toGMTString()+";path=/")  

  183.         }  

  184.         //获取cookie  

  185.         function getCookie(c_name)  

  186.         {  

  187.         if (document.cookie.length>0)  

  188.           {  

  189.           c_start=document.cookie.indexOf(c_name + "=")  

  190.           if (c_start!=-1)  

  191.             {   

  192.             c_start=c_start + c_name.length+1   

  193.             c_end=document.cookie.indexOf(";",c_start)  

  194.             if (c_end==-1) c_end=document.cookie.length  

  195.             return unescape(document.cookie.substring(c_start,c_end))  

  196.             }   

  197.           }  

  198.         return ""  

  199.         }  

  200.           

  201.           

  202.         function stopup(){  

  203.             if(stop==1){  

  204.                 stop = 0  

  205.                   

  206.                 xhr2();  

  207.             }else{  

  208.                 stop = 1  

  209.                 stopbutton.innerHTML = "继续"  

  210.                   

  211.             }  

  212.               

  213.         }  

  214.         </script>  

  215.     </body>  

  216. </html>  


PHP代码

[php] view plain copy 在CODE上查看代码片派生到我的代码片

  1. <?php  

  2. //$name=$_POST['username'];  

  3. $dir=$_POST['filename'];  

  4. $dir="uploads/".md5($dir);  

  5. file_exists($diror mkdir($dir,0777,true);  

  6.   

  7.   

  8. $path=$dir."/".$_POST['blobname'];  

  9.   

  10.   

  11. //print_r($_FILES["file"]);  

  12. move_uploaded_file($_FILES["file"]["tmp_name"],$path);  

  13.   

  14. if(isset($_POST['lastone'])){  

  15.     echo $_POST['lastone'];  

  16.     $count=$_POST['lastone'];  

  17.       

  18.     $fp   = fopen($_POST['filename'],"abw");  

  19.     for($i=0;$i<=$count;$i++){  

  20.         $handle = fopen($dir."/".$i,"rb");    

  21.         fwrite($fp,fread($handle,filesize($dir."/".$i)));    

  22.         fclose($handle);      

  23.     }  

  24.     fclose($fp);  

  25. }  

  26.       

  27.       

  28. ?>  


复制链接 网友评论 收藏本文 关闭此页
上一条:已经是第一条了  下一条: java实现断点续传功能
购买夜鹰教程网视频教程
  推荐教程/优惠活动

  热门服务/教程目录

  夜鹰教程网  新手必看,详细又全面。
  夜鹰教程网  购买教程  夜鹰教程网  在线支付-方便
  夜鹰教程网  担保交易-快捷安全   夜鹰教程网  闪电发货
  夜鹰教程网  电话和QQ随时可以联系我们。
  夜鹰教程网 不会的功能都可以找我们,按工作量收费。

客服电话:153 9760 0032

购买教程QQ:1416759661  购买教程
  热点推荐
初学教程:Java Socket网络编程浅…
Java随机数总结
java读取文本文件内容并获取文件大…
字节流和字符流Java
java常用图片读写程序
怎样成为一个优秀的Java程序员
C++程序员转Java容易吗?难点在哪…
思科培训与华为培训在教材和内容方…
Java注释的使用和定义
使用 Java 实现 Comet 风格的 Web…
利用Java实现zip压缩/解压缩
Java Web三层架构的配置详解
Java Socket编程之我见
使用 Java 实现 Comet 风格的 Web…
两种J2ME网络编程的方法之一
  尊贵服务
夜鹰教程网 承接业务:软件开发 网站开发 网页设计 .Net+C#+VS2008+MSsql+Jquery+ExtJs全套高清完整版视频教程
  最近更新
php实现大文件断点续传功能
java实现断点续传功能
Windows Server 2016新功能
MyEclipse 8.5 汉化方法
jquery实现无刷新分页
什么是JSON?
什么是回调函数
jQuery 1.7下载
jquery加载XML文档
什么是MVC(三层架构)
网页中如何实现音乐和歌词同步
初学教程:Java Socket网络编程浅…
思科培训与华为培训在教材和内容方…
Java随机数总结
字节流和字符流Java
  工具下载  需要远程协助? 购买教程

sql2008视频教程 c#视频教程

VIP服务:如果您的某个功能不会做,可以加我们QQ,给你做DEMO!

JQUERY  Asp.net教程

MVC视频教程  vs2012
.NET+sql开发
手机:15397600032 C#视频教程下载
vs2012 vs2008 vs2010 sql2008 sql2005
Asp.Net  

教程咨询QQ:1416759661


这篇文章不能解决你的问题?我们还有相关视频教程哦!

QQ:1416759661 新手QQ群:7835003  加Q远程协助!

在线解答|Demo制作|远程调试| 点击查看相关的视频教程

技术咨询: 购买教程  技术咨询:购买教程  大胆的加QQ咨询。

关于我们 | 广告投放 | 购买教程 | 网站建设 | 技术辅导 | 常见问题 | 联系我们 | 友情链接 | 购买教程

Nighthawk Tutorials Network 快捷购买教程

夜鹰教程网 版权所有 www.yyjcw.com All rights reserved 备案号:蜀ICP备08011740号3

 

出售asp.net系列视频教程 高清原创版 每天晚上20:30--23:00在线 按照编号从简单到高级 http://www.yyjcw.com/list.html