今天作項目的時候遇見一個問題:以前一個同事離職以前作了一個網站,有一個上傳商品詳細圖片的功能,當時已經完成,可是因爲後期程序的有更改以及更改的程序員的水平也是良莠不齊,最後致使程序bug不少,因爲當時用的是一個框架,最終也沒找到說明文檔,後來我就從新寫了一個結合ajax上傳文件的upload.classs.php雖然界面欠缺美觀,可是通俗易懂好維護.
php
//首先是頁面.html
index.phpmysql
<!DOCTYPE html>jquery
<html lang="en">程序員
<head>ajax
<meta charset="UTF-8">sql
<title>upload</title>數據庫
<script src="source/jquery.js"></script>json
<script src="source/jquery.form.js"></script>數組
</head>
<body>
<form method="post" id="picform" enctype="multipart/form-data">
<input type="file" name="file">
</form>
<div id='pics'></div>
<form action="model.php" id="infofrom" method="post">
<input type="submit" value="submit">
</form>
</body>
<script>
$(":file").change(function(){
if(!$(this).val())
{
alert('請選擇圖片!');
return false;
}
$("#picform").ajaxSubmit({
type:'post',
url:'upload.php',
success:function(data){
switch(data)
{
case '0':
alert('文件存放目錄不存在');
break;
case '1':
alert('系統錯誤,請檢查環境配置');
break;
case '2':
alert('文件類型不容許');
break;
case '3':
alert('文件大小有誤');
break;
default:
var obj= $.parseJSON(data);
//生成縮略圖
$("#pics").append("<img width='100px' height='100px' src="+obj.relpicpath+" />");
var len= $("#infofrom :hidden").length;
if(len==0)
{
$("#infofrom").append("<input type='hidden' value='"+obj.picname+"' id='picname' name='picname'>");
$("#infofrom").append("<input type='hidden' value='"+obj.picpath+"' id='picpath' name='picpath'>");
$("#infofrom").append("<input type='hidden' value='"+obj.relpicpath+"' id='relpicpath' name='relpicpath'>");
}
else
{
$("#picname").val($("#picname").val()+','+obj.picname);
$("#picpath").val($("#picpath").val()+','+obj.picpath);
$("#relpicpath").val($("#relpicpath").val()+','+obj.relpicpath);
}
break;
}
}
})
})
</script>
</html>
//接收前臺ajax的頁面
upload.php
<?php
include_once 'Upload.class.php';
$obj=new Upload('uploads',array('.jpg'),3145728,'file');
$arr=$obj->uploadFiles();
if(is_array($arr))
{
echo json_encode($arr);
}
else
{
echo $arr;
}
?>
//簡單的文件上傳類
upload.class.php
<?php
//文件上傳類
class Upload{
private $path; //上傳路徑
private $allowtype=array(); //資源類型
private $maxsize; //容許上傳的文件大小
private $file; //file表單的name
private $error=1; //定義路徑不存在的錯誤
//構造方法
public function __construct($path,$allowtype,$maxsize,$file)
{
$this->path = $path;
//首先檢查文件路徑是否存在
if(!file_exists($this->path))
{
$this->error=0;
// exit('ERROR:文件路徑不存在!');
}
$this->allowtype = $allowtype;
$this->maxsize = $maxsize;
$this->file = $file;
}
//上傳一個資源的方法
public function uploadFiles()
{
if($this->error==0)
{
return 0;
}
//首先判斷系統是否容許上傳,以及有沒有出現error
$eor= $_FILES[$this->file]['error'];
if($eor!=0)
{
return 1;//異步傳輸專用
// exit("ERROR:錯誤編號:{$eor}!");
}
//判斷文件的擴展名
$suf= strrchr($_FILES[$this->file]['name'],'.');
if(!in_array($suf,$this->allowtype))
{
return 2;
// exit('ERROR:文件類型被拒絕!');
}
//判斷文件的大小
$size= $_FILES[$this->file]['size'];
if($size>$this->maxsize)
{
return 3;
// exit('ERROR:文件過大!');
}
/*當知足上面全部的條件的時候,進行文件上傳
而且返回資源的絕對路徑
相對路徑
以及文件名*/
$tempname = $_FILES[$this->file]['tmp_name'];
date_default_timezone_set('PRC');
$newname = date('YmdHis').'-'.mt_rand(100,999).$suf;
$rootpath=dirname(__FILE__).'/'.$this->path.'/'.$newname;
if(move_uploaded_file($tempname,$this->path.'/'.$newname))
{
return array('picname'=>$newname,'picpath'=>$rootpath,'relpicpath'=>$this->path.'/'.$newname);
}
}
}
?>
//前臺頁面提交表單後的入庫頁面
model.php
<?php
$dbh=new PDO('mysql:host=localhost;dbname=test;','root','');
$dbh->exec('set names utf8');
$_POST['picpath']=addslashes(str_replace('/', '\\', $_POST['picpath']));
$sql="insert into mytab (picname,picpath,relpicpath) values
('$_POST[picname]','$_POST[picpath]','$_POST[relpicpath]')";
$info=$dbh->exec($sql);
?>
//解釋:頁面很是的簡單,固然這是測試用的.
邏輯過程:
1.前臺頁面index.php:第一個表單專門用來添加圖片.經過change事件觸發當前表單提交事件.
2.在提交的upload.php頁面中,引入upload.class.php.經過數字註釋能夠獲得每一個不一樣的錯誤返回(在index.php中頁面底部的js部分),當上傳成功的時候返回圖片的絕對地址(更新或者刪除數據的時候以便刪除沒用的圖片),圖片的名稱,以及圖片的相對地址(頁面展現使用).
3.upload.class.php的返回值經過upload.php進行進一步的判斷,若是是數組說明上傳成功,若是是單個的數字,說明上傳失敗.而且將信息返回給前臺.
4.index.php接收到upload.php返回的信息,若是爲單個數字的話,進行相應的錯誤提醒.若是是一個json格式的數據,那個經過$.parseJSON將其轉變成json對象,而且在下面的js代碼中進行調用. 分別爲:在頁面的第二個form表單中建立input:hidden,將所須要的信息存儲起來以便在提交表單的時候進行使用.同時這裏也作了一個判斷,若是第二個form表單中已經存在樂hidden說明已經不是第一張圖片了,因此直接將以後的圖片拼接在hidden的value後面.同時,若是成功的話在id爲pics的div中會出現100*100縮略圖.
5.最後在index.php中點擊submit提交全部的圖片信息準備入庫.在model.php中,直接實例化了pdo,寫了一條sql語句進行了測試,結果沒有問題.
注意:index.php中要引入:jquery.form.js
在model.php中addslashes()函數很重要,在數據庫中單獨的一條斜線"\"在我本次的測試中在數據庫中這條斜線就不見了.以前也碰掉相似的問題,當時是沒有插入進去.因此在這裏進行一次轉義.
到此整個過程完成.
做爲一個php新人,但願在這裏和你們共同進步,這個程序可能安全行,性能什麼的我都沒有考慮到,用起來可能也有必定的侷限性.但願你們多多指點.