首页
所有分类
TAGS
文字工具 EMOJI BIBLE
编程 PHP

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表单文件iframe异步上传实例讲解

- Author -

ReadyYes

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

PHP 相关文章推荐
php socket方式提交的post详解
Jul 19 PHP
phpmyadmin MySQL 加密配置方法
Jul 05 PHP
php设计模式 Visitor 访问者模式
Jun 28 PHP
解决文件名解压后乱码的问题 将文件名进行转码的代码
Jan 10 PHP
PHP+Mysql日期时间如何转换(UNIX时间戳和格式化日期)
Jul 15 PHP
Linux编译升级php的详细方法
Nov 04 PHP
php 检查电子邮件函数(自写)
Jan 16 PHP
常用PHP框架功能对照表
Oct 23 PHP
php获取指定范围内最接近数的方法
Jun 02 PHP
解析PHP的Yii框架中cookie和session功能的相关操作
Mar 17 PHP
PHP实现的最大正向匹配算法示例
Dec 19 PHP
PHP数组常用函数实例小结
Aug 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
巴西购物网站(71) 香港购物网站(84) 西班牙购物网站(115) 美国购物网站(1542) 韩国购物网站(27) 中国购物网站(172) 新加坡购物网站(41) 加拿大购物网站(185) 瑞士购物网站(28) 英国购物网站(954)
You might like
怎么样可以把 phpinfo()屏蔽掉?
2006/11/24 PHP
ci检测是ajax还是页面post提交数据的方法
2014/11/10 PHP
浅谈php错误提示及查错方法
2015/07/14 PHP
PHP图像裁剪缩略裁切类源码及使用方法
2016/01/07 PHP
PHP浮点数的一个常见问题
2016/03/10 PHP
Yii的Srbac插件用法详解
2016/07/14 PHP
Ajax中的JSON格式与php传输过程全面解析
2017/11/14 PHP
jquery实现固定顶部导航效果(仿蘑菇街)
2013/03/21 Javascript
JavaScript表单通过正则表达式验证电话号码
2014/03/14 Javascript
js实现新浪微博首页效果
2015/10/16 Javascript
通过修改360抢票的刷新频率和突破8车次限制实现方法
2017/01/04 Javascript
Web前端框架Angular4.0.0 正式版发布
2017/03/28 Javascript
jQuery实现web页面樱花坠落的特效
2017/06/01 jQuery
使用Bootstrap4 + Vue2实现分页查询的示例代码
2017/12/21 Javascript
vue实现按需加载组件及异步组件功能
2019/05/27 Javascript
VUE中使用HTTP库Axios方法详解
2020/02/05 Javascript
Vue3项目打包后部署到服务器 请求不到后台接口解决方法
2020/02/06 Javascript
原生js实现自定义消息提示框
2020/11/19 Javascript
JavaScript实现跟随鼠标移动的盒子
2021/01/28 Javascript
Python yield 小结和实例
2014/04/25 Python
python中私有函数调用方法解密
2016/04/29 Python
python运行时间的几种方法
2016/06/17 Python
Python的装饰器使用详解
2017/06/26 Python
python设置随机种子实例讲解
2019/09/12 Python
Tensorflow中tf.ConfigProto()的用法详解
2020/02/06 Python
Python如何使用内置库matplotlib绘制折线图
2020/02/24 Python
纯CSS实现聊天框小尖角、气泡效果
2014/04/04 HTML / CSS
详解HTML5中div和section以及article的区别
2015/07/14 HTML / CSS
HTML实现代码雨源码及效果示例
2020/02/25 HTML / CSS
uniapp+Html5端实现PC端适配
2020/07/15 HTML / CSS
Sneaker Studio匈牙利：购买运动鞋
2018/03/26 全球购物
校园广播稿100字
2014/10/06 职场文书
公务员检讨书
2014/11/01 职场文书
房屋产权共有协议书范本
2014/11/03 职场文书
2015年街道办事处工作总结
2015/05/22 职场文书
会计试用期工作总结2015
2015/05/28 职场文书