封装ThinkPHP6.0通用文件上传

本文实例讲述了封装thinkphp6通用文件上传方法,上传功能使用的是layui的upload组件。

封装ThinkPHP6.0通用文件上传教程

一、打开项目在config文件夹下创建upload.php配置文件用来管理文件上传的后缀和大小

  [        //允许图片上传的后缀        'image'     =>  'jpg,jpeg,png,gif',        //允许上传文件的后缀        'file'      =>  'zip,gz,doc,txt,pdf,xls',        //...    ],    //定义允许上传文件大小的数组    'size_arr'      =>  [        //允许图片上传的大小        'image'     =>  10,        //允许文件上传的大小        'file'      =>  50    ],];

二、修改configilesystem.php配置文件配置上传根目录及上传规则

 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()文件上传方法

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 = hinkacadeFilesystem::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免费学习笔记(深入)”;

<?phpnamespace appcontroller;use appBaseController;class Index extends BaseController{    public function index()    {        //渲染前端页面        return view();    }}

五、在appiewindex目录下创建index.html文件

        文件上传                    #avatar_thumb {            position: absolute;            left: 50%;top: 50%;            width: 168px;            height: 168px;            margin: -50px 0 0 -84px;            border-radius: 100%;        }    
封装ThinkPHP6.0通用文件上传
layui.use(['form', 'upload'], function() { var upload = layui.upload; //图片上传 common_upload('avatar'); //文件上传 //common_upload('avatar','file'); });

六、在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

run.png

7.2、在浏览器地址栏中输入访问地址,发现报错?

bc.png

7.3、遇到错误不要慌,我们打开ThinkPHP的调试功能,看看具体错误信息

企业WAP2.0网站管理系统1.0 企业WAP2.0网站管理系统1.0

系统安装步骤   1、安装QuickWAP组件。将QuickWAP.dll拷贝到System32文件夹下,在开始菜单运行 regsvr32 QuickWAP.dll 即可。   2、将“WAP2.0企业系统源码”目录下的文件通过FTP传到服务器上,或在本机IIS上调试,然后通过域名或IP访问。 简介:   新版企业WAP2.0手机网站采用QuickWAP X

企业WAP2.0网站管理系统1.0 0 查看详情 企业WAP2.0网站管理系统1.0

debug.png

7.4、通过开启调试模式,发现报错原因是我们没有安装模板引擎,在ThinkPHP6.0中默认只能支持PHP原生模板,如果需要使用thinkTemplate模板引擎,需要安装think-view扩展

view.png

7.5、进到项目根目录下,输入以下命令进行安装think-view模板

composer require topthink/think-view

7.6、再次访问,访问成功。不过图片显示的是破裂的,如果觉得不好看,小伙伴们可以自行设置一个默认图片。

msg.png

7.7、测试图片上传。从GIF图中可以看出上传图片大小和后缀不符合配置文件中设置的值,会给出相应的提示信息,只有上传符合配置文件中设置的值的图片才会在页面中显示并存储到本地。

上传演示图-投稿使用.gif

7.8、如果需要上传文件,视频或音频,只需要修改以下两个地方,这里就不演示了,小伙伴们下去自己试下。

QQ截图20200504112839.png

八、新图片上传成功后自动删除原图,有效地减少垃圾信息的累积

8.1、在appcontrollerUpload.php中添加delImg() 方法

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 = hinkacadeFilesystem::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视频教程

以上就是封装ThinkPHP6.0通用文件上传的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/859383.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2025年11月27日 22:02:55
下一篇 2025年11月27日 22:03:18

相关推荐

  • 学会从头开始学习CSS,掌握制作基本网页框架的技巧

    从零开始学习CSS,掌握网页基本框架制作技巧 前言: 在现今互联网时代,网页设计和开发是一个非常重要的技能。而学习CSS(层叠样式表)是掌握网页设计的关键之一。CSS不仅可以为网页添加样式和布局,还可以为用户呈现独特且具有吸引力的页面效果。在本文中,我将为您介绍一些基本的CSS知识,以及一些常用的代…

    2025年12月24日
    200
  • 揭秘Web标准涵盖的语言:了解网页开发必备的语言范围

    在当今数字时代,互联网成为了人们生活中不可或缺的一部分。作为互联网的基本构成单位,网页承载着我们获取和分享信息的重要任务。而网页开发作为一门独特的技术,离不开一些必备的语言。本文将揭秘Web标准涵盖的语言,让我们一起了解网页开发所需的语言范围。 首先,HTML(HyperText Markup La…

    2025年12月24日
    000
  • 揭开Web开发的语言之谜:了解构建网页所需的语言有哪些?

    Web标准中的语言大揭秘:掌握网页开发所需的语言有哪些? 随着互联网的快速发展,网页开发已经成为人们重要的职业之一。而要成为一名优秀的网页开发者,掌握网页开发所需的语言是必不可少的。本文将为大家揭示Web标准中的语言大揭秘,介绍网页开发所需的主要语言。 HTML(超文本标记语言)HTML是网页开发的…

    2025年12月24日
    400
  • 常用的网页开发语言:了解Web标准的要点

    了解Web标准的语言要点:常见的哪些语言应用在网页开发中? 随着互联网的不断发展,网页已经成为人们获取信息和交流的重要途径。而要实现一个高质量、易用的网页,离不开一种被广泛接受的Web标准。Web标准的制定和应用,涉及到多种语言和技术,本文将介绍常见的几种语言在网页开发中的应用。 首先,HTML(H…

    2025年12月24日
    000
  • 网页开发中常见的Web标准语言有哪些?

    探索Web标准语言的世界:网页开发中常用的语言有哪些? 在现代社会中,互联网的普及程度越来越高,网页已成为人们获取资讯、娱乐、交流的重要途径。而网页的开发离不开各种编程语言的应用和支持。在这个虚拟世界的网络,有许多被广泛应用的标准化语言,用于为用户提供优质的网页体验。本文将探索网页开发中常用的语言,…

    2025年12月24日
    000
  • 深入探究Web标准语言的范围,涵盖了哪些语言?

    Web标准是指互联网上的各个网页所需遵循的一系列规范,确保网页在不同的浏览器和设备上能够正确地显示和运行。这些标准包括HTML、CSS和JavaScript等语言。本文将深入解析Web标准涵盖的语言范围。 首先,HTML(HyperText Markup Language)是构建网页的基础语言。它使…

    2025年12月24日
    000
  • CSS 超链接属性解析:text-decoration 和 color

    CSS 超链接属性解析:text-decoration 和 color 超链接是网页中常用的元素之一,它能够在不同页面之间建立连接。为了使超链接在页面中有明显的标识和吸引力,CSS 提供了一些属性来调整超链接的样式。本文将重点介绍 text-decoration 和 color 这两个与超链接相关的…

    2025年12月24日
    000
  • 看看这些前端面试题,带你搞定高频知识点(一)

    每天10道题,100天后,搞定所有前端面试的高频知识点,加油!!!,在看文章的同时,希望不要直接看答案,先思考一下自己会不会,如果会,自己的答案是什么?想过之后再与答案比对,是不是会更好一点,当然如果你有比我更好的答案,欢迎评论区留言,一起探讨技术之美。 面试官:给定一个元素,如何实现水平垂直居中?…

    2025年12月24日 好文分享
    300
  • 看看这些前端面试题,带你搞定高频知识点(二)

    每天10道题,100天后,搞定所有前端面试的高频知识点,加油!!!,在看文章的同时,希望不要直接看答案,先思考一下自己会不会,如果会,自己的答案是什么?想过之后再与答案比对,是不是会更好一点,当然如果你有比我更好的答案,欢迎评论区留言,一起探讨技术之美。 面试官:页面导入样式时,使用 link 和 …

    2025年12月24日 好文分享
    200
  • 看看这些前端面试题,带你搞定高频知识点(三)

    每天10道题,100天后,搞定所有前端面试的高频知识点,加油!!!,在看文章的同时,希望不要直接看答案,先思考一下自己会不会,如果会,自己的答案是什么?想过之后再与答案比对,是不是会更好一点,当然如果你有比我更好的答案,欢迎评论区留言,一起探讨技术之美。 面试官:清除浮动有哪些方式? 我:呃~,浮动…

    2025年12月24日 好文分享
    000
  • 看看这些前端面试题,带你搞定高频知识点(四)

    每天10道题,100天后,搞定所有前端面试的高频知识点,加油!!!,在看文章的同时,希望不要直接看答案,先思考一下自己会不会,如果会,自己的答案是什么?想过之后再与答案比对,是不是会更好一点,当然如果你有比我更好的答案,欢迎评论区留言,一起探讨技术之美。 面试官:请你谈一下自适应(适配)的方案 我:…

    2025年12月24日 好文分享
    000
  • 看看这些前端面试题,带你搞定高频知识点(五)

    每天10道题,100天后,搞定所有前端面试的高频知识点,加油!!!,在看文章的同时,希望不要直接看答案,先思考一下自己会不会,如果会,自己的答案是什么?想过之后再与答案比对,是不是会更好一点,当然如果你有比我更好的答案,欢迎评论区留言,一起探讨技术之美。 面试官:css 如何实现左侧固定 300px…

    2025年12月24日 好文分享
    000
  • HTML+CSS+JS实现雪花飘扬(代码分享)

    使用html+css+js如何实现下雪特效?下面本篇文章给大家分享一个html+css+js实现雪花飘扬的示例,希望对大家有所帮助。 很多南方的小伙伴可能没怎么见过或者从来没见过下雪,今天我给大家带来一个小Demo,模拟了下雪场景,首先让我们看一下运行效果 可以点击看看在线运行:http://hai…

    2025年12月24日 好文分享
    500
  • 分享20个首页流行布局样式,总有一款适合你!

    本篇文章给大家分享20个首页流行布局样式,总有一款适合你,快来收藏试试吧,希望对大家有所帮助! 有时我们会在网站上遇到一些内容布局问题,如文字对齐、图片设计与内容和谐、为文章选择合适的字体……在今天的文章中,介绍一些设计精美的创意布局,let‘s  开始。 代号 001 源码…

    2025年12月24日 好文分享
    000
  • css如何让div悬浮于另一个div上

    让div悬浮于另一个div上的方法:1、给两个div元素添加“position:absolute”绝对定位样式;2、给其中一个div元素添加“{top:距离页面顶部距离;left:距离页面左侧距离;}”样式使其浮动在另一个div元素上即可。 本教程操作环境:windows7系统、CSS3&&…

    2025年12月24日 好文分享
    000
  • css怎样实现字母不到一行就换行

    css字母不到一行就换行的方法:1、给元素添加“word-break:break-word;”样式,使其以单词为单位换行;2、给元素添加“word-break:break-all;”样式,使其以字母为单位换行。 本教程操作环境:windows7系统、CSS3&&HTML5版、Dell…

    2025年12月24日
    000
  • css里怎样设置字体大小和字体颜色

    在css中,可以使用“font-size”和color属性设置字体大小和字体颜色,只需要给字体元素添加“{font-size: 字体大小值;color: 颜色值;}”样式即可。 本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。 css里设置字体大小…

    2025年12月24日
    000
  • css边框变圆角边框怎么写

    写法:1、给边框添加“border-radius:圆角值;”样式统一设置圆角大小;2、添加“border-top-left-radius:圆角值;”、“border-top-right-radius:圆角值;”等样式分别设置四角圆角大小。 本教程操作环境:windows7系统、CSS3&&a…

    2025年12月24日
    000
  • css如何使鼠标悬停变色

    在css中,可以通过hover选择器和color属性实现鼠标悬停变色的效果,hover选择器用于选择鼠标指针浮动在上面的元素,color属性用于设置悬停时的颜色;语法“:hover{color:悬停颜色;}”。 本教程操作环境:windows7系统、CSS3&&HTML5版、Dell…

    2025年12月24日 好文分享
    000
  • 手把手教你使用css制作表格边框设置效果(附代码)

    之前的文章《一招教你使用css3制作按钮添加动态效果(代码分享)》中,给大家介绍了怎么使用css3制作按钮添加动态效果。下面本篇文章给大家介绍怎么使用css制作表格边框设置效果,我们一起看看怎么做。 网页中常常有这样的表格布局边框,给大家分享一下看效果图看完效果,我们来研究一下是怎么实现呢,给大家用…

    2025年12月24日 好文分享
    000

发表回复

登录后才能评论
关注微信