zoukankan      html  css  js  c++  java
  • spring无法接收上传文件

    现象

    前端用ajax方式提交表单,代码类似于下面的例子。

    var formData = new FormData();
    
    // HTML 文件类型input,由用户选择
    formData.append("file", fileInputElement.files[0]);
    $.ajax({
        url: 'url,
        type: 'POST',
        data: formdata,                    // 上传formdata封装的数据
        cache: false,                      // 不缓存
        processData: false,                // jQuery不要去处理发送的数据
        contentType: 'multipart/form-data',   // jQuery不要去设置Content-Type请求头,如果上传文件的话,千万不能加contentType,这里是坑!!!!!!contentType:false,就行了
        success:function (data) {           //成功回调
            console.log(data);
        }
    });

    后端用spring接收,具体方法见:https://www.cnblogs.com/liuboyuan/p/11607484.html

    前端提交请求后,后端spring报错:

    FileUploadException: the request was rejected because no multipart boundary was found

    排坑过程

    一、前端提交时尝试各种contentType

    后端始终接收不到文件流。

    二、直接用html中最原始的form提交

    <form id="myForm" name="myForm" method="post"  enctype="multipart/form-data" action="url">
        <div>
            <input type="file" id="whiteList" name="whiteList">
        </div>
        <input type="submit" value="Submit!">
    </form>

    后端收到了文件,因此定位是前端的问题。

    比较ajax提交和原生form提交的请求头后发现:虽然原生form指定了enctype="multipart/form-data",但发送出去的contentType变成了Content-Type: multipart/form-data; boundary=----WebKitFormBoundary0E8eVHYtBOBtRyIO,浏览器帮我加了个boundary。然后重新去网上看了下multipart/form-data,明白了multipart/form-data要用boundary分割参数,因此boundary必不可少。

    原生form提交的时候虽然指定enctype,但浏览器会自动加上boundary。ajax请求如果指定了Content-Type,浏览器不会自动加上boundary,还是 multipart/form-data,因此缺少了boundary,导致后端报错。

    解决

    在现象里的代码的注释里已经写出来了,ajax提交文件的时候别指定contentType就行了,浏览器会为contentType自动加上带boundary的 multipart/form-data。

  • 相关阅读:
    WordPress Uploader插件‘blog’参数跨站脚本漏洞
    WordPress Counter Per Day插件拒绝服务漏洞
    OpenSSH 远程拒绝服务漏洞
    WordPress Count Per Day插件 ‘daytoshow’参数跨站脚本漏洞
    昨日关注-每日编译(DailyBuild) 参考
    产品这么卖很好玩
    知己知彼
    让一切有调理
    昨日关注SqlServer中区分大小写
    软件公司到底有几种
  • 原文地址:https://www.cnblogs.com/liuboyuan/p/12092602.html
Copyright © 2011-2022 走看看