搜尋
首頁後端開發php教程php表單檔案iframe異步上傳實例詳解

php表單檔案iframe異步上傳實例詳解

Feb 01, 2018 am 10:58 AM
iframephp上傳

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。

本文主要為大家詳細介紹了php表單檔案iframe非同步上傳實例,具有一定的參考價值,有興趣的夥伴們可以參考一下,希望能幫助到大家。

表單: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=&#39;0&#39; width=&#39;0&#39; height=&#39;0&#39; name="uploadframe"></iframe> 
 <input type="hidden" id="save_path" name="save_path" />
 <span id="loading"></span> <br /> 
 <img  src="/static/imghwm/default1.png"  data-src="https://img.php.cn/upload/article/000/054/025/76750594f13e2c2715223ea07518cc8a-0.jpg?x-oss-process=image/resize,p_40"  class="lazy"     style="max-width:90%"php表單檔案iframe異步上傳實例詳解" > <br />
 <input type="submit" name="submitted" value="提交" onclick="formSubmit(this.form)" />

</form>

<script>

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


function formSubmit(formObj) {
 formObj.action = &#39;form_process.php&#39;; 
 formObj.target = &#39;_self&#39;;

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

 // 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 &#39;Upload.class.php&#39;;

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


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

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

}

檔案上傳工具類別:Upload.class.php


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

 /**
  * 构造函数,
  * @access public
  * @param $path string 上传的路径
  */
 public function __construct($path = &#39;./&#39; ){
  $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[&#39;tmp_name&#39;])) {
   $this->errno = 5; //设置错误信息号为5,表示非法上传
   return false;
  }
  */

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

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

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

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

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

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

 }

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

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

處理表單提交:form_process.php


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

點擊表單提交按鈕結果:

php表單檔案iframe異步上傳實例詳解

程式碼下載:php表單檔案iframe非同步上傳

#相關推薦:

javascript實作檔案非同步上傳功能詳解

利用jQuery異步上傳檔案的外掛用法分享

jquery 實作ajaxfileupload異步上傳外掛程式教學

以上是php表單檔案iframe異步上傳實例詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
哪些常見問題會導致PHP會話失敗?哪些常見問題會導致PHP會話失敗?Apr 25, 2025 am 12:16 AM

PHPSession失效的原因包括配置錯誤、Cookie問題和Session過期。 1.配置錯誤:檢查並設置正確的session.save_path。 2.Cookie問題:確保Cookie設置正確。 3.Session過期:調整session.gc_maxlifetime值以延長會話時間。

您如何在PHP中調試與會話相關的問題?您如何在PHP中調試與會話相關的問題?Apr 25, 2025 am 12:12 AM

在PHP中調試會話問題的方法包括:1.檢查會話是否正確啟動;2.驗證會話ID的傳遞;3.檢查會話數據的存儲和讀取;4.查看服務器配置。通過輸出會話ID和數據、查看會話文件內容等方法,可以有效診斷和解決會話相關的問題。

如果session_start()被多次調用會發生什麼?如果session_start()被多次調用會發生什麼?Apr 25, 2025 am 12:06 AM

多次調用session_start()會導致警告信息和可能的數據覆蓋。 1)PHP會發出警告,提示session已啟動。 2)可能導致session數據意外覆蓋。 3)使用session_status()檢查session狀態,避免重複調用。

您如何在PHP中配置會話壽命?您如何在PHP中配置會話壽命?Apr 25, 2025 am 12:05 AM

在PHP中配置會話生命週期可以通過設置session.gc_maxlifetime和session.cookie_lifetime來實現。 1)session.gc_maxlifetime控制服務器端會話數據的存活時間,2)session.cookie_lifetime控制客戶端cookie的生命週期,設置為0時cookie在瀏覽器關閉時過期。

使用數據庫存儲會話的優點是什麼?使用數據庫存儲會話的優點是什麼?Apr 24, 2025 am 12:16 AM

使用數據庫存儲會話的主要優勢包括持久性、可擴展性和安全性。 1.持久性:即使服務器重啟,會話數據也能保持不變。 2.可擴展性:適用於分佈式系統,確保會話數據在多服務器間同步。 3.安全性:數據庫提供加密存儲,保護敏感信息。

您如何在PHP中實現自定義會話處理?您如何在PHP中實現自定義會話處理?Apr 24, 2025 am 12:16 AM

在PHP中實現自定義會話處理可以通過實現SessionHandlerInterface接口來完成。具體步驟包括:1)創建實現SessionHandlerInterface的類,如CustomSessionHandler;2)重寫接口中的方法(如open,close,read,write,destroy,gc)來定義會話數據的生命週期和存儲方式;3)在PHP腳本中註冊自定義會話處理器並啟動會話。這樣可以將數據存儲在MySQL、Redis等介質中,提升性能、安全性和可擴展性。

什麼是會話ID?什麼是會話ID?Apr 24, 2025 am 12:13 AM

SessionID是網絡應用程序中用來跟踪用戶會話狀態的機制。 1.它是一個隨機生成的字符串,用於在用戶與服務器之間的多次交互中保持用戶的身份信息。 2.服務器生成並通過cookie或URL參數發送給客戶端,幫助在用戶的多次請求中識別和關聯這些請求。 3.生成通常使用隨機算法保證唯一性和不可預測性。 4.在實際開發中,可以使用內存數據庫如Redis來存儲session數據,提升性能和安全性。

您如何在無狀態環境(例如API)中處理會議?您如何在無狀態環境(例如API)中處理會議?Apr 24, 2025 am 12:12 AM

在無狀態環境如API中管理會話可以通過使用JWT或cookies來實現。 1.JWT適合無狀態和可擴展性,但大數據時體積大。 2.Cookies更傳統且易實現,但需謹慎配置以確保安全性。

See all articles

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

WebStorm Mac版

WebStorm Mac版

好用的JavaScript開發工具

DVWA

DVWA

Damn Vulnerable Web App (DVWA) 是一個PHP/MySQL的Web應用程序,非常容易受到攻擊。它的主要目標是成為安全專業人員在合法環境中測試自己的技能和工具的輔助工具,幫助Web開發人員更好地理解保護網路應用程式的過程,並幫助教師/學生在課堂環境中教授/學習Web應用程式安全性。 DVWA的目標是透過簡單直接的介面練習一些最常見的Web漏洞,難度各不相同。請注意,該軟體中

SublimeText3 英文版

SublimeText3 英文版

推薦:為Win版本,支援程式碼提示!

EditPlus 中文破解版

EditPlus 中文破解版

體積小,語法高亮,不支援程式碼提示功能

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器