如何用PHP+JS实现上传进度条，大部分的人可能都实现过，但是下载呢？如何呢？原理也是差不多的，就是分次读写，每次读多少字节，但是这样的不好就是长连接，一般实现下载进度条常用的两种解决方案是：一种是需要用socket保持与客户端通信，持续保有长连接，利用flush（）持续更新浏览器UI，返回已下载的数据大小，然后可以显示下载速度，以及进度条之类；二种是php与flash交互，显示进度条。

<html>

<body>

<table border="1" width="300">

<tr><td width="100">文件大小</td><td width="200"><div id="filesize">未知长度</div></td></tr>

<tr><td>已经下载</td><td><div id="downloaded">0</div></td></tr>

<tr><td>完成进度</td><td><div id="progressbar" style="float:left;width:1px;text-align:center;color:#FFFFFF;background-color:#0066CC"></div><div id="progressText" style=" float:left">0%</div></td></tr>

</table>

<script type="text/javascript">

//文件长度

var filesize=0;

function $(obj) {return document.getElementById(obj);}

//设置文件长度

function setFileSize(fsize) {

    filesize=fsize;

    $("filesize").innerHTML=fsize;

}

//设置已经下载的,并计算百分比

function setDownloaded(fsize) {

    $("downloaded").innerHTML=fsize;

    if(filesize>0) {

        var percent=Math.round(fsize*100/filesize);

        $("progressbar").style.width=(percent+"%");

        if(percent>0) {

            $("progressbar").innerHTML=percent+"%";

            $("progressText").innerHTML="";

        } else {

            $("progressText").innerHTML=percent+"%";

        }

    }

}

</script>

<?php

ob_start();

@set_time_limit(300);//设置该页面最久执行时间为300秒

$url="http://dl_dir.qq.com/qqfile/qq/QQ2010/QQ2010Beta3.exe";//要下载的文件

$newfname="QQ2010Beta3.exe";//本地存放位置，也可以是E:\Temp\QQ2010Beta3.exe，这样做在Win7下要设置相应权限

$file = fopen ($url, "rb");

if ($file) {

    //获取文件大小

    $filesize = -1;

    $headers = get_headers($url, 1);

    if ((!array_key_exists("Content-Length", $headers))) $filesize=0;

    $filesize = $headers["Content-Length"];

    //不是所有的文件都会先返回大小的，有些动态页面不先返回总大小，这样就无法计算进度了

    if ($filesize != -1) {

        echo "<script>setFileSize($filesize);</script>";//在前台显示文件大小

    }

    $newf = fopen ($newfname, "wb");

    $downlen=0;

    if ($newf) {

        while(!feof($file)) {

            $data=fread($file, 1024 * 8 );//默认获取8K

            $downlen+=strlen($data);//累计已经下载的字节数

            fwrite($newf, $data, 1024 * 8 );

            echo "<script>setDownloaded($downlen);</script>";//在前台显示已经下载文件大小

            ob_flush();

            flush();

        }

    }

    if ($file) {

        fclose($file);

    }

    if ($newf) {

        fclose($newf);

    }

}

?>

</body>

</html>

版权声明：本文为博主原创文章，未经博主允许不得转载。

PHP持续保有长连接，利用flush持续更新浏览器UI，下载进度条实现的更多相关文章

  1. 一个利用 Parallel.For 并行处理任务，带有进度条（ProgressBar）的 WinForm 实例（下）

    接着上一篇:一个利用 Parallel.For 并行处理任务,带有进度条(ProgressBar)的 WinForm 实例(上) 直接贴代码了: using System; using System. ...

  2. python3 爬虫利用Requests 实现下载进度条

    一.编写代码 from datetime import datetime,date,timedelta from contextlib import closing import urllib,url ...

  3. Loadrunner_http长连接设置

    最近协助同事解决了几个问题,也对loadrunner的一些设置加深了理解,关键是更加知其所以然. ljonathan http://www.51testing.com/html/48/202848-2 ...

  4. 初识python： flush 实现进度条打印

    通过flush(强制刷新)实现,类似进度条打印: #!/user/bin env python # author:Simple-Sir # time:20180918 #打印进度条 import sy ...

  5. 利用Jquery实现http长连接(LongPoll) {转}

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="JqueryAjaxLongPo ...

  6. 【转】手把手教你利用Jenkins持续集成iOS项目

    前言 众所周知,现在App的竞争已经到了用户体验为王,质量为上的白热化阶段.用户们都是很挑剔的.如果一个公司的推广团队好不容易砸了重金推广了一个APP,好不容易有了一些用户,由于一次线上的bug导致一 ...

  7. 手把手教你利用Jenkins持续集成iOS项目

    前言 众所周知,现在App的竞争已经到了用户体验为王,质量为上的白热化阶段.用户们都是很挑剔的.如果一个公司的推广团队好不容易砸了重金推广了一个APP,好不容易有了一些用户,由于一次线上的bug导致一 ...

  8. Unity3D中通过Animator动画状态机获取任意animation clip的准确播放持续时长

    Unity3d 4及之前的版本中动画的播放用的animation,可直接获取其播放持续长度.但5.x及以后的版本中都是用animator来播放动画了. https://docs.unity3d.com ...

  9. PHP根据秒计算持续时长

    /** * 计算持续时长 * * @param int $second 秒数 * @return string $duration 5天10小时43分钟40秒 */ function second2d ...

随机推荐

  1. Spark环境的搭建与运行

    Spark本地安装与配置 下载spark后解压,并cd到解压目录下 运行实例程序测试是否一切正常 ./bin/run-example org.apache.spark.examples.SparkPi ...

  2. HW6.22

    import java.util.Arrays; public class Solution { public static void main(String[] args) { int[][] ch ...

  3. maven 名词

    maven 坐标: 坐标 其实就是 通过几种不同的元素描述来找到其对应的构件. maven 定义坐标的元素有: 1. groupId : 定义当前maven 项目隶属的实际项目,一般是域名的反向写法 ...

  4. 使用ApplicationLoader中出现报错：The IPA is invalid. It does not inlude a Payload directory

    问题处理方法: 1.将achieve的.app后缀的软件包放在一个payload的文件夹中 2.压缩该文件夹,改变.zip后缀为.ipa 3.使用applicationLoader上传该文件  

  5. Android AndroidManifest 清单文件以及权限具体解释

    每一个Android应用都须要一个名为AndroidManifest.xml的程序清单文件,这个清单文件名称是固定的而且放在每一个Android应用的根文件夹下.它定义了该应用对于Android系统来 ...

  6. C#-获取datatable指定列的数据

    DataTable dt = new DataTable();            da.Fill(dt);                                    this.text ...

  7. 基于新浪sae使用php生成图片发布图文微博

    1.生成图片的代码: <?php header ("Content-type: image/png"); mb_internal_encoding("UTF-8&q ...

  8. 图解iPhone开发新手教程

    如今的智能手机越来越风行了,当中尤以Apple的iPhone和Google的Android系统最为流行,这里我将向大家介绍iPhone开发的基础知识.为了便于刚開始学习的人尽快上手,我尽量以代码加截图 ...

  9. AIR 移动设备上的存储控制

    File.documentsDirectory, File.userDirectory, File.desktopDirectory 等.可以保存大的数据,如图片,视屏,和临时文件.访问这些文件的全选 ...

  10. android124 zhihuibeijing 新闻中心-新闻 -北京页签 下拉刷新

    缓存工具类:以url为key,json数据为value, package com.itheima.zhbj52.utils; import com.itheima.zhbj52.global.Glob ...