php表单文件iframe异步上传实例讲解


Posted in PHP onJuly 26, 2017

本文实例为大家分享了php表单文件iframe异步上传的具体代码,供大家参考,具体内容如下

1.表单中放置iframe元素;
2.文件上传控件内容变化的时候触发JS设置表单的action为处理文件上传的img_upload_process.php文件,并且将表单的target设置为iframe,让iframe去提交到服务器进行文件上传;
3.img_upload_process.php中处理文件上传成功后,将上传成功保存的文件路径回传给表单中隐藏域;
4.点击表单提交按钮的时,JS设置表单action为接收表单数据的form_process.php文件,表单的target设置为_self。

表单:asyn_uplaod.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>图片异步上传</title>
</head>
<body>
<!-- application/x-www-form-urlencoded 缺省编码类型 -->
<!-- multipart/form-data 多媒体传输协议 ,方法必须是post 既可以发送文本数据,也支持二进制数据上载 -->
<form action="" method="post" enctype="multipart/form-data">
 用户名: <input type="text" name="username" /><br /> 
 上传头像: <input type="file" id="avator" name="avator" onchange="startUpload(this.form)" />

 <iframe frameborder='0' width='0' height='0' name="uploadframe"></iframe> 
 <input type="hidden" id="save_path" name="save_path" />
 <span id="loading"></span> <br /> 
 <img width='100' height='100' id='uploaded_img' /> <br />
 <input type="submit" name="submitted" value="提交" onclick="formSubmit(this.form)" />

</form>

<script>

function startUpload(formObj){
  document.getElementById('loading').innerHTML = '上传中...'; 
  formObj.action = 'img_upload_process.php'; 
  formObj.target = 'uploadframe'; 
  formObj.submit(); 
}


function formSubmit(formObj) {
 formObj.action = 'form_process.php'; 
 formObj.target = '_self';

 //清空文件上传内容,防止重复提交
 var fileObj = document.getElementById('avator') ;

 // for IE, Opera, Safari, Chrome
 if (fileObj.outerHTML) {
  fileObj.outerHTML = fileObj.outerHTML;
 } else { // FF(包括3.5)
  fileObj.value = "";
 }

 formObj.submit(); 
}

</script>

</body>
</html>

处理文件上传:img_upload_process.php

<?php
include 'Upload.class.php';

$file = $_FILES['avator'];
$upload = new Upload();//上传工具类对象


if($save_path = $upload->up($file)){//上传成功
 echo <<<STR
 <script> 
  window.parent.document.getElementById('uploaded_img').src = "$save_path";
  window.parent.document.getElementById('loading').innerHTML = '上传成功'; 
  window.parent.document.getElementById('save_path').value = "$save_path"; 
 </script>
STR;

}else{
 $error = $upload->error();
 echo <<<STR
 <script>
  window.parent.document.getElementById('uploaded_img').src = "";
  window.parent.document.getElementById('loading').innerHTML = "上传失败: $error";
 </script>
STR;

}

文件上传工具类:Upload.class.php

<?php
class Upload{
 private $path; //文件上传目录
 private $max_size; //上传文件大小限制
 private $errno; //错误信息号
 private $mime = array('image/jpeg','image/png','image/gif');//允许上传的文件类型

 /**
  * 构造函数,
  * @access public
  * @param $path string 上传的路径
  */
 public function __construct($path = './' ){
  $this->path = $path;
  $this->max_size = 1000000;
 }

