溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
今天做項目的時候碰見一個問題:之前一個同事離職之前做了一個網站,有一個上傳商品詳細圖片的功能,當時已經完成,但是由于后期程序的有更改以及更改的程序員的水平也是參差不齊,最后導致程序bug很多,由于當時用的是一個框架,最終也沒找到說明文檔,后來我就重新寫了一個結合ajax上傳文件的upload.classs.php雖然界面欠缺美觀,但是通俗易懂好維護.
//首先是頁面.
index.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>upload</title>
<script src="source/jquery.js"></script>
<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新人,希望在這里和大家共同進步,這個程序可能安全行,性能什么的我都沒有考慮到,用起來可能也有一定的局限性.希望大家多多指點.
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
