php表單文件iframe異步上傳實例講解
更新時間：2017年07月26日 11:50:54 作者：ReadyYes
這篇文章主要為大家詳細介紹了php表單文件iframe異步上傳實例，具有一定的參考價值，感興趣的小伙伴們可以參考一下
本文實例為大家分享了php表單文件iframe異步上傳的具體代碼，供大家參考，具體內(nèi)容如下
1.表單中放置iframe元素；
2.文件上傳控件內(nèi)容變化的時候觸發(fā)JS設(shè)置表單的action為處理文件上傳的img_upload_process.php文件，并且將表單的target設(shè)置為iframe，讓iframe去提交到服務(wù)器進行文件上傳；
3.img_upload_process.php中處理文件上傳成功后，將上傳成功保存的文件路徑回傳給表單中隱藏域；
4.點擊表單提交按鈕的時,JS設(shè)置表單action為接收表單數(shù)據(jù)的form_process.php文件，表單的target設(shè)置為_self。
表單：asyn_uplaod.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>圖片異步上傳</title>
</head>
<body>
<!-- application/x-www-form-urlencoded 缺省編碼類型 -->
<!-- multipart/form-data 多媒體傳輸協(xié)議 ,方法必須是post 既可以發(fā)送文本數(shù)據(jù)，也支持二進制數(shù)據(jù)上載 -->
<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';
//清空文件上傳內(nèi)容，防止重復(fù)提交
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');//允許上傳的文件類型
/**
* 構(gòu)造函數(shù),
* @access public
* @param $path string 上傳的路徑
*/
public function __construct($path = './' ){
$this->path = $path;
$this->max_size = 1000000;
}
/**
* 文件上傳的方法，分目錄存放文件
* @access public
* @param $file array 包含上傳文件信息的數(shù)組
* @return mixed 成功返回上傳的文件名，失敗返回false
*/
public function up($file){
//判斷文件是否是通過 HTTP POST 上傳，防止惡意欺騙
/*
if (! is_uploaded_file($file['tmp_name'])) {
$this->errno = 5; //設(shè)置錯誤信息號為5，表示非法上傳
return false;
}
*/
//判斷是否從瀏覽器端成功上傳到服務(wù)器端
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)) {
# 不存在該目錄，創(chuàng)建之
mkdir($this->path . $sub_path);
}
//文件重命名,由當(dāng)前日期 + 隨機數(shù) + 后綴名
$file_name = date('YmdHis').uniqid().strrchr($file['name'], '.');
//準(zhǔn)備就緒了，開始上傳
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 {
# 上傳到臨時文件夾失敗，根據(jù)其錯誤號設(shè)置錯誤號
$this->errno = $file['error'];
return false;
}
}
/**
* 多文件上傳方法
* @access public
* @param $file array 包含上傳文件信息的數(shù)組，是一個二維數(shù)組
* @return array 成功返回上傳的文件名構(gòu)成的數(shù)組, ?如果有失敗的則不太好處理了
*/
public function multiUp($files){
//在多文件上傳時，上傳文件信息 又是一個多維數(shù)組，如$_FILES['userfile']['name'][0]，$_FILES['userfile']['name'][1]
//我們只需要遍歷該數(shù)組，得到每個上傳文件的信息，依次調(diào)用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];
//調(diào)用up方法，完成上傳
$filename[] = $this->up($file);
}
return $filename;
}
/**
* 獲取錯誤信息,根據(jù)錯誤號獲取相應(yīng)的錯誤提示
* @access public
* @return string 返回錯誤信息
*/
public function error(){
switch ($this->errno) {
case -1:
return '請檢查你的文件類型，目前支持的類型有'.implode(',', $this->mime);
break;
case -2:
return '文件超出系統(tǒng)規(guī)定的大小，最大不能超過'. $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);
點擊表單提交按鈕結(jié)果：
代碼下載：php表單文件iframe異步上傳
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要介紹了php版微信自動登錄并獲取昵稱的方法,涉及php針對微信公眾平臺接口調(diào)用的相關(guān)操作技巧,需要的朋友可以參考下2016-09-09
Laravel創(chuàng)建數(shù)據(jù)庫表結(jié)構(gòu)的例子
今天小編就為大家分享一篇Laravel創(chuàng)建數(shù)據(jù)庫表結(jié)構(gòu)的例子，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-10-10
PHP array_key_exists檢查鍵名或索引是否存在于數(shù)組中的實現(xiàn)方法
下面小編就為大家?guī)硪黄狿HP array_key_exists檢查鍵名或索引是否存在于數(shù)組中的實現(xiàn)方法。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-06-06
前面我們分析了CI框架的session類和安全類文件，今天我們來分析下CI框架的裝載器Loader.php文件的源碼2014-11-11
這篇文章主要介紹了PHP語言對接抖音快手小紅書視頻/圖片去水印API接口源碼,本文通過示例代碼給大家介紹的非常詳細，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友可以參考下2020-08-08
分享微信掃碼支付開發(fā)遇到問題及解決方案-附Ecshop微信支付插件
微信掃碼支付在購物商城非常流行，本篇文章給大家分享微信掃碼支付開發(fā)遇到問題及解決方案-附Ecshop微信支付插件，需要的朋友可以參考下2015-08-08
PHP定時執(zhí)行任務(wù)實現(xiàn)方法詳解（Timer）
這篇文章主要介紹了PHP定時執(zhí)行任務(wù)實現(xiàn)方法詳解，定時任務(wù)在web應(yīng)用程序中比較常見，實現(xiàn)定時任務(wù)主要有兩種方案：1）使用Crontab命令，2）配合使用ignore_user_abort()和set_time_limit()，有需要的朋友可以來借鑒下。2015-07-07
分享一例php取得機器mac地址的代碼，學(xué)習(xí)下php讀取硬件信息的方法，此代碼適用于windows、linux系統(tǒng)。有需要的朋友參考學(xué)習(xí)下2013-12-12
kphp3.2整合阿里云OSS圖片上傳實例，圖片上傳至OSS可減少服務(wù)器壓力，節(jié)省寬帶，安全又穩(wěn)定，阿里云OSS對于做負(fù)載均衡非常方便，不用傳到各個服務(wù)器了，本文通過實例代碼給大家介紹，需要的朋友一起看看吧2019-04-04
這篇文章主要為大家詳細介紹了ThinkPHP中create()方法自動驗證表單信息，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-04-04