文件上传功能

从layui找到文件上传部分类容

找到需要的的样式，复制出html和接收部分代码

html中

<div class="layui-form-item">
    <label class="layui-form-label">
        <span class="x-red">*</span>产品图片</label>
    <div class="layui-input-inline">
        <button type="button" class="layui-btn" id="file">上传图片</button>
        <div class="layui-upload-list">
            <img class="layui-upload-img" style="width: 100px;height: 100px" id="demo1">
        </div>
    </div>
    <div class="layui-form-mid layui-word-aux">
        <span class="x-red">*</span>
    </div>
</div>

js中

let upload = layui.upload;
    //常规使用 - 普通图片上传
    let uploadInst = upload.render({
        elem: '#file'
        , url: '/upload' //此处用的是第三方的 http 请求演示，实际使用时改成您自己的上传接口即可。
        , before: function (obj) {
            //预读本地文件示例，不支持ie8
            obj.preview(function (index, file, result) {
                $('#demo1').attr('src', result); //图片链接（base64）
            });
        }
        , done: function (res) {
            console.log(res);
            path = res.data.src;

            //如果上传失败
            if (res.code > 0) {
                return layer.msg('上传失败');
            }
            //上传成功的一些操作
            //……
            $('#demoText').html(''); //置空上传失败的状态
        }
    });

在后端写出文件上传的java代码，搜索‘servlet文件上传’寻找相关代码

导入相关依赖

<dependency>
    <groupId>commons-io</groupId>
    <artifactId>commons-io</artifactId>
    <version>2.11.0</version>
</dependency>
<dependency>
    <groupId>commons-fileupload</groupId>
    <artifactId>commons-fileupload</artifactId>
    <version>1.4</version>
</dependency>

后台代码

@WebServlet("/upload")
public class UploadServlet extends HttpServlet {
    // 上传文件存储目录
    private static final String UPLOAD_DIRECTORY = "upload";
    /**
     * 上传数据及保存文件
     */
    protected void doPost(HttpServletRequest request,
                          HttpServletResponse response) throws ServletException, IOException {
        // 检测是否为多媒体上传
        if (!ServletFileUpload.isMultipartContent(request)) {
            // 如果不是则停止
            PrintWriter writer = response.getWriter();
            writer.println("Error: 表单必须包含 enctype=multipart/form-data");
            writer.flush();
            return;
        }
        // 配置上传参数
        DiskFileItemFactory factory = new DiskFileItemFactory();
        // 设置内存临界值 - 超过后将产生临时文件并存储于临时目录中
        // 设置临时存储目录
//        factory.setRepository(new File(System.getProperty("java.io.tmpdir")));
//        解析文件
        ServletFileUpload upload = new ServletFileUpload(factory);
        // 中文处理
        upload.setHeaderEncoding("UTF-8");
        // 构造临时路径来存储上传的文件
        // 这个路径相对当前应用的目录
        String uploadPath = request.getServletContext().getRealPath("./") + "/" + UPLOAD_DIRECTORY;
        ResultDTO resultDTO = null;
        createDirectory(uploadPath);
        try {
            // 解析请求的内容提取文件数据
            @SuppressWarnings("unchecked")
            List<FileItem> formItems = upload.parseRequest(request);
            if (formItems != null && formItems.size() > 0) {
                // 迭代表单数据
                for (FileItem item : formItems) {
                    // 处理不在表单中的字段
                    if (!item.isFormField()) {
//                        文件名称
                        String fileName = new File(item.getName()).getName();
                        fileName = System.currentTimeMillis() + "--" + fileName;
//                        文件保存的绝对路径
                        String filePath = uploadPath + "/" + fileName;
                        File storeFile = new File(filePath);
                        // 保存文件到硬盘
                        item.write(storeFile);
//                        拷贝一份文件到web目录下
                        copyFile(storeFile, fileName);
                        resultDTO = ResultDTO.getResult("", 1, new ImgDTO("/" + UPLOAD_DIRECTORY + "/" + fileName));
                    }
                }
            }
        } catch (Exception ex) {
            request.setAttribute("message",
                    "错误信息: " + ex.getMessage());
        }
        response.getWriter().println(JSONObject.toJSONString(resultDTO));
    }
    private void createDirectory(String uploadPath) {
        // 如果目录不存在则创建
        File uploadDir = new File(uploadPath);
        if (!uploadDir.exists()) {
            uploadDir.mkdir();
        }
    }
    private void copyFile(File storeFile, String fileName) {
        String path = storeFile.getPath().split("out")[0] + "/web/" + UPLOAD_DIRECTORY;
        createDirectory(path);
        File file = new File(path, fileName);
        try (InputStream inputStream = new FileInputStream(storeFile);
             OutputStream outputStream = new FileOutputStream(file);) {
            int read = 0;
            while ((read = inputStream.read()) != -1) {
                outputStream.write(read);
            }
        } catch (IOException e) {
            e.printStackTrace();
        }
    }
}

private void createDirectory(String uploadPath)方法，如果文件夹不存在，就创建需要的文件夹

private void copyFile(File storeFile, String fileName)方法，将文件从out文件夹中复制复制到其他位置