将文件夹上传到服务器(mvc spring)

Upload a folder to server(mvc spring)

本文关键字:mvc spring 服务器 文件夹      更新时间:2023-09-26

我尝试将文件夹的内容上传到服务器。但是我做不到,所以我做了一个例子,你必须选择每一个文件。

控制器:

@Controller
public class FileUploadController {

    @RequestMapping(value = "/save", method = RequestMethod.POST)
    public String save(@ModelAttribute("uploadForm") FileUploadForm uploadForm,Model map) {}
}

JSP 文件

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
    <title> - Upload</title>
<script
src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script>
$(document).ready(function() {
    //add more file components if Add is clicked
    $('#addFile').click(function() {
        var fileIndex = $('#fileTable tr').children().length;
        $('#fileTable').append(
                '<tr><td>'+
                '   <input type="file" name="files['+ fileIndex +']" />'+
                '</td></tr>');
    });
});
</script>
</head>
<body>
<div align="center" class="jumbotron">
<h1>dd</h1>
<form:form method="post" action="save.html"
        modelAttribute="uploadForm" enctype="multipart/form-data">
    <p>Dateien auswählen zum uploaden</p>
    <input class="btn btn-success" id="addFile" type="button" value="Datei hinzufügen" />
    <table align="center" class="table table-striped" id="fileTable">
        <tr>
            <td><input name="files[0]" type="file" /></td>
        </tr>
        <tr>
            <td><input name="files[1]" type="file" /></td>
        </tr>
    </table>
    <br/><input class="btn btn-primary" type="submit" value="Upload" />
</form:form>
</div>
</body>
</html>

这很好用。我找到了一些示例,我可以一次选择多个文件(只是添加多个文件(,但无法上传它们。我遇到了一些麻烦来让它工作。我很惊讶做一件如此"简单"的事情如此"困难"。我不知道我是否必须更改我的控制器文件或仅更改我的 jsp 文件。我希望有人能解释我这是如何工作的。我是新来的,所以请像对待一个小傻孩子一样和我说话。迎接山 姆

表单上的单个文件输入:

如果您只需要选择多个文件并上传它们,那么您几乎做到了。您只需将表单模型中的字段声明为List

public class FileUploadForm {
    private List<MultipartFile> files;
    public List<MultipartFile> getFiles() {
        return files;
    }
    public void setFiles(List<MultipartFile> files) {
        this.files = files;
    }
}

现在,在控制器中,您可以访问此列表:

@Controller
public class FileUploadController {

    @RequestMapping(value = "/save", method = RequestMethod.POST)
    public String save(@ModelAttribute("uploadForm") FileUploadForm uploadForm, Model map) {
        for(MultipartFile file : uploadForm.getFiles()){
            try {
                file.transferTo(new File(targetPath+file.getOriginalFilename()));
            } catch (IOException e) {
                throw new RuntimeException();
            }
        }
    }
}

当然,您必须在表单中指定文件输入multiple属性:

  <form:form method="post" action="/save" modelAttribute="uploadForm" enctype="multipart/form-data">
      <input name="files" type="file" multiple=""/>
      <button type="submit">Upload</button>
  </form:form>

请注意,这样您不应该在输入名称中使用数组语法,如 file[]


表单上的多个文件输入。

让我们考虑一下,当您为每个文件添加新的文件输入时,是否要加载文件,如代码片段所示。首先,从表单模型中删除字段List<MultipartFile> files。我们将通过另一种方式获得它。现在控制器方法将如下所示:

@RequestMapping(value = "/upload", method = RequestMethod.POST)
public String upload(@ModelAttribute("uploadForm")FileUploadModel uploadForm,
                     @RequestParam("files[]") List<MultipartFile> fileList, ModelMap model) throws IOException {
        for(MultipartFile file : fileList){
           try {
               file.transferTo(new File(targetPath+file.getOriginalFilename()));
           } catch (IOException e) {
               throw new RuntimeException(e);
           }
      }
}

如您所见,现在我们分别声明了表单模型和文件列表。另请注意,该列表具有表单字段名称@RequestParam。并且这个名称用数组语法指定 - files[] .

现在,表单应该是什么样子的:

  <form:form method="post" action="/save" modelAttribute="uploadForm" enctype="multipart/form-data">
      <input name="files[]" type="file" multiple=""/>
      <input name="files[]" type="file" multiple=""/>
      <input name="files[]" type="file" multiple=""/>
      <button type="submit">Upload</button>
  </form:form>

在这个例子中,我静态地添加了多个文件输入,但实际上你可以用javascript动态地做到这一点。请注意,不应在输入名称中指定数组项的索引。只是files[],但不是files[0]file[1].

顺便说一下,在单个文件输入的情况下,您也可以接收文件列表作为方法参数。只需从模型中删除文件列表并将其声明为控制器方法的参数即可。