SpringBoot 使用MultipartFile上传组件实现本地上传用户头像

 GIF动图展示

SpringBoot 使用MultipartFile上传组件实现本地上传用户头像GIF效果图

本章目录

 GIF动图展示

主要实现思路

1.使用MultipartFile需要引入的依赖

2.前端使用的是JSP页面,这里用的onchange当内容发送改变的时候调用JS方法实现异步更新用户头像​

3.以下是JS+jQuery代码

4.以下是后端控制器Controller的代码

关键代码

1.后台控制器关键代码:

2.使用到的工具类UUIDUtils的代码

3.application.yml的关键配置

以上所有步骤都完成了但是后台还是取不到值,解决方法如下


主要实现思路

前端通过ajax请求将图片数据传递到后台,后台再通过前端传递过来的图片二进制数据得到图片的名称,并把图片写入到本地保存(路径是项目目录下的绝对路径),同时把图片名称存储到数据库中表中的某一列,然后把图片的名称也传递到前端,前端根据后端传来的图片名称拼接上项目的相对路径即可显示头像。

1.使用MultipartFile需要引入的依赖



    commons-fileupload
    commons-fileupload
    1.4


    commons-io
    commons-io
    2.4

2.前端使用的是JSP页面,这里用的onchange当内容发送改变的时候调用JS方法实现异步更新用户头像SpringBoot 使用MultipartFile上传组件实现本地上传用户头像_第1张图片

3.以下是JS+jQuery代码

(注意!ajax中传递的数据是 multipart/form-data ,不过不写貌似也没问题,但如果是form表单提交数据的话必须加上 enctype="multipart/form-data" 属性,不然后端会取不到值)

SpringBoot 使用MultipartFile上传组件实现本地上传用户头像_第2张图片

4.以下是后端控制器Controller的代码

SpringBoot 使用MultipartFile上传组件实现本地上传用户头像_第3张图片

SpringBoot 使用MultipartFile上传组件实现本地上传用户头像_第4张图片

关键代码

1.后台控制器关键代码:

//判断是否上传了头像
if (!file.isEmpty()){
    logger.info("进行头像的上传");

    //文件存储在本地的绝对路径
    String path = ("D:\\IntelliJ IDEA\\mall\\src\\main\\webapp\\res\\images\\item\\userProfilePicture\\");

    //UUIDUtils为工具类,使用它随机生成一串字符(作用:上传图片时给图片名称拼接上去,防止图片名称重复)
    String n = UUIDUtils.create();
    String path2 = path + n + file.getOriginalFilename();
    //创建File对象,一会向该路径下上传文件
    File newFile = new File(path2);
    //MultipartFile的方法直接写文件
    file.transferTo(newFile);
}

2.使用到的工具类UUIDUtils的代码

public class UUIDUtils {
    /*public static String getUUID(){
        String uuid = UUID.randomUUID().toString().replace("-","");
        return uuid;
    }*/

    private static boolean IS_THREADLOCALRANDOM_AVAILABLE = false;
    private static Random random;
    private static final long leastSigBits;
    private static final ReentrantLock lock = new ReentrantLock();
    private static long lastTime;

    static {
        try {
            IS_THREADLOCALRANDOM_AVAILABLE = null != UUIDUtils.class.getClassLoader().loadClass(
                    "java.util.concurrent.ThreadLocalRandom");
        } catch (ClassNotFoundException e) {
        }

        byte[] seed = new SecureRandom().generateSeed(8);
        leastSigBits = new BigInteger(seed).longValue();
        if (!IS_THREADLOCALRANDOM_AVAILABLE) {
            random = new Random(leastSigBits);
        }
    }

    private UUIDUtils() {
    }

    /**
     * Create a new random UUID.
     *
     * @return the new UUID
     */
    public static String random() {
        byte[] randomBytes = new byte[16];
        if (IS_THREADLOCALRANDOM_AVAILABLE) {
            java.util.concurrent.ThreadLocalRandom.current().nextBytes(randomBytes);
        } else {
            random.nextBytes(randomBytes);
        }

        long mostSigBits = 0;
        for (int i = 0; i < 8; i++) {
            mostSigBits = (mostSigBits << 8) | (randomBytes[i] & 0xff);
        }
        long leastSigBits = 0;
        for (int i = 8; i < 16; i++) {
            leastSigBits = (leastSigBits << 8) | (randomBytes[i] & 0xff);
        }

        return new UUID(mostSigBits, leastSigBits).toString().replaceAll("-", "");
    }

    /**
     * Create a new time-based UUID.
     *
     * @return the new UUID
     */
    public static String create() {
        long timeMillis = (System.currentTimeMillis() * 10000) + 0x01B21DD213814000L;

        lock.lock();
        try {
            if (timeMillis > lastTime) {
                lastTime = timeMillis;
            } else {
                timeMillis = ++lastTime;
            }
        } finally {
            lock.unlock();
        }

        // time low
        long mostSigBits = timeMillis << 32;

        // time mid
        mostSigBits |= (timeMillis & 0xFFFF00000000L) >> 16;

        // time hi and version
        mostSigBits |= 0x1000 | ((timeMillis >> 48) & 0x0FFF); // version 1

        return new UUID(mostSigBits, leastSigBits).toString().replaceAll("-", "");
    }
}

3.application.yml的关键配置

# 在Spring Boot中有默认的文件上传组件,在使用ServletFileUpload时需要关闭Spring Boot的默认配置
servlet:
  multipart:
    enabled: false
    # 最大的文件大小
    max-file-size: 20MB
    # 单次最大请求大小
    max-request-size: 20MB

以上所有步骤都完成了但是后台还是取不到值,解决方法如下

在SpringBoot启动类中加入以下代码,比如我的启动类是:

@SpringBootApplication
@EnableAutoConfiguration
public class MallApplication extends SpringBootServletInitializer {

    public static void main(String[] args) {
        SpringApplication.run(MallApplication.class, args);
    }

    //解决上传文件控制层接收为null的方法
    @Bean(name = "multipartResolver")
    public CommonsMultipartResolver multipartResolver() {
        CommonsMultipartResolver multipartResolver = new CommonsMultipartResolver();
        return multipartResolver;
    }
}


最终,用户头像的上传的功能到这就结束了,如果本文帮你们解决了问题,不忘支持一下博主哦!

你可能感兴趣的:(Java,spring,boot,java,后端,ssm,intellij,idea)