 /**
  * 文件上传的方法,分目录存放文件
  * @access public
  * @param $file array 包含上传文件信息的数组
  * @return mixed 成功返回上传的文件名,失败返回false
  */
 public function up($file){
  //判断文件是否是通过 HTTP POST 上传,防止恶意欺骗
  /*
  if (! is_uploaded_file($file['tmp_name'])) {
   $this->errno = 5; //设置错误信息号为5,表示非法上传
   return false;
  }
  */

  //判断是否从浏览器端成功上传到服务器端
  if ($file['error'] == 0) {
   # 上传到临时文件夹成功,对临时文件进行处理
   //上传类型判断
   if (!in_array($file['type'], $this->mime)) {
    # 类型不对
    $this->errno = -1; 
    return false;
   }

   //判断文件大小
   if ($file['size'] > $this->max_size) {
    # 大小超出配置文件的中的上传限制
    $this->errno = -2;
    return false;
   }

   //获取存放上传文件的目录
   $sub_path = date('Ymd').'/';
   if (!is_dir($this->path . $sub_path)) {
    # 不存在该目录,创建之
    mkdir($this->path . $sub_path);
   }

   //文件重命名,由当前日期 + 随机数 + 后缀名
   $file_name = date('YmdHis').uniqid().strrchr($file['name'], '.');

   //准备就绪了,开始上传
   if (move_uploaded_file($file['tmp_name'], $this->path . $sub_path . $file_name)) {
    # 移动成功
    return $sub_path . $file_name;
   } else {
    # 移动失败
    $this->errno = -3;
    return false;
   }

  } else {
   # 上传到临时文件夹失败,根据其错误号设置错误号
   $this->errno = $file['error'];
   return false;
  }

 }

 /**
  * 多文件上传方法
  * @access public
  * @param $file array 包含上传文件信息的数组,是一个二维数组
  * @return array 成功返回上传的文件名构成的数组, ?如果有失败的则不太好处理了
  */
 public function multiUp($files){
  //在多文件上传时,上传文件信息 又是一个多维数组,如$_FILES['userfile']['name'][0],$_FILES['userfile']['name'][1]
  //我们只需要遍历该数组,得到每个上传文件的信息,依次调用up方法即可
  foreach ($files['name'] as $key => $value) {
   # code...
   $file['name'] = $files['name'][$key];
   $file['type'] = $files['type'][$key];
   $file['tmp_name'] = $files['tmp_name'][$key];
   $file['error'] = $files['error'][$key];
   $file['size'] = $files['size'][$key];
   //调用up方法,完成上传
   $filename[] = $this->up($file);
  }
  return $filename;
 }

 /**
  * 获取错误信息,根据错误号获取相应的错误提示
  * @access public
  * @return string 返回错误信息
  */
 public function error(){
  switch ($this->errno) {
   case -1:
    return '请检查你的文件类型,目前支持的类型有'.implode(',', $this->mime);
    break;
   case -2:
    return '文件超出系统规定的大小,最大不能超过'. $this->max_size;
    break;
   case -3:
    return '文件移动失败';
    break;
   case 1:
    return '上传的文件超过了 php.ini 中 upload_max_filesize 选项限制的值,其大小为'.ini_get('upload_max_filesize');
    break;
   case 2:
    return '上传文件的大小超过了 HTML 表单中 MAX_FILE_SIZE 选项指定的值,其大小为' . $_POST['MAX_FILE_SIZE'];
    break;
   case 3:
    return '文件只有部分被上传';
    break;
   case 4:
    return '没有文件被上传';
    break;
   case 5:
    return '非法上传';
    break;
   case 6:
    return '找不到临时文件夹';
    break;
   case 7:
    return '文件写入临时文件夹失败';
    break;
   default:
    return '未知错误,灵异事件';
    break;
  }
 }
}

处理表单提交:form_process.php

<?php
var_dump($_REQUEST);
var_dump($_FILES);

php表单文件iframe异步上传实例讲解

点击表单提交按钮结果:

php表单文件iframe异步上传实例讲解

代码下载:php表单文件iframe异步上传

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

