ThinkPHP + Layui 上传文件

特别申明：

1、不够完美，有BUG，但是也能用

2、后端第九步还需要判断：如果文件夹不存在，则创建该文件夹功能

3、由于文件保存在public目录下，可以直接使用url访问文件，不够隐私，安全性差

详解：

1、确保你的thinkphp为单应用状态

2、你需要在 public 目录下面手动创建 upload 文件夹

3、在app\controller的目录下创建一个名为：Upload.php的文件（控制器）

4、请确保你的layui、jquery放在了static目录下面

5、将下面代码复制到 Upload.php中

<?php
namespace app\controller;
use think\facade\View;
use think\facade\Request;

Class Upload{

    public function index(){
        return View::fetch();
    }

    public function upload(){
        // $_FILES 数组 键值 说明：
        // 1、上传文件名: $_FILES["file"]["name"] 
        // 2、文件类型: $_FILES["file"]["type"] 
        // 3、文件大小: $_FILES["file"]["size"] / 1024) kB
        // 4、文件临时存储的位置: $_FILES["file"]["tmp_name"] 

  
        // 第一步：配置允许上传的文件类型
        $file_types = [
            "image/gif",
            "image/jpeg",
            "image/jpg",
            "image/pjpeg",
            "image/x-png",
            "image/png",
            "application/pdf",
            "application/vnd.ms-excel"
        ];

        // 第二步：如果被上传的文件类型 不在 允许上传的类型范围内
        if(!in_array($_FILES["file"]["type"],$file_types)){
            return json(['status'=>100,'msg'=>'文件类型不符合要求','path'=>'M']);
            exit;
        };

        // 第三步：配置允许上传的文件大小 5M
        // 说明：单位为字节
        // 5242880 字节 = 5120 千字节  KB
        // 5242880 字节 = 5 兆字节  M
        $file_size = 5242880;  
 
        // 第四步：如果被上传的文件 大小 超过 允许上传的 文件大小
        if($_FILES["file"]["size"] > $file_size){
            return json(['status'=>100,'msg'=>'上传失败，文件太大了','path'=>'']);
            exit;
        }

        // 第五步：配置允许上传的文件后缀
        // 说明：有时候文件类型 和 文件后缀 并不相同（比如用户修改后缀）
        $file_fomat = array("gif", "jpeg", "jpg", "png","pdf","xls","xlms");

        // 第六步：获取被上传文件的后缀名（格式）
        // 说明函数：explode 取 "."之前的字符
        $file_nemes = explode(".", $_FILES["file"]["name"]);

        // 第七步：获取被上传文件的名称，赋值给变量
        $extension = end($file_nemes);

        // 第七步：判断被上传的文件后缀名是否合法
        if(!in_array($extension,$file_fomat)){
            return json(['status'=>100,'msg'=>'文件后缀名不合法','path'=>'']);
            exit;
        }

        // 第九步：判断 public 目录下的 upload 目录是否存在
        // 如果没有 upload 目录，需要创建它，upload 目录权限为 777




        // 第十步：判断当前目录下是否有同名文件
        if (file_exists("upload/" . $_FILES["file"]["name"])){
            return json(['status'=>100,'msg'=>'上传失败，原因：'.$_FILES["file"]["name"] . " 文件已经存在。",'path'=>'']);
            exit;
        }

        // // 第十一步：把被上传的文件移动到 upload 目录下
        move_uploaded_file($_FILES["file"]["tmp_name"], "upload/" . $_FILES["file"]["name"]);

        // 第十一步：返回前端需要的数据格式 json
        return json(['status'=>200,'msg'=>'上传成功，待保存表单','path'=>"upload/" . $_FILES["file"]["name"]]);
    }
}

5、在app\view目录下创建一个Upload文件夹

6、在app\view\Upload目录下创建一个 index.html 文件

7、把下面代码复制到 index.html 文件中

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Demo</title>
  <!-- 请勿在项目正式环境中引用该 layui.css 地址 -->
  <link rel="stylesheet" href="\static\layui\css\layui.css">
</head>

<body>
    <form class="layui-form">
        <div class="layui-form-item">
            <label class="layui-form-label">标签</label>
            <div class="layui-input-block">
                <button type="button" class="layui-btn" id="firstID">
                    <i class="layui-icon"></i>上传按钮
                </button>
                <input type="hidden" name="url" id="secondID">
            </div>
        </div>
    </form>
    

  <script src="\static\layui\layui.js"></script>
  <script src="\static\jquery\jquery.js"></script>
  
  <script>
    layui.use(['upload','form'], function(){
        var upload = layui.upload;
        var form = layui.form;
        upload.render({
            elem: '#firstID', 			//选中你要绑定的上传组件
            url: '/index.php/Upload/upload',//上传接口
            accept:'file',					//文件类型，不写默认是images，file表示全类型
            done: function(res){		//上传完回调，这里的res必须是json类型
                if (res.status === 200) {
                    layer.msg(res.msg, {icon: 1});
                    $('#secondID').val(res.path);  //回填路径值
                }else{
                    layer.msg(res.msg, {icon: 2});
                }
            },
            error: function(){
                layer.msg('error'+ res.status, {icon: 2});
            }
        });
    });
</script>


</body>
</html>

8、浏览器输入url：www.你的域名.com/index.php/Upload/index

9、问题：thinkphp第九步，有人会吗？