php文件上传进度跟踪 php5.2已经新增此功能,PHP文件上传进度条完整程序实现 jQuery Ajax apc...

实现效果：

准备工作：

这篇文章对php文件上传进度讲得很详细，不过，是用iframe实现的。

2、下载php_apc.dll。在网上很容易搜到php_apc.dll的下载地址。

将php_apc.dll放在ext文件夹下，比如：C:\AppServ\php5\ext。在C:\WINDOWS的php.ini文件中找到;extension=php_zip.dll这行，在这行之后添加：

extension=php_apc.dll

;apc.enabled = 1

;apc.shm_segments = 1

;apc.shm_size = 64

;apc.optimization = 0

;apc.num_files_hint = 1000

;apc.ttl = 0

;apc.gc_ttl = 3600

;apc.cache_by_default = On

;apc.slam_defense = 0

;apc.file_update_protection = 2

;apc.enable_cli = 0

;apc.stat=0

apc.rfc1867=1

apc.max_file_size = 100M

upload_max_filesize = 100M

post_max_size = 100M

以上被注释掉的内容，是另外一些对配置的设置的说法。我发现，如果这样设置，每次网页文件修改后，都必须重启服务器，才能刷新，否则，修改后，无法看到修改后的网页内容。

修改完配置，记得重启服务器。

3、因为实现提交和显示进度条用到jQuery的内容，上传文件也采用了jQuery的弹出对话框的方式，所以，要下载jQuery的核心文件和UI文件。

jQuery的核心文件在jQuery的首页上就可以下载，文件名为jquery-1.4.3.js，注意版本号，如果下载的版本号与后续程序中的不一致，记得修改程序中的文件名。

可以将可选组件全部勾选。下载的文件夹名jquery-ui-1.8.6.custom。在后续程序中用到的js文件和css文件全部可以在这个文件夹中找到。注意：在该文件夹的development-bundle子文件夹中，必须有jquery-1.4.3.js(或者其它版本)文件存在，否则，文件夹中的demos子文件夹中的例子程序，都无法运行。

页面组成

1、lwjUpload1.php 显示文件上传的客户端页面

2、lwjfileUp.php 处理文件上传的服务器端页面

3、getProgress.php 获得文件上传进度缓存的服务器端页面

程序实现

lwjUpload1.php 显示文件上传的客户端页面

李婉佳的文件上传进度条

*

{

margin:0;

padding:0;

}

input,label

{

margin-top:10px;

}

#fileUpload

{

width:20em;

height:2em;

}

a.aButton

{

font-size:1.2em;

color:black;

}

a.aButton:hover

{

color:#0066CC;

text-decoration:none;

}

//初始化对话框，让对话框隐藏，不自动弹出，并设置对话框关闭的速度(速率)$.fx.speeds._default= 500; //对话框显示和隐藏的速度$(function(){

$("#dialog").dialog({ autoOpen: false,

show:'scale', //对话框显示的方式

hide:'explode' //对话框隐藏的方式

})

});

//弹出文件上传的对话框var uid; //为隐藏表单APC_UPLOAD_PROGRESS定义value的变量

function dialogOpen()

{

//document.getElementByIdx_x("fileUpload").value ="";//无法通过这个方式给file类型的input赋值，只读//每次打开“文件上传”对话框时，先清空对话框中上次显示的Ajax消息、上传进度百分数和进度条

document.getElementByIdx_x("output1").innerHTML="";

document.getElementByIdx_x("test1").innerHTML="";

document.getElementByIdx_x("progressouter").style.display="none";

$("#dialog").dialog("open");

return false;

}

//设置ajaxSubmit的参数var options = {

target:'#output1',

beforeSubmit:showResponse

//一定要设置为提交前(beforeSubmit)，不能是提交后(success),否则无法获得文件上传的缓存};

functionshowResponse(responseText,statusText){

//alert('状态：' + statusText+ '\n返回的内容是：\n' + responseText); varnewId = document.getElementByIdx_x("progress_key");

//产生一个由时间戳和随机数组成的字符串，作为隐藏表单APC_UPLOAD_PROGRESS的value

var temp1 = newDate().getTime().toString();

var temp2 = Math.random().toString();

uid = temp1 + temp2; //uid必须在每次单击“文件上传”时生成一遍，保证每个上传的文件有不同的APC_UPLOAD_PROGRESSid

//否则，传完一个文件后，再传第二个文件时，没有进度条的效果

newId.value = uid;

document.getElementByIdx_x("progressouter").style.display="block";

document.getElementByIdx_x("progressinner").style.width= "0%";

getProgress();

}

function getProgress()

{

$.ajax({

success:getStatus,url:'getProgress.php?progress_key='+ uid,

type:'get',

dataType:'text',

cache:false //一定要加上这个条件，保证不缓存，否则，页面不会动态刷新，就没有进度条效果

});

}

functiongetStatus(responseText,statusText)

{

var t1 = document.getElementByIdx_x("test1");

t1.innerHTML = responseText.toString()+"%";

if(responseText<100)

{

document.getElementByIdx_x("progressinner").style.width= responseText+"%";

setTimeout("getProgress()",10);

}

else if(responseText>=100)

{

document.getElementByIdx_x("progressinner").style.width= "100%";

}

}

function ajaSub()

{

$('#myForm').ajaxSubmit(options);

return false;

}

if (function_exists('apc_fetch')) {

echo 'it surpport apc model!';

} else {

echo "it'snot support apc model!";

}

?>