mvc框架上传文件配置遇到的坑坑坑

本文详细介绍了在Spring MVC框架下配置multipartResolver进行文件上传时可能遇到的问题,强调了pom.xml中依赖的正确添加与验证、IDEA项目编译后文件路径的检查。同时,讲解了前端如何将base64转为File对象并利用FormData传递到后台,以及后台接收文件的处理方式,特别提示了contentType和processData的设置细节。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

 

首先需要在spring-mvc.xml配置 multipartResolver,这个不要随意改动

 
    <bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
        <property name="maxUploadSize" value="104857600"/>
        <property name="maxInMemorySize" value="40960"/>
        <property name="defaultEncoding" value="UTF-8"/>
    </bean>

然后在pom.xml里加

	  <dependency>
		  <groupId>commons-fileupload</groupId>
		  <artifactId>commons-fileupload</artifactId>
		  <version>1.2.1</version>
	  </dependency>
	  <dependency>
		  <groupId>commons-io</groupId>
		  <artifactId>commons-io</artifactId>
		  <version>2.0.1</version>
	  </dependency>

千万注意,不要以为代码写了,包就能下来,要查看本地是否真的存在,并且要看编译后的对应位置是否有,此处很坑!

我用idea,需要这么操作,把本地项目包放到编译后的位置,

配置就到这里,接下来是代码:

前台点击提交,触发btnTest事件,我获取的图片信息是base64,需要转正文件对象,工具在此

function dataURLtoFile(dataurl, filename) {
    var arr = dataurl.split(','),
        mime = arr[0].match(/:(.*?);/)[1],
        bstr = atob(arr[1]),
        n = bstr.length,
        u8arr = new Uint8Array(n);
    while (n--) {
        u8arr[n] = bstr.charCodeAt(n);
    }
    return new File([u8arr], filename, { type: mime });
};

 然后把file对象同其他数据一同放到ForData里传到后台,需要注意

  1. contentType:false,//告诉jQuery不要去设置请求头

  2. processData:false,//告诉spring不要去处理发送的数据

$("#btnTest").click(function() {
    var data1 = new FormData();
    $(".lookimg img").each(function (i, file) {
        data1.append('file', dataURLtoFile(file.src,"13123.png"));
    });

    var pattern = /0?(13|14|15|18|17)[0-9]{9}/,
            phone = $('#phone').val();
        var chinse = /[\u4e00-\u9fa5]/,
            name = $('#name').val();
        declaration = $('#declaration').val();
        if (pattern.test(phone) == true && chinse.test(name) == true && chinse.test(declaration) == true && pic1 != null || pic1 != "") {
            ;
            $("#btnTest").removeAttr("onclick");
            var name = $("#name").val();
            var declaration = $("#declaration").val();
            var phone = $("#phone").val();



            //调用

            data1.append("name",name);
            data1.append("declaration",declaration);
            data1.append("phone",phone);

            $.ajax({
                url:'../vote/player',
                data:data1,
                type:"post",
                contentType:false,
                processData: false,
                success:function(result){
                    alert("报名成功");
                    console.log();
                    window.location.href = 	"../vote/activity";
                },
                error:function(result){
                    alert("报名失败");
                }
            })
        }else{
            alert("格式填写不正确");
        }
})

 

后台接收:其他数据正常接收,文件需要处理一下

 

处理file,多文件用getFiles,单个用getFile

ok!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值