本文實例講述了封裝thinkphp6通用文件上傳方法，上傳功能使用的是layui的upload組件。
封裝Thinkphp6.0通用文件上傳教程
一、打開項目在config文件夾下創建upload.php配置文件用來管理文件上傳的后綴和大小
<?php return [ //定義允許上傳文件后綴的數組 'suffix_arr' =>??[ ????????//允許圖片上傳的后綴 ????????'image'?????=>??'jpg,jpeg,png,gif', ????????//允許上傳文件的后綴 ????????'file'??????=>??'zip,gz,doc,txt,pdf,xls', ????????//... ????], ????//定義允許上傳文件大小的數組 ????'size_arr'??????=>??[ ????????//允許圖片上傳的大小 ????????'image'?????=>??10, ????????//允許文件上傳的大小 ????????'file'??????=>??50 ????], ];
二、修改config ilesystem.php配置文件配置上傳根目錄及上傳規則
<?php return [ // 默認磁盤 'default' =>?env('Filesystem.driver',?'local'), ????//?磁盤列表 ????'disks'???=>?[ ????????'local'??=>?[ ????????????'type'?=>?'local', ????????????'root'?=>?app()->getRuntimePath()?.?'storage', ????????], ????????'public'?=>?[ ????????????//?磁盤類型 ????????????'type'???????=>?'local', ????????????//?磁盤路徑 ????????????'root'???????=>?app()->getRootPath()?.?'public/uploads', ????????????//?磁盤路徑對應的外部URL路徑 ????????????'url'????????=>?'/uploads', ????????????//?可見性 ????????????'visibility'?=>?'public', ????????], ????????//?更多的磁盤配置信息 ????], ];
三、 在appcontroller目錄下創建Upload.php類并編寫upload()文件上傳方法
<?php namespace appcontroller; use thinkexceptionValidateException; class Upload { //上傳 public function upload() { //判斷是否是POST請求,如果是處理上傳邏輯 if (request()->isPost()){ ????????????//接收文件上傳類型 ????????????$type?=?request()->param('type','','trim'); ????????????$name?=?request()->param('name','','trim'); ????????????//獲取表單上傳文件 ????????????$file?=?request()->file('file'); ????????????//組裝文件保存目錄 ????????????$upload_dir?=?'/'.$type.'/'.$name; ????????????try?{ ????????????????//從config/upload.php配置文件中讀取允許上傳的文件后綴和大小 ????????????????$suffix_config?=?config('upload.suffix_arr'); ????????????????$size_config?=?config('upload.size_arr'); ????????????????if?(empty($size_config[$type])?||?empty($size_config[$type])){ ????????????????????return?false; ????????????????}else{ ????????????????????$suffix?=?$suffix_config[$type]; ????????????????????$size?=?$size_config[$type]; ????????????????} ????????????????//驗證器驗證上傳的文件 ????????????????validate(['file'=>[ ????????????????????//限制文件大小 ????????????????????'fileSize'??????=>??$size?*?1024?*?1024, ????????????????????//限制文件后綴 ????????????????????'fileExt'???????=>??$suffix ????????????????]],[ ????????????????????'file.fileSize'?=>??'上傳的文件大小不能超過'.$size.'M', ????????????????????'file.fileExt'??=>??'請上傳后綴為:'.$suffix.'的文件' ????????????????])->check(['file'=>$file]); ????????????????//上傳文件到本地服務器 ????????????????$filename?=? hink acadeFilesystem::disk('public')->putFile($upload_dir,?$file); ????????????????if?($filename){ ????????????????????$src?=?'/uploads/'.$filename; ????????????????????return?JSon(['code'=>1,'result'=>$src]); ????????????????}else{ ????????????????????return?json(['code'=>0,'msg'=>'上傳失敗']); ????????????????} ????????????}catch?(ValidateException?$e){ ????????????????return?json(['code'=>0,'msg'=>$e->getMessage()]); ????????????} ????????}else{ ????????????return?json(['code'=>0,'msg'=>'非法請求']); ????????} ????} }
四、 打開appcontrollerIndex.php類并修改index方法
立即學習“PHP免費學習筆記（深入）”；
<?php namespace appcontroller; use appBaseController; class Index extends BaseController { public function index() { //渲染前端頁面 return view(); } }
五、在app iewindex目錄下創建index.html文件
nbsp;html> ????<meta> ????<title>文件上傳</title> ????<!-- layui.css 推薦使用本地文件 --> ????<link> ????<style> #avatar_thumb { position: absolute; left: 50%;top: 50%; width: 168px; height: 168px; margin: -50px 0 0 -84px; border-radius: 100%; } </style><div> ????<div> ????????<div> ????????????<button> ????????????????<i></i>上傳頭像 ????????????</button> ????????????@@##@@ ????????????<input> ????????</div> ????</div> </div> <!-- layui.js 和jquery.js 推薦使用本地文件 --> <script></script><script></script><script></script><script> layui.use(['form', 'upload'], function() { var upload = layui.upload; //圖片上傳 common_upload('avatar'); //文件上傳 //common_upload('avatar','file'); }); </script>
六、在publicStaticlibjs目錄下創建common.js
/** ?*?@desc?通用文件上傳 ?*?@param?name??文件存儲文件夾 ?*?@param?type?文件類型：默認為圖片類型(image) ?*/ function?common_upload(name,type='image')?{ ????layui.use(['form',?'upload'],?function()?{ ????????var?upload?=?layui.upload; ????????//選完文件后自動上傳 ????????upload.render({ ????????????elem:?'#'+name, ????????????url:?"/upload/upload", ????????????auto:?true, ????????????accept:?'file',?//普通文件 ????????????data:{name:name,type:type}, ???????????? ????????????done:?function(data)?{ ????????????????console.log(data); ????????????????//上傳完畢回調 ????????????????if?(data.code?==?0)?{ ????????????????????return?layer.msg(data.msg,{icon:2}); ????????????????}?else?{ ????????????????????$("#"+name+"_thumb").attr('src',data.result).show(); ????????????????????$('input[name='+name+']').val(data.result); ????????????????} ????????????} ????????}); ????}); }
七、測試圖片上傳
7.1、為了方便，本文就不在本地部署項目了，采用thinkphp內置的服務器
進到項目根目錄，執行以下命令：
php?think?run
7.2、在瀏覽器地址欄中輸入訪問地址，發現報錯？
7.3、遇到錯誤不要慌，我們打開ThinkPHP的調試功能,看看具體錯誤信息
7.4、通過開啟調試模式，發現報錯原因是我們沒有安裝模板引擎，在ThinkPHP6.0中默認只能支持PHP原生模板，如果需要使用thinkTemplate模板引擎，需要安裝think-view擴展
7.5、進到項目根目錄下，輸入以下命令進行安裝think-view模板
composer?require?topthink/think-view
7.6、再次訪問，訪問成功。不過圖片顯示的是破裂的，如果覺得不好看，小伙伴們可以自行設置一個默認圖片。
7.7、測試圖片上傳。從GIF圖中可以看出上傳圖片大小和后綴不符合配置文件中設置的值，會給出相應的提示信息，只有上傳符合配置文件中設置的值的圖片才會在頁面中顯示并存儲到本地。
7.8、如果需要上傳文件，視頻或音頻，只需要修改以下兩個地方，這里就不演示了，小伙伴們下去自己試下。
八、新圖片上傳成功后自動刪除原圖，有效地減少垃圾信息的累積
8.1、在appcontrollerUpload.php中添加delImg() 方法
<?php namespace appcontroller; use thinkexceptionValidateException; class Upload { //上傳 public function upload() { //判斷是否是POST請求,如果是處理上傳邏輯 if (request()->isPost()){ ????????????//接收文件上傳類型 ????????????$type?=?request()->param('type','','trim'); ????????????$name?=?request()->param('name','','trim'); ????????????//獲取表單上傳文件 ????????????$file?=?request()->file('file'); ????????????//組裝文件保存目錄 ????????????$upload_dir?=?'/'.$type.'/'.$name; ????????????try?{ ????????????????//從config/upload.php配置文件中讀取允許上傳的文件后綴和大小 ????????????????$suffix_config?=?config('upload.suffix_arr'); ????????????????$size_config?=?config('upload.size_arr'); ????????????????if?(empty($size_config[$type])?||?empty($size_config[$type])){ ????????????????????return?false; ????????????????}else{ ????????????????????$suffix?=?$suffix_config[$type]; ????????????????????$size?=?$size_config[$type]; ????????????????} ????????????????//驗證器驗證上傳的文件 ????????????????validate(['file'=>[ ????????????????????//限制文件大小 ????????????????????'fileSize'??????=>??$size?*?1024?*?1024, ????????????????????//限制文件后綴 ????????????????????'fileExt'???????=>??$suffix ????????????????]],[ ????????????????????'file.fileSize'?=>??'上傳的文件大小不能超過'.$size.'M', ????????????????????'file.fileExt'??=>??'請上傳后綴為:'.$suffix.'的文件' ????????????????])->check(['file'=>$file]); ????????????????//上傳文件到本地服務器 ????????????????$filename?=? hink acadeFilesystem::disk('public')->putFile($upload_dir,?$file); ????????????????if?($filename){ ????????????????????$src?=?'/uploads/'.$filename; ????????????????????return?json(['code'=>1,'result'=>$src]); ????????????????}else{ ????????????????????return?json(['code'=>0,'msg'=>'上傳失敗']); ????????????????} ????????????}catch?(ValidateException?$e){ ????????????????return?json(['code'=>0,'msg'=>$e->getMessage()]); ????????????} ????????}else{ ????????????return?json(['code'=>0,'msg'=>'非法請求']); ????????} ????} ????//刪除舊圖片 ????public?function?delImg() ????{ ????????if?(request()->isPost()?&&?request()->isAjax()){ ????????????//獲取舊圖片地址 ????????????$img_url?=?input('img_url','','trim'); ????????????//如果舊圖片地址為系統默認圖片地址直接返回true;?這里的系統默認地址小伙伴可以自行設置 ????????????if($img_url?==?'/uploads/image/avatar/default/user_avatar.jpg'){ ????????????????return?true; ????????????} ????????????//ROOT_PATH常量建議定義在入口文件index.php或中間件中，這里為了演示方便就先定義在這里。 ????????????define('ROOT_PATH',dirname(str_replace("",'/',$_SERVER['SCRIPT_FILENAME']))."/"); ????????????//如果接收的圖片地址不為空,循環刪除 ????????????if?(!empty($img_url)){ ????????????????$old_image?=?array(ROOT_PATH.$img_url); ????????????????foreach?($old_image?as?$img){ ????????????????????if?(file_exists($img)){ ????????????????????????@unlink($img); ????????????????????} ????????????????} ????????????} ????????????return?json(['code'=>1,'msg'=>'圖片刪除成功']); ????????}else{ ????????????return?json(['code'=>0,'msg'=>'圖片刪除失敗']); ????????} ????} }
8.2、在common.js中的common_upload()方法中定義before()
/** ?*?@desc?通用文件上傳 ?*?@param?name??文件存儲文件夾 ?*?@param?type?文件類型：默認為圖片類型(image) ?*/ function?common_upload(name,type='image')?{ ????layui.use(['form',?'upload'],?function()?{ ????????var?upload?=?layui.upload; ????????//選完文件后自動上傳 ????????upload.render({ ????????????elem:?'#'+name, ????????????url:?"/upload/upload", ????????????auto:?true, ????????????accept:?'file',?//普通文件 ????????????data:{name:name,type:type}, ????????????before:?function(obj)?{ ????????????????var?img_url?=?$('input[name='+name+']').val(); ????????????????//?刪除老數據 ????????????????if?(img_url?!=?'')?{ ????????????????????$.ajax({ ????????????????????????url:?"/upload/delImg", ????????????????????????type:?'POST', ????????????????????????data:?{ ????????????????????????????img_url:?img_url ????????????????????????}, ????????????????????}); ????????????????} ????????????}, ????????????done:?function(data)?{ ????????????????console.log(data); ????????????????//上傳完畢回調 ????????????????if?(data.code?==?0)?{ ????????????????????return?layer.msg(data.msg,{icon:2}); ????????????????}?else?{ ????????????????????$("#"+name+"_thumb").attr('src',data.result).show(); ????????????????????$('input[name='+name+']').val(data.result); ????????????????} ????????????} ????????}); ????}); }
相關推薦：1. thinkphp技術專題2. thinkphp視頻教程
? 版權聲明
文章版權歸作者所有，未經允許請勿轉載。
THE END
