layui多文件上传springMVC后端处理

最新推荐文章于 2024-05-04 09:47:20 发布

The-third-brother

最新推荐文章于 2024-05-04 09:47:20 发布

阅读量1.2k

点赞数 1

分类专栏：文件上传 springMVC layui

本文链接：https://blog.csdn.net/weixin_39666151/article/details/95473659

版权

本文介绍了如何使用layui前端框架结合SpringMVC实现多文件上传。前端通过layui的多文件上传组件，每个文件发送单独的上传请求。后端只需处理单文件上传的Controller，配合SpringMVC配置，完成文件接收与存储。

摘要由CSDN通过智能技术生成

文章目录

- 前端jsp
- springMVC后端处理多文件上传

效果预览：

使用框架：SSM

前端jsp

使用layui的多文件上传组件，官网地址：https://www.layui.com/demo/upload.html 。在标签里引入layui的css以及js文件，更改js代码的请求上传接口即可。代码如下：

    <%@ page contentType="text/html;charset=utf-8" %>
    <html>
    <head>
        <title>文件寄存</title>
        <link rel="stylesheet" href="/static/css/layui.css" media="all">
        <script src="/static/layui.js"></script>
        <script
                src="https://code.jquery.com/jquery-3.4.1.js"
                integrity="sha256-WpOohJOqMqqyKL9FccASB9O0KwACQJpFTUBLTYOVvVU="
                crossorigin="anonymous"></script>
        <style>
            .c{
                width: 800px;
                margin: 50px auto;
            }
        </style>
    </head>
    <body>
    <%@include file="navigation.jsp"%>
    <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
    <div class="c">
        <c:if test="${u == null}"><label class="layui-form-item">登录后即可上传文件</label></c:if>
        <c:if test="${u != null}">
    <div class="layui-upload">
        <button type="button" class="layui-btn layui-btn-normal" id="testList">选择多文件</button>
        <div class="layui-upload-list">
            <table class="layui-table">
                <thead>
                <tr><th>文件名</th>
                    <th>大小</th>
                    <th>状态</th>
                    <th>操作</th>
                </tr></thead>
                <tbody id="demoList"></tbody&g