PHP 相关文章推荐
php生成EXCEL的东东
Oct 09 PHP
用js进行url编码后用php反解以及用php实现js的escape功能函数总结
Feb 08 PHP
PHP 正则表达式之正则处理函数小结(preg_match,preg_match_all,preg_replace,preg_split)
Oct 05 PHP
php中ftp_chdir与ftp_cdup函数用法
Nov 18 PHP
Win7下手动安装apache2.2、php5.4笔记
Apr 03 PHP
教你php如何实现验证码
Jan 20 PHP
CentOS 7.2 下编译安装PHP7.0.10+MySQL5.7.14+Nginx1.10.1的方法详解(mini版本)
Sep 01 PHP
Zend Framework使用Zend_Loader组件动态加载文件和类用法详解
Dec 09 PHP
关于php几种字符串连接的效率比较(详解)
Feb 22 PHP
laravel 中如何使用ajax和vue总结
Aug 16 PHP
Laravel 加载第三方类库的方法
Apr 20 PHP
php使用redis的有序集合zset实现延迟队列应用示例
Feb 20 PHP
php实现的统计字数函数定义与使用示例
Jul 26 #PHP
PHP SFTP实现上传下载功能
Jul 26 #PHP
Windows平台实现PHP连接SQL Server2008的方法
Jul 26 #PHP
php判断str字符串是否是xml格式数据的方法示例
Jul 26 #PHP
深入理解Yii2.0乐观锁与悲观锁的原理与使用
Jul 26 #PHP
php实现微信企业号支付个人的方法详解
Jul 26 #PHP
PHP编程实现微信企业向用户付款的方法示例
Jul 26 #PHP
You might like
PHP.MVC的模板标签系统(三)
2006/09/05 PHP
PHP+MYSQL 出现乱码的解决方法
2008/08/08 PHP
php curl常见错误:SSL错误、bool(false)
2011/12/28 PHP
分享一个超好用的php header下载函数
2014/01/31 PHP
PHP判断浏览器、判断语言代码分享
2015/03/05 PHP
PHP 7.0.2 正式版发布
2016/01/08 PHP
PHP 无限级分类
2017/05/04 PHP
php生成网页桌面快捷方式
2017/05/05 PHP
js querySelector和getElementById通过id获取元素的区别
2012/04/20 Javascript
jquery小火箭返回顶部代码分享
2015/08/19 Javascript
莱鸟介绍javascript onclick事件
2016/01/06 Javascript
遍历json获得数据的几种方法小结
2017/01/21 Javascript
JavaScript解析JSON格式数据的方法示例
2017/01/24 Javascript
js仿微信公众平台打标签功能
2017/04/08 Javascript
详解nodejs微信公众号开发——4.自动回复各种消息
2017/04/11 NodeJs
尝试自己动手用react来写一个分页组件(小结)
2018/02/09 Javascript
微信小程序自定义弹窗滚动与页面滚动冲突的解决方法
2019/07/16 Javascript
[48:28]完美世界DOTA2联赛循环赛FTD vs Magma第二场 10月30日
2020/10/31 DOTA
Python中pip安装非PyPI官网第三方库的方法
2015/06/02 Python
用tensorflow实现弹性网络回归算法
2018/01/09 Python
Python实现的矩阵转置与矩阵相乘运算示例
2019/03/26 Python
Python中的引用和拷贝实例解析
2019/11/14 Python
Pytorch训练过程出现nan的解决方式
2020/01/02 Python
Python lxml库的简单介绍及基本使用讲解
2020/12/22 Python
使用phonegap播放音频的实现方法
2017/03/31 HTML / CSS
菲律宾优惠券网站:MetroDeal
2019/04/12 全球购物
您熟悉ORM(Object-Relation Mapping)吗?请谈谈您所理解的ORM
2016/02/08 面试题
DTD的含义以及作用
2014/01/26 面试题
技术人员面试提纲
2013/11/28 职场文书
服装设计专业毕业生求职信
2014/04/09 职场文书
促销活动总结范文
2014/04/30 职场文书
中考学习决心书
2015/02/04 职场文书
2015年行政工作总结范文
2015/04/09 职场文书
2015年安全生产月工作总结
2015/07/27 职场文书
Python图像处理库PIL详细使用说明
2022/04/06 Python
单机多实例部署 MySQL8.0.20
2022/05/15 MySQL