利用layui实现文件上传功能

利用layui实现文件上传功能

1. 前端部分

<input class="btn-upload file-up" style="display: inline-block;" type="file" accept="image/*" multiple name="risenUpload" id="file3">上传</input>

 var uploadInst3 = upload.render({
   
            elem: '#file3' //绑定元素
            ,url: '${base}/public/upload/uploadFile.do'
            ,data:{
   
                'crfileType' : '04',
            }
            ,before: function(obj){
    //obj参数包含的信息，跟 choose回调完全一致，可参见上文。
                obj.preview(function(index, file, result){
   
                    //  console.log(file); //得到文件对象
                    name=file.name;
                    size=file.size;
                });
            }
            ,done: function(res){
   
                // 附件回显js编写处
                console.log(res);
                risenfgForm = res.data.originalName;
                if(risenfgForm.length > 25){
   
                    risenfgForm = risenfgForm.substr(risenfgForm.length - 25);
                    $('#images4').html(risenfgForm);
                }else{
   
                    $('#images4').html(risenfgForm);
                }

                $('#images4').html(risenfgForm);
                $('#span4').show();
                var fileUuid4 = res.data.fileUuid;
                //给隐藏框的uuid赋值
                $("#fileUuid4").val(fileUuid4);
            }
            ,error: function(res){
   
                alert("上传接口出错");
                //  console.log(res);
            }
        });

2. 后台调用接口

package com.risen.wechat.controller;

import com.risen.base.frame.controller.ExeMvcAction;
import com.risen.hp.fastjson.JSONObject;
import com.risen.resrc.model.CoreResrcFile;
import com.risen.resrc.service.ICoreResrcFileService;
import com.risen.wechat.unit.FetchPropertyUtil;
import com.risen.wechat.unit.ResponseTemplate;
import org.apache.ibatis.annotations.Param;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org