springboot使用uploadify上传文件

拼搏现实的明天。 2023-07-03 07:18 24阅读 0赞

1.首先引入uploadify的插件  
jquery.uploadify.js  
jquery.uploadify.min.js 是uploadify.swf提供我们操作uploadify.swf 的js对象  
uploadify.swf 做上传的flash程序  
uploadify-cancel.png 取消上传的图片

![在这里插入图片描述][20200204105251479.png]  
2.2.先看官网给我们的Basic Demo

$(function() { 
        $("#file_upload_1").uploadify({ 
            height    : 30,
            swf       : '/uploadify/uploadify.swf',
            uploader  : '/uploadify/uploadify.php',
            width     : 120
        });
    });

3.引入js文件  
4.点击上传按钮

$("#upload").uploadify({ 
                    height    : 30,
                    swf       : '/js/plugins/uploadify/uploadify.swf',
                    uploader  : 'uploadImage',
                    width     : 120,
                    fileObjName : "image",
                    buttonText    : "上传照片",
                    fileTypeExts  : "*.jpg;*.png;*.gif;*.jpeg",
                    multi      : false,
                    overrideEvents:['onUploadSuccess','onSelect'],
                    //图片回显
                    onUploadSuccess:function(file,data){ 
                        $("#uploadImg1").attr("src",data);
                        $("#uploadImage1").val(data);
                    }
                });

swf :flash程序地址  
uploader:处理文件上传的后台地址,  
fileObjName:上传文件名  
buttonText:选择上传文件按钮文字  
fileTypeExts:上传文件的类型  
multi :是否可以多选  
overrideEvents:重写事件  
onUploadSuccess:上传成功回调函数(回显图片)  
onSelect:选择文件后向队列中添加每个上传任务时都会触发(这里是重写这个方法的空方法 覆盖原有的方法不显示上传进度之类的)  
\#\#\#\#\#\#5.处理后台业务  
处理文件上传的后台地址uploader : “/uploadImage”  
先在pom.xml中添加依赖

<dependency>
       <groupId>commons-io</groupId>
       <artifactId>commons-io</artifactId>
       <version>2.2</version>
     </dependency>

@RequestMapping("uploadImage")
        @ResponseBody
        public  String upload(MultipartFile file){ 
            String fileName = UploadUtil.upload(file, Consts.FILE_PATH);
            return fileName;
        }

6.处理文件上传的工具类

package com.fym.newp2p.base.util;
    
    import org.apache.commons.io.FileUtils;
    import org.apache.commons.io.FilenameUtils;
    import org.springframework.web.multipart.MultipartFile;
    
    import java.io.File;
    import java.io.IOException;
    import java.util.UUID;
    
    /** * 上传工具 * * @author Administrator * */
    public class UploadUtil { 
    
    	/** * 处理文件上传 * * @param file * @param basePath * 存放文件的目录的绝对路径 servletContext.getRealPath("/upload") * @return */
    	public static String upload(MultipartFile file, String basePath) { 
    		String orgFileName = file.getOriginalFilename();
    		String fileName = UUID.randomUUID().toString() + "." + FilenameUtils.getExtension(orgFileName);
    		try { 
    			File targetFile = new File(basePath, fileName);
    			FileUtils.writeByteArrayToFile(targetFile, file.getBytes());
    		} catch (IOException e) { 
    			e.printStackTrace();
    		}
    		return fileName;
    	}
    }

7.需要在配置文件中配置相关属性

spring.resources.static-locations=classpath:/META-INF/resources/,classpath:/resources/,classpath:/static/,classpath:/public/,file:D:/upload

[20200204105251479.png]: https://img-blog.csdnimg.cn/20200204105251479.png