如何使用spring mvc控制器通过ajax提交传递文件对象答案

【问题标题】：How to pass file object through ajax sumbit with spring mvc controller如何使用spring mvc控制器通过ajax提交传递文件对象
【发布时间】：2013-12-29 23:01:30
【问题描述】：

我正在尝试通过 jquery ajax 提交传递文件对象。
JSP 代码

<div id="import-file">
        <input type="file" id="file"/>
        <table>
        <tr><td><input type="radio" name="type" value="csv"></td><td>CSV File</td></tr>
        <tr><td><input type="radio" name="type" value="excel"></td><td>Excel spread sheet</td></tr>
        <tr><td><input type="radio" name="type" value="tab"></td><td>Tab delimited</td></tr>
        </table>
</div>

Java 脚本代码

        var type = $($('input:radio:checked')[0]).val();
        var file = $("#file")[0].files[0];
        alert($("#file")[0].files[0].name);
        $.ajax({
            data :{
                "file" : file,
                "type" : type
            },
            type: "POST",
            url: "fileupload.htm",
            success: function(data){
                alert(data);
            },
            error:function(err){
                alert(err);
            }
        });

最后是我的弹簧控制器代码：

@RequestMapping(value="fileupload.htm",method=RequestMethod.POST )
    public @ResponseBody String uploadFile(@RequestParam String type, @RequestParam("file") MultipartFile file){
        logger.info("file type : "+type + "file is "+file.toString());
        return "SUCCESS";
    }

我的萤火虫控制台中出现 NS_NOINTERFACE: Component does not have requested interface [nsIDOMBlob.slice] 错误。

【问题讨论】：

你必须通过formData
数据是formData只对
现在你正在传递文件对象，这不起作用，你需要传递文件本身，并且必须以formData 形式传递
您能否更正上述代码并将其作为答案发布，这将对我有所帮助
stackoverflow.com/questions/6974684/…

标签： javascript jquery spring

【解决方案1】：

我已经这样解决了：

JavaScript 代码

var formData = new FormData($('form')[0]);    
    console.log("form data "+formData);
    $.ajax({
        url: 'fileupload.htm',
        data: formData,
        processData: false,
        contentType: false,
        type: 'POST',
        success: function(data){
            alert(data);
        },
        error: function(err){
            alert(err);
        }
    });

JSP 代码

<form action="fileupload.htm" method="post" enctype="multipart/form-data" name="fileinfo">
<input type="file" name="fileName" id="file"/>
</form>

弹簧控制器：

@RequestMapping(value="fileupload.htm",method=RequestMethod.POST )
    public @ResponseBody String uploadFile(@RequestParam("fileName") MultipartFile file){
        try{
            logger.info("file is "+file.toString());

        }catch(Exception e){
            return "error occured "+e.getMessage();
        }
    }

希望对身体有所帮助。

【讨论】：