爱玺玺

爱玺玺的生活日记本。wx:lb87626

thinkphp5.1+layui实现单图上传

layui的html部分:

      <div class="layui-upload">

        <button type="button" class="layui-btn" id="wxsharepic">微信分享图</button>

        <div class="layui-upload-list">

          <img class="layui-upload-img" id="d1">

          <p id="wxshareText"></p>

        </div>

      </div>   

layui的Js部分:

  //普通图片上传

  var uploadInst = upload.render({

    elem: '#wxsharepic'

    ,url: '/index.php/agent/agent/iconupload' //改成您自己的上传接口

    ,before: function(obj){

      //预读本地文件示例,不支持ie8

      obj.preview(function(index, file, result){

        $('#d1').attr('src', result); //图片链接(base64)

      });

    }

    ,done: function(res){

      //如果上传失败

      if(res.code > 0){

        return layer.msg('上传失败');

      }

      //上传成功

    }

    ,error: function(){

      //演示失败状态,并实现重传

      var demoText = $('#wxshareText');

      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();

      });

    }

  });


thinkphp5.1的接收图片方法代码:


  public function iconupload()

    {

        $icon = Request::file('file');

        if($icon)

        {

            $info = $icon->validate([

                'size'=>10240000,

                'ext'=>'bmp,jpg,png,tif,gif,pcx,tga,exif,fpx,svg,psd,cdr,pcd,dxf,ufo,eps,ai,raw,WMF,webp'

            ])->move('uploads/usericon/');

            if($info)

            {

                $url = "\\uploads\\usericon\\".$info->getSaveName();

                return json(['status'=>100,'message'=>'上传成功','url'=>$url]);

            }

            else

            {

                return json(['status'=>-200,'message'=>$icon->getError(),'url'=>'\static\default_images\user_default_image.jpg']);

            }

        }

    }


发表评论:

Powered By Z-BlogPHP 1.4 Deeplue Build 150101

Copyright Your WebSite.Some Rights Reserved.

蜀ICP备11021721号-5