SpringBoot+ajax+formData实现图片上传和回显

<h2>图片上传</h2>
<img src="" id="preview_photo" width="200px" height="200px">
<a href="javascript:void(0)" id="photo_upload" onclick="upLoadPhoto()">select photo</a>
<input type="file" id="upload" style="display: none" onchange="upload()">

<script>
    function upLoadPhoto(){
        $("#upload").click();
    }
    function upload(){
        var form = new FormData();
        form.append("file", $("#upload")[0].files[0]);
        $.ajax({
            type :"POST",
            url:"http://localhost:8888/picture/upload.json",
            dataType:"json",
            data:form,
            processData:false,
            contentType:false,
            success:function(data){
                console.info(data.result.path);
                $("#preview_photo").attr("src",data.result.path);
            },
            error:function (data) {
                alert("error");
            }
        })
    }
</script>

package com.zdj.controller;

import com.zdj.utils.R;
import org.springframework.web.bind.annotation.*;
import org.springframework.web.multipart.MultipartFile;
import java.io.File;
import java.io.IOException;
import java.text.SimpleDateFormat;
import java.util.Date;
import java.util.HashMap;
import java.util.Map;
import java.util.UUID;

@RestController
@RequestMapping("/picture")
public class PictureController {
    //图片的物理存储路径
    private static final String filePath = "D:/aaaaa/";
    //设置的tomcat静态虚拟路径
    private static final String vFilePath = "http://localhost:8888/pic/";
    @RequestMapping("/upload")
    public R upLoad(@RequestParam("file") MultipartFile file[]){
        //获取图片的名字
        String fileName = file[0].getOriginalFilename();
        //获取文件后缀名
        String suffix = getSuffix(fileName);
        //判断后缀名
        if(!suffix.equals("jpg") && !suffix.equals("png")){
            System.out.println("suffix error");
            return R.ok("0");
        }
        //返回map来获取图片的虚拟路径
        Map<String, String> result = new HashMap<>();
        //date文件夹，方便管理
        String dateFile = new SimpleDateFormat("yyyyMMdd").format(new Date());
        String newfileName = filePath + dateFile;
        File newFile = new File(newfileName);
        //判断文件夹是否存在，不存在则创建
        if(!newFile.exists()){
            newFile.mkdirs();
        }
        //为文件添加uuid防止名字重复
        fileName = UUID.randomUUID().toString().replace("-","") + fileName;
        String newFilePath = newfileName + "/" + fileName;
        result.put("path",vFilePath + dateFile + "/" + fileName);
        try {
            file[0].transferTo(new File(newFilePath));
        } catch (IllegalStateException|IOException e) {
            e.printStackTrace();
        }
        return R.ok(result);
    }
    //封装获取后缀名方法
    public static String getSuffix(String fileName){
        int lastIndexOf = fileName.lastIndexOf(".");
        String suffix = fileName.substring(lastIndexOf + 1);
        return suffix;
    }
}

package com.zdj.config;

import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.ResourceHandlerRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;

@Configuration
public class WebMvcConfig implements WebMvcConfigurer {
    @Override
    public void addResourceHandlers(ResourceHandlerRegistry registry) {
        registry.addResourceHandler("/pic/**").addResourceLocations("file:D:/aaaaa/");
    }

}