PHP+apc+ajax实现的ajax_upload上传进度条代码

本文实例讲述了PHP+apc+ajax实现的ajax_upload上传进度条代码。分享给大家供大家参考，具体如下：

上传进度条是怎么实现的呢?原理是怎么样的呢?当我们浏览，选择上传后，会产生一个临时文件，上传的时把这个临时文件，上传到服务器，上传完成后，这个临时文件会被删除掉。如果我们能读取这个临时文件的大小，就知道上传进度是多少了，php apc模块可以实现这个功能。

一、安装apc模块

下载地址:http://pecl.php.net/package/apc

tar zxvf APC-3.1.8.tgz
cd APC-3.1.8/
/usr/local/php/bin/phpize
./configure --with-php-config=/usr/local/php/bin/php-config
make && make install

二、修改php.ini

extension = apc.so
apc.rfc1867 = 1
apc.max_file_size = 200M
upload_max_filesize = 1000M
post_max_size = 1000M
max_execution_time = 600
max_input_time = 600
memory_limit = 128M

修改好后，重起apache或者其他，查看一下

[root@BlackGhost php]# php -m
[PHP Modules]
apc
cgi-fcgi
ctype
curl
date
dom
eAccelerator
。。。。。。。。

三、upload_test.php

<?php
$id = uniqid(rand(), true);
?>
<html>
<script type='text/javascript' src='jquery-1.3.2.js'></script>
<script type='text/javascript' src='ajaxupload.3.1.js'></script>
<script type='text/javascript' src='upload.js'></script>
<body style="text-align:center;">
<h1>上传测试</h1><form enctype="multipart/form-data" id="upload" method="POST">
<input type="hidden" name="APC_UPLOAD_PROGRESS" id="progress_key" value="<?=$id?>" />
<input type="file" id="file" name="file" value=""/><br/><input id="submit" type="submit" value="Upload!" />
</form>
<div id="progressouter" style="width: 500px; height: 20px; border: 1px solid black; display:none;">
<div id="progressinner" style="position: relative; height: 20px; background-color: red; width: 0%; ">
</div>
</div>
<br />
<div id='showNum'></div><br>
<div id='showInfo'></div><br>
</body>
</html>
<script type="text/javascript">
$(document).ready(function(){
form_submit();
});
</script>

APC_UPLOAD_PROGRESS这个有什么用呢?它对上传的文件添加一个标记，就可以在其它的php程序中用这个标记访问它。为apc的读取提供支持。

upload.js异步上传的js文件：

function form_submit (){
new AjaxUpload('#upload', {
action: 'upload.php',
name: 'file',
data: {
APC_UPLOAD_PROGRESS:$("#progress_key").val()
},
autoSubmit: true,
onSubmit: function(file, extension){
$('#progressouter').css('display', 'block');
progress();
},
onComplete: function(file, response){
$("#showInfo").html(response);
}
});
}
function progress (){
$.ajax({
type: "GET",
url: "progress.php?progress_key="+$("#progress_key").val(),
dataType: "json",
cache:false,
success: function(data){
if(data == 0) {
var precent = 0;
} else {
for (i in data) {
if (i == "current") {
var json_current = parseInt(data[i]);
}
if (i == "total") {
var json_total = parseInt(data[i]);
}
}
var precent = parseInt(json_current/json_total * 100);
$("#progressinner").css("width",precent+"%");
$("#showNum").html(precent+"%");
$("#showInfo").html("ok");
}
if ( precent < 100) {
setTimeout("progress()", 100);
}
}
});
}

上面有一点要注意，APC_UPLOAD_PROGRESS:$("#progress_key").val()在这里，key是APC_UPLOAD_PROGRESS如果不是这个的话，apc找不到临时文件的。在这里我为什么要用ajax_upload.js呢，因为jquery自带的ajax，自带参数没有上传文件的，也就是type='file'中的内容，php端根本得不到。

四、upload.php上传文件

<?php
if($_SERVER['REQUEST_METHOD'] == 'POST') {
if(empty($_FILES["file"]["tmp_name"])){
echo "no file";
die;
}
$tmp_name = $_FILES["file"]["tmp_name"];
$name = dirname($_SERVER['SCRIPT_FILENAME'])."/upload/".$_FILES["file"]["name"];
move_uploaded_file($tmp_name, $name);
echo "<p>File uploaded.</p>";
}
?>

如果文件比较大，就不要用http的方式来上传了，太慢，并且影响网站的稳定性。

五、progress.php取得进度的文件，给ajax调用用的

<?php
if(isset($_GET['progress_key'])) {
$status = apc_fetch('upload_'.$_GET['progress_key']);
if($status['total']!=0 && !empty($status['total'])) {
echo json_encode($status);
} else {
echo 0;
}
}
?>

看一下，ajax 异步请求产生的数据。

php apc ajax 上传进度条

参数说明:

total           文件大小
current       已上传的大小
filename     上传文件名
name          标签名
done          上传成功为1
cancel_upload      用户取消上传，只有上传完成时才有
rate 上传速度，只有上传完成时才有
start_time   开始时间

更多关于PHP文件及ajax操作相关内容感兴趣的读者可查看本站专题：《php文件操作总结》及《PHP+ajax技巧与应用小结》

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

赞 (0)

