整合 spring mvc

前端

  [jsp]
1
2
3
4
5
6
7
8
9
10
11
12
13
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
</head>
<body>
    <form action="/fileUpload" method="post" enctype="multipart/form-data">
        用户名：<input type="text" name="username"> <br>
        文件： <input type="file" name="imgFile"> <br>
        <input type="submit" value="上传">
    </form>
</body>
</html>

后端

  [java]
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.multipart.MultipartFile;

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

/**
 * 2. SpringMVC提供的文件上传
 */
@Controller
public class UploadController {

    /**
     * SpringMVC文件上传
     * 1. 控制器方法通过MultipartFile获取整个上传的文件。
     * 2. 参数名称upload(MultipartFile imgFile..) 中的imgFile一定要与页面的文件域的表单元素名称一致.
     *    <input type="file" name="imgFile">
     */
    @RequestMapping("/fileUpload")
    public String upload(MultipartFile imgFile,String username,HttpServletRequest request) throws Exception {
        //1. 获取上传的目录路径
        // D:/classes/IdeaProjects2019/springmvc02/target/springmvc02-1.0-SNAPSHOT/upload
        String path = request.getSession().getServletContext().getRealPath("/upload");

        //2. 以天为单位，一天创建一个文件夹，保存当天上传的文件
        String date = new SimpleDateFormat("yyyy-MM-dd").format(new Date());

        //3. 创建目录
        File file = new File(path,date);
        if (!file.exists()){
            // 创建目录或子目录
            file.mkdirs();
        }

        //4. 文件上传
        //4.1 获取原始文件名
        String fileName = imgFile.getOriginalFilename();
        fileName = UUID.randomUUID().toString() + fileName.substring(fileName.lastIndexOf("."));
        //4.2 文件上传 【关键代码】
        imgFile.transferTo(new File(file,fileName));
        return "success";
    }
}

String username 这种参数也可以直接传递对象。

spring mvc 会把参数帮我们封装好。

文件的进一步处理

根据传递的参数解析为 file。

  [java]
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
public File createFile(MultipartFile partFile) {
    String fileName = partFile.getOriginalFilename();
    // 创建历史文件
    File tempFile = FileUtils.createFile(fileName);
    try {
        // 文件大小校验
        long fileBytes = partFile.getSize();
        if(fileBytes <= 0) {
            throw new RuntimeException();
        }
        if(fileBytes > maxBytes) {
            throw new RuntimeException();
        }

        // 流写入
        try (FileOutputStream fos = new FileOutputStream(tempFile);
             BufferedOutputStream bos = new BufferedOutputStream(fos);) {
            bos.write(partFile.getBytes());
        } catch (Exception e) {
            logger.error("文件解析失败", e);
            throw new RuntimeException();
        }
        // 上传到 jfile
        return tempFile;
    } finally {
        FileUtils.deleteFile(tempFile);
    }
}

jquery 如何提交 form

form 表单中有 file 信息，而且需要返回的结果

  [js]
1
2
3
4
5
6
7
8
9
10
11
12
13
$("#register-form").submit(function (event) {
    event.preventDefault();
    $.ajax({
        url:"/user/register",
        type:"POST",
        data:new FormData(this),
        contentType:false,
        processData:false,
        success:function(status){
            console.log(status);
        }
    })
});

FormData的数据会自动组织成 multipart/form-data 形式的，因此不需要JQuery进行转化了，因此 contentType,processData 为false

CORS 问题

报错

  [plaintext]
1
has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

全局定义

  [java]
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
package com.example.demo;
 
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
import org.springframework.web.filter.CorsFilter;
 
@Configuration
public class CorsConfig {
    private CorsConfiguration buildConfig() {
        CorsConfiguration corsConfiguration = new CorsConfiguration();
        corsConfiguration.addAllowedOrigin("*");
        corsConfiguration.addAllowedHeader("*");
        corsConfiguration.addAllowedMethod("*");
        return corsConfiguration;
    }
 
    @Bean
    public CorsFilter corsFilter() {
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        // 配置所有请求
        source.registerCorsConfiguration("/**", buildConfig());
        return new CorsFilter(source);
    }
}

注解指定

第二种，在你要访问的Controller的方法上面加上注解 @CrossOrigin

  [java]
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.*;
import org.springframework.web.servlet.ModelAndView;
import java.util.ArrayList;
import java.util.List;
 
@Controller
public class TestController {
 
 
    @CrossOrigin
    @RequestMapping("/user/login1")
    @ResponseBody
    public List<User> userLogin(User user) {
        System.out.println(user);
        ArrayList<User> users = new ArrayList<>();
        for (int i = 0; i < 3; i++) {
            users.add(user);
        }
        return users;
    }
}