PHP大文件切割上传并带进度条功能示例


Posted in PHP onJuly 01, 2019

本文实例讲述了PHP大文件切割上传并带进度条功能。分享给大家供大家参考,具体如下:

前面一篇介绍了PHP大文件切割上传功能,这里再来进一步讲解PHP大文件切割上传并带进度条功能。

项目结构图:

PHP大文件切割上传并带进度条功能示例

14-slice-upload-fix.html文件:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>大文件切割上传带进度条</title>
  <link rel="stylesheet" href="">
<script>
var xhr = new XMLHttpRequest();//xhr对象
var clock = null;
function selfile(){
  clock = window.setInterval(sendfile,1000);
}
var sendfile = (function (){
  const LENGTH = 1024 * 1024 * 10;//每次上传的大小
  var start = 0;//每次上传的开始字节
  var end = start + LENGTH;//每次上传的结尾字节
  var sending = false;//表示是否正在上传
  var fd = null;//创建表单数据对象
  var blob = null;//二进制对象
  var percent = 0;
  return (function (){
    //如果有块正在上传,则不进行上传
    if(sending == true){
      return;
    }
    var file = document.getElementsByName('video')[0].files[0];//文件对象
    //如果sta>file.size,就结束了
    if(start > file.size){
      clearInterval(clock);
      return;
    }
    blob = file.slice(start,end);//根据长度截取每次需要上传的数据
    fd = new FormData();//每一次需要重新创建
    fd.append('video',blob);//添加数据到fd对象中
    up(fd);
    //重新设置开始和结尾
    start = end;
    end = start + LENGTH;
    sending = false;//上传完了
    //显示进度条
    percent = 100 * start/file.size;
    if(percent>100){
      percent = 100;
    }
    document.getElementById('bar').style.width = percent + '%';
    document.getElementById('bar').innerHTML = parseInt(percent)+'%';
  });
})();
function up(fd){
  xhr.open('POST','13-slice-upload.php',false);
  xhr.send(fd);
}
</script>
<style>
  #progress{
    width:500px;
    height:30px;
    border:1px solid green;
  }
  #bar{
    width:0%;
    height:100%;
    background-color: green;
  }
</style>
</head>
<body>
  <h1>大文件切割上传带进度条</h1>
  <div id="progress">
    <div id="bar"></div>
  </div>
  <input type="file" name="video" onchange="selfile();" />
</body>
</html>

13-slice-upload.php文件:

<?php
/**
 * 大文件切割上传,把每次上传的数据合并成一个文件
 * @author webbc
 */
$filename = './upload/upload.wmv';//确定上传的文件名
//第一次上传时没有文件,就创建文件,此后上传只需要把数据追加到此文件中
if(!file_exists($filename)){
  move_uploaded_file($_FILES['video']['tmp_name'],$filename);
}else{
  file_put_contents($filename,file_get_contents($_FILES['video']['tmp_name']),FILE_APPEND);
}
?>

运行结果图:

PHP大文件切割上传并带进度条功能示例

希望本文所述对大家PHP程序设计有所帮助。

PHP 相关文章推荐
PHPnow安装服务[apache_pn]失败的问题的解决方法
Sep 10 PHP
Ajax实时验证用户名/邮箱等是否已经存在的代码打包
Dec 01 PHP
PHP截断标题且兼容utf8和gb2312编码
Sep 22 PHP
php计算两个整数的最大公约数常用算法小结
Mar 05 PHP
PHP连接操作access数据库实例
Mar 30 PHP
Laravel 5框架学习之子视图和表单复用
Apr 09 PHP
PHP实现抓取迅雷VIP账号的方法
Jul 30 PHP
php实现递归的三种基本方式
Jul 04 PHP
thinkPHP中分页用法实例分析
Dec 26 PHP
Yii2实现多域名跨域同步登录退出
Feb 04 PHP
PHP编程实现微信企业向用户付款的方法示例
Jul 26 PHP
php post换行的方法
Feb 03 PHP
PHP大文件切割上传功能实例分析
Jul 01 #PHP
PHP使用反向Ajax技术实现在线客服系统详解
Jul 01 #PHP
PHP封装cURL工具类与应用示例
Jul 01 #PHP
PHP session垃圾回收机制实例分析
Jun 28 #PHP
PHP常用的类封装小结【4个工具类】
Jun 28 #PHP
php实现网页上一页下一页翻页过程详解
Jun 28 #PHP
php输出控制函数和输出函数生成静态页面
Jun 27 #PHP
You might like
PHP把数字转成人民币大写的函数分享
2014/06/30 PHP
codeigniter中实现一次性加载多个view的方法
2015/03/20 PHP
使用 PHPStorm 开发 Laravel
2015/03/24 PHP
php生成静态页面并实现预览功能
2019/06/27 PHP
js 限制数字 js限制输入实现代码
2012/12/04 Javascript
js实现文本框中输入文字页面中div层同步获取文本框内容的方法
2015/03/03 Javascript
jquery不常用方法汇总
2015/07/26 Javascript
AngularJS入门教程之AngularJS指令
2016/04/18 Javascript
PassWord输入框代码分享
2016/06/07 Javascript
AngularJS基础 ng-mouseover 指令简单示例
2016/08/02 Javascript
Angular2自定义分页组件
2017/04/19 Javascript
Angular 4依赖注入学习教程之FactoryProvider配置依赖对象(五)
2017/06/04 Javascript
vue轮播图插件vue-concise-slider的使用
2018/03/13 Javascript
Vue 组件传值几种常用方法【总结】
2018/05/28 Javascript
JS字符串补全方法padStart()和padEnd()
2020/05/27 Javascript
Python图算法实例分析
2016/08/13 Python
Python之reload流程实例代码解析
2018/01/29 Python
Python读取Word(.docx)正文信息的方法
2018/03/15 Python
Python3.6通过自带的urllib通过get或post方法请求url的实例
2018/05/10 Python
详解将Python程序(.py)转换为Windows可执行文件(.exe)
2019/07/19 Python
tensorflow实现读取模型中保存的值 tf.train.NewCheckpointReader
2020/02/10 Python
python matplotlib绘制三维图的示例
2020/09/24 Python
记录一下scrapy中settings的一些配置小结
2020/09/28 Python
python爬虫中抓取指数的实例讲解
2020/12/01 Python
html5 css3实例教程 一款html5和css3实现的小机器人走路动画
2014/10/20 HTML / CSS
美国当红的名品折扣网:Gilt Groupe
2016/08/15 全球购物
Zavvi荷兰:英国大型音像制品和图书游戏零售商
2018/03/22 全球购物
澳大利亚墨水站Ink Station:墨水和碳粉打印机墨盒
2019/03/24 全球购物
Yahoo-PHP面试题3
2012/01/14 面试题
EJB3推出JPA的原因
2013/10/16 面试题
会计毕业自我鉴定
2014/02/05 职场文书
软件毕业生个人鉴定
2014/03/03 职场文书
党性心得体会
2014/09/03 职场文书
2014年汽车销售工作总结
2014/12/01 职场文书
异地恋情人节寄语
2015/02/28 职场文书
银行优秀员工推荐信
2015/03/24 职场文书