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 相关文章推荐
PHP初学者头疼问题总结
Jul 08 PHP
NOT NULL 和NULL
Jan 15 PHP
PHP 表单提交给自己
Jul 24 PHP
php echo()和print()、require()和include()函数区别说明
Mar 27 PHP
Yii 快速,安全,专业的PHP框架
Sep 03 PHP
php过滤表单提交的html等危险代码
Nov 03 PHP
PHP数组去重比较快的实现方式
Jan 19 PHP
Apache PHP MySql安装配置图文教程
Aug 27 PHP
PHP入门教程之面向对象基本概念实例分析
Sep 11 PHP
php使用preg_match()函数验证ip地址的方法
Jan 07 PHP
YII2框架中使用yii.js实现的post请求
Apr 09 PHP
PHP中用Trait封装单例模式的实现
Dec 18 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
常见的四种POST 提交数据方式(小总结)
2015/10/08 PHP
前端必学之PHP语法基础
2016/01/01 PHP
PHP获取input输入框中的值去数据库比较显示出来
2016/11/16 PHP
详解php用curl调用接口方法,get和post两种方式
2017/01/13 PHP
PHP 的Opcache加速的使用方法
2017/12/29 PHP
php 使用mpdf实现指定字段配置字体样式的方法
2019/07/29 PHP
通过实例解析PHP数据类型转换方法
2020/07/11 PHP
分享几种好用的PHP自定义加密函数(可逆/不可逆)
2020/09/15 PHP
IE8 浏览器Cookie的处理
2009/01/31 Javascript
js解析xml字符串和xml文档实现原理及代码(针对ie与火狐)
2013/02/02 Javascript
jQuery中的read和JavaScript中的onload函数的区别
2014/08/27 Javascript
Node.js实现Excel转JSON
2015/04/24 Javascript
详解JavaScript中void语句的使用
2015/06/04 Javascript
深入浅析JavaScript的API设计原则
2016/06/14 Javascript
javascript中BOM基础知识总结
2017/02/14 Javascript
jQuery实现动态添加、删除按钮及input输入框的方法
2017/04/27 jQuery
ionic2屏幕适配实现适配手机、平板等设备的示例代码
2017/08/11 Javascript
小程序兼容安卓和IOS数据处理问题及坑
2018/09/18 Javascript
详解element上传组件before-remove钩子问题解决
2020/04/08 Javascript
Python3中多线程编程的队列运作示例
2015/04/16 Python
在Python中操作时间之mktime()方法的使用教程
2015/05/22 Python
Python简单实现安全开关文件的两种方式
2016/09/19 Python
python命令行解析之parse_known_args()函数和parse_args()使用区别介绍
2018/01/24 Python
python微信跳一跳系列之色块轮廓定位棋盘
2018/02/26 Python
Python中调用其他程序的方式详解
2019/08/06 Python
django实现支付宝支付实例讲解
2019/10/17 Python
python输出pdf文档的实例
2020/02/13 Python
python实现图片横向和纵向拼接
2020/03/05 Python
HTML5视频播放插件 video.js介绍
2018/09/29 HTML / CSS
意大利运动服减价商店:ScontoSport
2020/03/10 全球购物
校园招聘策划书
2014/01/09 职场文书
毕业生欢送会主持词
2014/03/31 职场文书
2014年内部审计工作总结
2014/12/09 职场文书
golang 实现时间戳和时间的转化
2021/05/07 Golang
Java spring单点登录系统
2021/09/04 Java/Android
CSS实现渐变色边框(Gradient borders)的5种方法
2022/03/25 HTML / CSS