思路是:在app/ceshi/fire下面有一个index操作方法来渲染显示前端文件,然后前端文件跳转到upload操作方法进行处理,成功显示”文件上传成功”,失败显示错误.
首先是后台 app/ceshi/fire
1 <?php 2 namespace app\ceshi\controller; 3 use think\Controller; 4 use think\Request; 5 6 class Fire extends Controller{ 7 8 // 文件上传表单 9 public function index(){10 return $this->fetch();11 }12 13 // 文件上传提交14 public function upload(){15 // 获取表单上传文件16 $file = request()->file('files');17 18 if (empty($file)) {19 $this->error('请选择上传文件');20 }21 // 移动到框架应用根目录/public/uploads/ 目录下22 $info = $file->move(ROOT_PATH . 'public' . DS . 'uploads');23 if ($info) {24 $this->success('文件上传成功');25 echo $info->getFilename();26 } else {27 // 上传失败获取错误信息28 $this->error($file->getError());29 }30 31 }32 33 }
现在是前端文件:fire/index.html
1 <!doctype html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title>文件上传示例</title> 6 <style> 7 body { 8 font-family:"Microsoft Yahei","Helvetica Neue",Helvetica,Arial,sans-serif; 9 font-size:16px;10 padding:5px;11 }.form{12 padding: 15px;13 font-size: 16px;14 }.form .text {15 padding: 3px;16 margin:2px 10px;17 width: 240px;18 height: 24px;19 line-height: 28px;20 border: 1px solid #D4D4D4;21 }.form .btn{22 margin:6px;23 padding: 6px;24 width: 120px;25 26 font-size: 16px;27 border: 1px solid #D4D4D4;28 cursor: pointer;29 background:#eee;30 }.form .file{31 margin:6px;32 padding: 6px;33 width: 220px;34 35 font-size: 16px;36 border: 1px solid #D4D4D4;37 cursor: pointer;38 background:#eee;39 }a{40 color: #868686;41 cursor: pointer;42 }a:hover{43 text-decoration: underline;44 }45 h2{46 color: #4288ce;47 font-weight: 400;48 padding: 6px 0;49 margin: 6px 0 0;50 font-size: 28px;51 border-bottom: 1px solid #eee;52 }div{53 margin:8px;54 }.info{55 padding: 12px 0;56 border-bottom: 1px solid #eee;57 }.copyright{58 margin-top: 24px;59 padding: 12px 0;60 border-top: 1px solid #eee;61 }</style>62 </head>63 <body>64 <h2>文件上传示例</h2>65 <FORM method="post" enctype="multipart/form-data" class="form" action="{:url('upload')}">选择文件:66 <INPUT type="file" class="files" name="files"><br/>67 <INPUT type="submit" class="btn" value=" 提交 ">68 </FORM>69 </body>70 </html>
显示效果:
文件上传成功:
评论前必须登录!
立即登录