SpringBoot从入门到精通十一(SpringBoot文件上传的两种方法)

前言

在企业级项目开发过程当中,上传文件是最经常使用到的功能。SpringBoot集成了SpringMVC,固然上传文件的方式跟SpringMVC没有什么出入。html

本章目标

使用SpringBoot项目完成单个、多个文件的上传处理,并将上传的文件保存到指定目录下。这里咱们会使用layui,若是有不懂layui的同行能够去layui官网java

官网地址:https://www.layui.com/web

搭建项目

1)项目搭建的主要步骤我在这里就很少重复了,咱们直接勾选Web依赖,而后生成项目,结构以下spring

表单文件上传

  单文件上传

1)因为SpringBoot的项目结构不一样于SSM,不少企业也会用jsp页面,对我而言我不太喜欢,通常咱们的jsp页面都是放在/src/main/webapp/WEB_INF/jsp,如今咱们在这个目录先配置html,若是有须要配置jsp页面的同行把后缀名改一下就能够了,如今咱们去application.properties中配置访问的页面以及目录,目录结构以下数组

 

2)application.properties配置以下服务器

 

spring.mvc.view.prefix=/WEB_INF/jsp/

spring.mvc.view.suffix=.html

 3)如今去控制器配置一下访问的页面,新建控制器IndexController,代码以下,而后启动运行mvc

IndexControllerapp

package com.demo03.demo_03.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;

@Controller
public class IndexController {
    @RequestMapping("/")
    public String index(){
        return  "index";
    }
}

4)如今咱们访问一下页面,index.html代码以下dom

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>单图片上传</title>
</head>
<body>
<form action="" enctype="multipart/form-data" method="post">
    <input type="file" name="file">
    <input type="submit" value="图片上传">
</form>
</body>
</html>

5)如今咱们去控制器编写代码,更新后的IndexController以下webapp

package com.demo03.demo_03.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.multipart.MultipartFile;

import javax.servlet.http.HttpServletRequest;
import java.io.File;
import java.util.UUID;

@Controller
public class IndexController {
    @RequestMapping("/")
    public String index(){
        return  "index";
    }
    //单图片上传
    @RequestMapping("/upload")
    @ResponseBody
    public String upload(HttpServletRequest request, MultipartFile file){
        try{
            //上传目录地址
            String uploadDir=request.getSession().getServletContext().getRealPath("/")+"upload/";
            //判断目录是否存在,若是不存在则构建目录
            File dir=new File(uploadDir);
            if(!dir.mkdir()){
                dir.mkdir();
            }
            //文件名后缀
            String suffix=file.getOriginalFilename().substring(file.getOriginalFilename().lastIndexOf("."));
            //上传文件名
            String fileName= UUID.randomUUID()+suffix;
            //服务端保存的文件对象
            File saveFile=new File(uploadDir+fileName);
            //将上传的文件写入到服务器端文件内
            file.transferTo(saveFile);
        }catch (Exception e){
            e.printStackTrace();
            return "上传失败";
        }
        return "上传成功";
    }
}

6)如今咱们去index.html中上传图片,效果以下,能够看到咱们图片上传成功了

index.html更新后

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>单图片上传</title>
</head>
<body>
<form action="/upload" enctype="multipart/form-data" method="post">
    <input type="file" name="file">
    <input type="submit" value="图片上传">
</form>
</body>
</html>

 

  多文件上传

1)因为咱们要用到多图片上传,因此咱们先去控制器更新一下代码,更新后的IndexController代码以下

package com.demo03.demo_03.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.multipart.MultipartFile;

import javax.servlet.http.HttpServletRequest;
import java.io.File;
import java.io.IOException;
import java.util.UUID;

@Controller
public class IndexController {
    @RequestMapping("/")
    public String index(){
        return  "index";
    }
    //单图片上传
    @RequestMapping("/upload")
    @ResponseBody
    public String upload(HttpServletRequest request, MultipartFile file){
        try{
            //上传目录地址
            String uploadDir=request.getSession().getServletContext().getRealPath("/")+"upload/";
            //判断目录是否存在,若是不存在则构建目录
            File dir=new File(uploadDir);
            if(!dir.mkdir()){
                dir.mkdir();
            }
            //文件名后缀
            String suffix=file.getOriginalFilename().substring(file.getOriginalFilename().lastIndexOf("."));
            //上传文件名
            String fileName= UUID.randomUUID()+suffix;
            //服务端保存的文件对象
            File saveFile=new File(uploadDir+fileName);
            //将上传的文件写入到服务器端文件内
            file.transferTo(saveFile);
        }catch (Exception e){
            e.printStackTrace();
            return "上传失败";
        }
        return "上传成功";
    }
    //提取上传图片的公共方法
    /*
    * uploadDir 上传目录
    * file上传对象
    * */
    public  void  executeUpload(String uploadDir,MultipartFile file) throws IOException {
        //文件名后缀
        String suffix=file.getOriginalFilename().substring(file.getOriginalFilename().lastIndexOf("."));
        //上传文件名
        String fileName=UUID.randomUUID()+suffix;
        //服务端保存文件对象
        File saveFile=new File(uploadDir+fileName);
        //将上传的文件写入到服务器端文件内
        file.transferTo(saveFile);
    }
    //多文件上传
    @RequestMapping("/uploadArray")
    @ResponseBody
    public String uploadArray(HttpServletRequest request,MultipartFile[] file){
        try {
            //上传目录地址
            String uploadDir=request.getSession().getServletContext().getRealPath("/")+"upload/";
            //若是目录不存在,则构建目录
            File dir=new File(uploadDir);
            if(!dir.exists()){
                dir.mkdir();
            }
            //遍历文件数组执行上传
            for(int i=0;i<file.length;i++){
                if(file[i]!=null){
                    //调用上传的方法
                    executeUpload(uploadDir,file[i]);
                }
            }
        }catch (Exception e){
            e.printStackTrace();
            return "上传失败";
        }
        return "上传成功";
    }
}

2)更新index.html页面,发现上传成功,更新后的index.html以下

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>单图片上传</title>
</head>
<body>
<h2>单文件上传</h2>
<form action="/upload" enctype="multipart/form-data" method="post">
    <input type="file" name="file">
    <input type="submit" value="图片上传">
</form>
<h1>多个文件上传</h1>
<form action="/uploadArray" enctype="multipart/form-data" method="post">
    <input type="file" name="file">
    <input type="file" name="file">
    <input type="file" name="file">
    <input type="submit" value="图片上传">
</form>
</body>
</html>

3)基本的表单上传如上案例,SpringBoot上传文件时限制了咱们上传文件最大容量为:1048576 bytes,那咱们须要上传超过配置的文件时修改怎么作呢?打开application.properties配置文件,加入spring.http.multipart.max-file-size以及spring.http.multipart.max-request-size配置信息,配置以下:

 

Ajax异步图片上传

  单图片上传

  多图片上传

总结

经过本章的学习,咱们已经能够学会使用两种方法实现文件上传,在之后大多数的开发中咱们都是首选异步文件上传,因此建议各位把异步上传

相关文章
相关标签/搜索