相关推荐

  • jQuery Ajax文件上传(php)

    如何实现jQuery的Ajax文件上传,PHP如实文件上传.AJAX上传文件,PHP上传文件. [PHP文件上传] 在开始之前,我觉得是有必要把通WEB上传文件的原理简单说一下的.实际上,在这里不管是PHP,JSP,还是ASP处理上传的文件,其实都是WEB早已把文件上传到服务器了,我们只是运用上传处理函数来处理上传的文件.而处理函数一般都是用PHP,JSP,ASP等服务端语言来实现的.那么如何通过WEB(HTTP协议来上传文件呢?)你需要类似于以下的HTML代码:test.html 复制代码 代

  • 使用ajaxfileupload.js实现ajax上传文件php版

    无论是PHP,还是其他的服务端脚本都提供了文件上传功能,实现起来也比较简单.而利用JavaScript来配合,即可实现Ajax方式的文件上传.虽然jQuery本身没有提供这样的简化函数,但有不少插件可以实现.其中,Phpletter.com提供的ajaxfileupload.js是一个轻量的插件,而且编写方式与jQuery提供的全局方法$.post()非常相似,简单易用. 不过,该插件实在太简化了,除了可提供需上传文件的路径外,也就不能传递额外的值到后台服务端.所以,我修改了一下该脚本,增加个一

  • php+ajax实现带进度条的大数据排队导出思路以及源码

    php+ajax实现带进度条的大数据排队导出思路以及源码

    废话不多说,先上效果图: 点击导出,实现 点击导出 统计完成之后 点击确定 下面来谈谈实现的思路: 前面导出操作简单,从第二个导出操作开始: 点击"确定"调用exportCsv函数 复制代码 代码如下: <a class="on" href="javascript:exportCsv();"><em>导出</em></a> exportCvs函数如下function exportCsv(){ //清

  • php+ajax实现带进度条的上传图片功能【附demo源码下载】

    php+ajax实现带进度条的上传图片功能【附demo源码下载】

    本文实例讲述了php+ajax实现带进度条的上传图片功能.分享给大家供大家参考,具体如下: 运行效果图如下: 代码如下: <?php if(isset($_FILES["FileInput"]) && $_FILES["FileInput"]["error"]== UPLOAD_ERR_OK) { ############ Edit settings ############## $UploadDirectory = 'F:

  • PHP Ajax实现无刷新附件上传

    对一个网站而言,有一个基本的不可缺少的功能,那就是文件上传.使用PHP预压来实现文件上传可谓是有得天独厚的优势的,那么今天,就一起来做一个关于无刷新实现的文件上传吧. -------------------------------------------------------------------------------- 普通表单 前端页面 <form action="./fileupload.php" method="POST"> <p&g

  • ThinkPHP结合AjaxFileUploader实现无刷新文件上传的方法

    本文实例讲述了ThinkPHP结合AjaxFileUploader实现无刷新文件上传的方法.分享给大家供大家参考.具体实现方法分析如下: 首先,AjaxFileUploader插件是一个基于jquery的插件,我们可以使用AjaxFileUploader插件来实现文件异步上传功能了,使用这款插件上传文件不要担心兼容性的问题,它的兼容性可以说兼容所有主流浏览器,下面来给大家介绍一个AjaxFileUploader+thinkphp实现文件上传的实例. ThinkPHP框架下用AjaxFileUpl

  • jQuery+php实现ajax文件即时上传的详解

    jQuery+php实现ajax文件即时上传的详解

    很多项目中需要用到即时上传功能,比如,选择本地图片后,立即上传并显示图像.本文结合实例讲解如何使用jQuery和PHP实现Ajax即时上传文件的功能,用户只需选择本地图片确定后即实现上传,并显示上传进度条,上传完成后,显示图片信息. HTML本示例基于jQuery以及相当出色的jquery.form插件,所以,先要载入jquery库和form插件.<script type="text/javascript" src="jquery.min.js"><

  • PHP+ajaxfileupload+jcrop插件完美实现头像上传剪裁

    PHP+ajaxfileupload+jcrop插件完美实现头像上传剪裁

    昨天花了点时间整合了一下头像插件 东拼西凑的成果 先来看下效果 1.先使用ajaxfileupload插件做异步上传.这个地方我本来想做个上传进度的效果,但技术有限失败了.上传按钮我还做了一个文件大小的限制,但是由于浏览器兼容性的问题,不完美在IE6--IE9之间还有很多问题需要解决 getFileSize函数是用于判断文件大小的函数 复制代码 代码如下: function getFileSize(fileName) {                var byteSize = 0;     

  • php ajax实现文件上传进度条

    本实例是关于php文件上传时进度条的实现,主要采用ajax技术,另外还运用了html5,有需要的朋友可以研究一下. 本实例有两个文件: upload_form.html: <!DOCTYPE html> <html> <head> <script> function _(el){ return document.getElementById(el); } function uploadFile(){ var file = _("file1"

  • php ajax无刷新上传图片实例代码

    AJAX 客户端页面代码: index.html 复制代码 代码如下: <html> <body> <h1>Ajax file upload sample</h1><br/><input id="uplaod" name="btn_send" type="button" value="上传测试"/> <div id=result></di

  • php+html5+ajax实现上传图片的方法

    本文实例讲述了php+html5+ajax实现上传图片的方法.分享给大家供大家参考,具体如下: <?php if (isset($_POST['upload'])) { var_dump($_FILES); move_uploaded_file($_FILES['upfile']['tmp_name'], 'up_tmp/'.time().'.dat'); //header('location: test.php'); exit; } ?> <!doctype html> <

随机推荐