Thinkphp框架+Layui实现图片/文件上传功能分析


Posted in PHP onFebruary 07, 2020

本文实例讲述了Thinkphp框架+Layui实现图片/文件上传功能。分享给大家供大家参考,具体如下:

在项目中用到了,再网上找了现成的代码都是借口异常或者非法上传,所以在一番摸索搞定之后拿来和大家分享。

html:

<form class="layui-form layui-form-pane" action="" style="margin-top:20px;" enctype="multipart/form-data">
  <center>
    <div class="layui-upload-drag" id="uploadBanner">
      <img class="layui-upload-img" id="upload-photo">
      <i class="layui-icon" id="upload-icon">?</i>
      <p>点击上传,或将文件拖拽到此处</p>
      <p>建议尺寸1920*512</p>
    </div>
    <input type="hidden" id="res" name="banner_photo" value="" lay-verify="required" />
    <div class="layui-form-item" style="margin-top:10px;">
      <button class="layui-btn" lay-submit="" lay-filter="sub">提交</button>
    </div>
    <div id="demoText"></div>
  </center>
</form>

JS:

layui.use('upload', function(){
  var $ = layui.jquery
    ,upload = layui.upload;
  //普通图片上传
  var uploadInst = upload.render({
    elem: '#uploadBanner'
    ,url: "{:U('Api/doUploadPic')}"
    ,before: function(obj){
      //预读本地文件示例,不支持ie8
      obj.preview(function(index, file, result){
        $('#upload-photo').attr('src', result); //图片链接(base64)
        $('#upload-photo').attr('style', 'height:10rem;');
        $('#upload-icon').attr('style','display:none;');
      });
    }
    ,done: function(res, index, upload){
      //如果上传失败
      if(res.code > 0){
        return layer.msg('上传失败');
      }
      //上传成功
      console.log("成功啦!" + obj2string(res) + "  " + index + "  " + upload);
    }
    ,error: function(){
      //演示失败状态,并实现重传
      var demoText = $('#demoText');
      demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
      demoText.find('.demo-reload').on('click', function(){
        uploadInst.upload();
      });
    }
  });
});

PHP接口:

public function doUploadPic()//上传模块
  {
    $upload = new \Think\Upload();
    $upload->maxSize = 3145728;
    $upload->exts = array('jpg', 'gif', 'png', 'jpeg');
    $upload->rootPath = './Public/'; // 设置附件上传根目录
    $upload->savePath = 'upload/'; // 设置附件上传子目录
    $info = $upload->upload();
    if(!$info){
      $this->error($upload->getError());
    }else{
      foreach($info as $file){
      $data = '/Public'.$file['savepath'] . $file['savename'];
      $file_a=$data;
      echo '{"code":0,"msg":"成功上传","data":{"src":"'.$file_a.'"}}';
      }
    }
  }

图片就上传到/Public/upload文件夹下了:

Thinkphp框架+Layui实现图片/文件上传功能分析

Thinkphp框架+Layui实现图片/文件上传功能分析

希望本文所述对大家基于ThinkPHP框架的PHP程序设计有所帮助。

PHP 相关文章推荐
56.com视频采集接口程序(PHP)
Sep 22 PHP
Optimizer与Debugger兼容性问题的解决方法
Dec 01 PHP
PHP中开发XML应用程序之基础篇 添加节点 删除节点 查询节点 查询节
Jul 09 PHP
php设计模式 Visitor 访问者模式
Jun 28 PHP
PHP 字符串长度判断效率更高的方法
Mar 02 PHP
PHP使用PHPexcel导入导出数据的方法
Nov 14 PHP
PHP随机数 C扩展随机数
May 04 PHP
php中分页及SqlHelper类用法实例
Jan 12 PHP
如何离线执行php任务
Feb 21 PHP
php读取本地json文件的实例
Mar 07 PHP
Laravel 创建指定表 migrate的例子
Oct 09 PHP
你真的了解PHP中的引用符号(&)吗
May 12 PHP
PHP查找一列有序数组是否包含某值的方法
Feb 07 #PHP
php测试kafka项目示例
Feb 06 #PHP
PHP图像处理 imagestring添加图片水印与文字水印操作示例
Feb 06 #PHP
PHP实现常用排序算法的方法
Feb 05 #PHP
PHP ElasticSearch做搜索实例讲解
Feb 05 #PHP
PHP实现新型冠状病毒疫情实时图的实例
Feb 04 #PHP
php post换行的方法
Feb 03 #PHP
You might like
php addslashes及其他清除空格的方法是不安全的
2012/01/25 PHP
ThinkPHP的URL重写问题
2014/06/22 PHP
推荐几个开源的微信开发项目
2014/12/28 PHP
使用新浪微博API的OAuth认证发布微博实例
2015/03/27 PHP
php实现的支付宝网页支付功能示例【基于TP5框架】
2019/09/16 PHP
php中使用array_filter()函数过滤数组实例讲解
2021/03/03 PHP
教你如何解密js/vbs/vbscript加密的编码异处理小结
2008/06/25 Javascript
分享XmlHttpRequest调用Webservice的一点心得
2012/07/20 Javascript
jquery 插件学习(六)
2012/08/06 Javascript
在JS中解析HTML字符串示例代码
2014/04/16 Javascript
chrome不支持form.submit的解决方案
2015/04/28 Javascript
js实现当复选框选择匿名登录时隐藏登录框效果
2015/08/14 Javascript
js实现正则匹配中文标点符号的方法
2015/12/23 Javascript
关于JS中setTimeout()无法调用带参函数问题的解决方法
2016/06/21 Javascript
微信小程序使用第三方库Immutable.js实例详解
2016/09/27 Javascript
原生javascript上传图片带进度条【实例分享】
2017/04/06 Javascript
Bootstrap Table快速完美搭建后台管理系统
2017/09/20 Javascript
使用JS代码实现俄罗斯方块游戏
2018/08/03 Javascript
vue里的data要用return返回的原因浅析
2019/05/28 Javascript
微信小程序 行的删除和增加操作实现详解
2019/09/29 Javascript
vue中的mescroll搜索运用及各种填坑处理
2019/10/30 Javascript
python简单程序读取串口信息的方法
2015/03/13 Python
详解Django中的form库的使用
2015/07/18 Python
10 行Python 代码实现 AI 目标检测技术【推荐】
2019/06/14 Python
Django微信小程序后台开发教程的实现
2020/06/03 Python
python爬虫把url链接编码成gbk2312格式过程解析
2020/06/08 Python
python3实现将json对象存入Redis以及数据的导入导出
2020/07/16 Python
德国排名第一的主题公园门票网站:Attraction Tickets Direct
2019/09/09 全球购物
Linux管理员面试题 Linux admin interview questions
2014/11/01 面试题
高中生家长会演讲稿
2014/01/14 职场文书
大学生水果店创业计划书
2014/01/28 职场文书
煤矿安全承诺书
2014/05/22 职场文书
2015年班长个人工作总结
2015/04/03 职场文书
暑期辅导班宣传单
2015/07/14 职场文书
css3实现背景图片半透明内容不透明的方法示例
2021/04/13 HTML / CSS
Redis缓存-序列化对象存储乱码问题的解决
2021/06/21 Redis