springboot + layui 实现单个图片的本地上传

	借鉴某位大佬的，久了，忘记了地址，抱歉

1.controller层

package com.xh.lesson.controller;

import com.sun.java.browser.plugin2.liveconnect.v1.Result;
import org.apache.catalina.connector.Request;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.multipart.MultipartFile;

import javax.security.auth.message.callback.PrivateKeyCallback;
import javax.servlet.annotation.MultipartConfig;
import javax.servlet.http.HttpServletRequest;
import java.io.File;
import java.io.IOException;
import java.util.HashMap;
import java.util.Map;

/**
 * @author : su
 * @date : 14:47 2020/4/17
 */
@RestController
@MultipartConfig
@RequestMapping("/index")
public class FileUploadController {
    @PostMapping("/img")
    public Map<String, Object> upload(HttpServletRequest servletRequest, @RequestParam("file")MultipartFile file) throws IOException {
        //如果文件内容不为空，则写入上传路径
        if (!file.isEmpty()) {
            //上传文件路径，本地的路径
            String path = "F:/company-frame/src/main/resources/static/images";

            System.out.println("文件名称"+file.getOriginalFilename());
            //上传文件名
            String filename = file.getOriginalFilename();
            File filepath = new File(path, filename);


            //判断路径是否存在，没有就创建一个
            if (!filepath.getParentFile().exists()) {
                filepath.getParentFile().mkdirs();
            }

            //将上传文件保存到一个目标文档中
            File file1 = new File(path + File.separator + filename);
            file.transferTo(file1);
            Map<String, Object> res = new HashMap<>();
            //返回的是一个url对象
            res.put("url", file1);
            return res;

        } else {

            return null;
        }

    }

}

2.HTML

<form class="layui-form" >
 <div class="layui-form-item">
                <label class="layui-form-label">照片</label>
                <div class="layui-input-block">
                    <button type="button" class="layui-btn" id="upload1">上传图片</button>
                    <input type="hidden" id="img_url" name="img" value=""/>
                    <div class="layui-upload-list">
                        <img class="layui-upload-img" width="200px" height="120px" id="demo1"/>
                        <p id="demoText"></p>
                    </div>
                </div>
            </div>
</form>

3.js层

<script  type="text/javascript">
	var upload = layui.upload;
 layui.use(['upload'], function () {
	var uploadlnst = upload.render({
            elem:'#upload1',
                url: '/index/img',
            before:function (obj) {
                //预读本地文件示例，不支持ie8
                obj.preview(function (index,file,result) {
                    $("#demo1").attr('src',result);
                });
            },

            done:function (res) {
                if (res.code > 0){
                    return layer.msg('上传失败');
                }
                alert('上传成功'+ res.url);
                document.getElementById('img_url').value = res.url;
            },
            error:function () {
                //演示失败状态,重传
                var  demoText = $('#demoText');
                demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-mini demo-reload">重试</a>');
                demoText.find('.demo-reload').on('click', function(){
                uploadlnst.upload();
                 });
            }
        });
});
</script>

4.效果图