WEB 文件上传

Posted 2020-08-28 日月心诚

一、后台的文件上传action

    private String tempPath = this.servletContext.getRealPath("") + File.separator + "tempFolder";
    private String realPath = this.servletContext.getRealPath("") + File.separator + "realFolder";
    private File attach;//前台传入
    private String attachContentType;
    private String attachFileName;
    private String attachTempName;
    /**
     * 创建任务时附件首先上传到临时文件夹
     * @return
     */
    @Action(value="UploadTemp")
    public String UploadTemp(){
        
        System.out.println("!!!!!!!进入文件上传！！！！！！！");
        int fileState = 0;//标识目标文件是否存在，如果存在提醒修改文件名称 0表示不重复，1表示重复,2表示文件复制出错
        String wpyId = request.getParameter("wpyId");
        //临时文件由原文件名+#+用户名组成以防重复，个人每次任务只传一个文件，正式传完即删除临时文件夹内容，不会重复
        String attachTempName = wpyId+"#"+attachFileName;
        //看临时路径是否存在
        Util.checkDirExist(tempPath);
        String attachFile = tempPath + File.separator + attachTempName;
        //创建目标文件
        File destFile = new File(attachFile);  
        if (destFile.exists()) {
            new File(attachFile).delete();  
        }
        
        int byteread = 0; // 读取的字节数
        InputStream in = null;  
        OutputStream out = null;  
        try {  
            in = new FileInputStream(attach);  
            out = new FileOutputStream(destFile);  
            byte[] buffer = new byte[1024];  
            //定义一个流 in，存入buffer中,=-1代表读完
            while ((byteread = in.read(buffer)) != -1) {  
                out.write(buffer, 0, byteread);  
            }  
//                return true;  
        } catch (FileNotFoundException e) {  
            fileState = 2;
            e.printStackTrace();  
//                return false;  
        } catch (IOException e) {  
            fileState = 2;
            e.printStackTrace();  
//                return false;  
        } finally {  
            try {  
                if (out != null)  
                    out.close();  
                if (in != null)  
                    in.close(); 
                attach.delete();
            } catch (IOException e) {  
                e.printStackTrace();  
            }  
        }
        
        Map<String, Object> fileInfo = new HashMap<String, Object>();
        fileInfo.put("uploadName", attachTempName);
        fileInfo.put("fileState", fileState);
        outputJson(fileInfo);
        return NONE;
    }

二、前台页面

<div class="col-sm-2" style="padding-right:0px">
	<a id="advancedDropzone" class="btn btn-primary" style="width:100%">
		点击上传图片
	</a>
</div>
<div class="col-sm-6" style="padding-left:0px">
	<div class="input-group">
        　　<input readonly type="text" id="img_name" class="form-control">									
       　　　　 <div class="input-group-btn">
          　　　　 <a id="delTempFile" tabindex="-1" class="btn btn-primary" type="button">删除文件</a>
       　　　　 </div>
        </div>
</div>

　三、js 发起请求

　

//上传附件按钮组件
        var example_dropzone = $("#advancedDropzone").dropzone({
            //首先上传到临时位置，如果整体提交，再移动到规定位置，如果整体取消，则删除临时文件
            url: baseCtx+‘/.../UploadTemp.action?Id=‘+curuser,
            paramName: "attach",
             acceptedFiles: ".jpg,.png,.bmp",
            dictDefaultMessage:"点击上传文件",
            maxFiles:1,//一次性上传的文件数量上限
            maxFilesize: 20, //MB
            addedfile: function(file)
            {
                var size = parseInt(file.size/1024, 10);
                size = file.size < 1024 ? (file.size + " 字节") : (size + " KB");
                upLoadSize = size;
                $("#img_name").val(file.name+"    "+upLoadSize+"    上传中...");
            },
            success:function(file,data){
                var currData = $.parseJSON(data);
                uploadName = currData.uploadName;
                $("#opr_screenshot_name").val(uploadName+"    "+upLoadSize+"    已完成");
                //激活删除临时文件按钮
                $("#delTempFile").off().on("click",function(){
                    $("#opr_screenshot_name").val("");
                    $.ajax({
                        url : baseCtx+‘/.../delTempFile.action‘, //TODO
                        data : {
                            attachTempName:uploadName
                        },
                        type : ‘post‘,
                        async : false,
                        dataType : "json",
                        success: function(data){
                            
                        }
                    })
                })
            },
            error: function(file)
            {
                alert(file.name+"上传未成功")
            },
            removedfile:function(file){
                uploadName="";
            }
        })     
})