学习记录360@springmvc 文件上传

最新推荐文章于 2023-08-10 17:31:27 发布

教练我想学编程

最新推荐文章于 2023-08-10 17:31:27 发布

阅读量89

点赞数

本文链接：https://blog.csdn.net/weixin_44663675/article/details/110931685

版权

在这里插入图片描述

特别注意：前端中必须enctype=“multipart/form-data”，processData: false,//必须，contentType: false,//必须，new FormData方法的使用
后端中：MultipartFile参数类型

关于enctype=“multipart/form-data”

enctype就是encodetype就是编码类型的意思。
multipart/form-data是指表单数据有多部分构成，既有文本数据，又有文件等二进制数据的意思。
需要注意的是：默认情况下，enctype的值是application/x-www-form-urlencoded，不能用于文件上传，只有使用了multipart/form-data，才能完整的传递文件数据。
application/x-www-form-urlencoded不是不能上传文件，是只能上传文本格式的文件，multipart/form-data是将文件以二进制的形式上传，这样可以实现多种类型的文件上传。

关于new FormData方法，可见以下链接：
js FormData方法介绍

关于cache、processdata、contentType设置为false，可见以下链接：
cache、processdata、contentType设置为false

jar包

除此之外还需要有springmvc的jar包，这里没列出

<dependency>
    <groupId>commons-io</groupId>
    <artifactId>commons-io</artifactId>
    <version>2.4</version>
</dependency>
<!-- https://mvnrepository.com/artifact/commons-fileupload/commons-fileupload -->
<dependency>
    <groupId>commons-fileupload</groupId>
    <artifactId>commons-fileupload</artifactId>
    <version>1.3.3</version>
</dependency>

springmvc.xml配置

除此之外还需要有springmvc的配置，这里没列出

<!-- 配置文件上传解析器 id:必须是multipartResolver
    //设置解析文件的大小,当上传文件大于8M时，会出错，防止恶意攻击占内存
-->
<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
    <property name="maxUploadSize" value="#{1024*1024*8}"/>
    <property name="defaultEncoding" value="utf-8"/>
</bean>

前端

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>springmvc upload</title>
    <link href="/css/bootstrap.min.css">
    <script src="/js/jquery-3.3.1.min.js"></script>
    <script src="/js/bootstrap.min.js"></script>
</head>
<body>   <!--表单的按钮提交文件上传 这儿需要enctype
<form id="uploadForm" enctype="multipart/form-data">
    <input id="file" type="file" name="file"/><br>
    <button id="upload" type="button">upload</button>
</form>
</body>
<script>
    $(function () {
        $("#upload").click(function () {
            $.ajax({
                url: '/FileUploadController/fileUpload',
                type: 'POST',
                cache: false,
                data: new FormData($('#uploadForm')[0]),
                processData: false,//必须
                contentType: false,//必须
                success: function (res) {
                    console.log(res);
                }
            })

        })
    })
</script>
</html>

后端

package cn.cdqf.web;

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 java.io.File;
import java.io.IOException;

@RestController
public class FileUploadController {

    @RequestMapping("/FileUploadController/fileUpload")
    public void fileUpload(@RequestParam("file") MultipartFile file) throws IOException {
    	//获取文件名
        String originalFilename = file.getOriginalFilename();
       
        File file1 = new File("D:\\qianfeng\\JavaEE2007\\three\\day_01_springmvc\\" + originalFilename);
        file.transferTo(file1);//保存文件
    }
}

教练我想学编程

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
学习记录360@springmvc 文件上传

特别注意：前端中必须enctype=“multipart/form-data”，processData: false,//必须，contentType: false,//必须，new FormData方法的使用后端中：MultipartFile参数类型关于enctype=“multipart/form-data”enctype就是encodetype就是编码类型的意思。multipart/form-data是指表单数据有多部分构成，既有文本数据，又有文件等二进制数据的意思。需要注意的是：默..
复制链接

扫一扫