JavaWeb前后端上传文件的几种方式

Java (52) 2023-10-16 11:12

Hi,大家好,我是编程小6,很荣幸遇见你,我把这些年在开发过程中遇到的问题或想法写出来,今天说一说JavaWeb前后端上传文件的几种方式,希望能够帮助你!!!。

总结一下,JavaWeb前后端常见的几种上传文件的方式:

一、JavaWeb前端上传文件的几种方式:

1、表单上传

最传统的图片上传方式是form表单上传,使用form表单的input[type="file"]控件,打开系统的文件选择对话框,从而达到选择文件并上传的目的。

代码示例如下:

<form action="uploadFile" method="post" 
    enctype="multipart/form-data">
    <label for="file">文件名</label>
    <input id="file" name="file" type="file"/>
    <input type="submit" name="submit" value="提交"/>
</form>

表单上传需要注意以下几点:

(1)提供form表单,method必须是post类型。

(2)form表单的enctype必须是multipart/form-data。

enctype属性规定在发送到服务器之前应该如何对表单数据进行编码。默认地,表单数据会编码为“application/x-www-form-urlencoded”。就是说,在发送到服务器之前,所有字符都会进行编码。HTML表单如何打包数据文件是由enctype这个属性决定的。enctype有以下几种取值:

  • application/x-www-form-urlencoded:在发送之前编码所有字符(默认)(空格被编码为‘+’,特殊字符被编码为ASCII十六进制字符)。
  • multipart/form-data:不对字符编码。在使用包含文件上传控件的表单时,必须使用该值。
  • text/plain:空格转换为“+”加号,但不对特殊字符编码。

默认enctype=application/x-www-form-urlencoded,所以表单的内容会按URL规则编码,然后根据表单的提交方法:

method='get' 编码后的表单内容附加在请求连接后,

method='post' 编码后的表单内容作为post请求的正文内容。

(3)提供input type="file"上传输入域。

2、Ajax上传

ajax和FormData可实现页面无刷新的文件上传效果,主要用到了jQuery的ajax()方法和XMLHttpRequest Level 2的FormData接口。通过FormData对象可以更灵活方便地发送表单数据,因为可以独立于表单使用。如果你把表单的编码类型设置为multipart/form-data,则通过FormData传输的数据格式和表单通过submit()方法传输的数据格式相同。

<form>
    <input type="file" name="file" id="file"/>
</form>
<script>
    $("#file").on("change", function() {
        var formData = new FormData();
        formData.append("file", $("#file")[0].files[0]);
        $.ajax({
            url: "uploadFile",
            type: "POST",
            data: formData,
            processData: false,
            contentType: false,
            success: function(response) {
                alert("hahaha");
            }
        });
    })
</script>

ajax无刷新上传的方式,本质上与表单上传无异,只是把表单里的内容提出来采用ajax提交,并且由前端决定请求结果回传后的展示结果。

3、各类插件上传

当上传的需求要求可预览、显示上传进度、中断上传过程、大文件分片上传等等,这时传统的表单上传很难实现这些功能,我们可以借助现有插件完成。

如:百度上传插件Web Upload、jQuery图片预览插件imgPreview、拖拽上传与图像预览插件Dropzone.js等等。

二、JavaWeb后端上传文件的几种方式:

1、使用springMVC原生上传文件方法

(1)首先需要一些简单的配置

<bean id="multipartResolver" class="com.zxm.fileupload.
    UploadCommonsMultipartResolver">
    <!-- 默认编码 -->
    <property name="defaultEncoding" value="utf-8"/>
    <!-- 文件大小最大值 -->
    <property name="maxUploadSize" value="10485760000"/>
    <!-- 内存中的最大值 -->
    <property name="maxInMemorySize" value="40960"/>
</bean>

(2)controller中的代码:

@RequestMapping("upload")
public String upload(HttpServletRequest request) throws 
    IllegalStateException, IOException {
    long  startTime = System.currentTimeMillis();
    
    //将当前上下文初始化给CommonsMutipartResolver(多部分解析器)
    CommonsMultipartResolver multipartResolver = new 
        CommonsMultipartResolver(
        request.getSession().getServletContext());
        
    //检查form中是否有enctype="multipart/form-data"
    
    if(multipartResolver.isMultipart(request)) {
        //将request变成多部分request
        MultipartHttpServletRequest multiRequest=
        (MultipartHttpServletRequest)request;
        //获取multiRequest 中所有的文件名
        Iterator iter=multiRequest.getFileNames();
        
        while(iter.hasNext()) {
            //一次遍历所有文件
            MultipartFile file=multiRequest.
            getFile(iter.next().toString());
            if(file!=null) {
                String path = "E:/upload/"+
                file.getOriginalFilename();
                //上传
                file.transferTo(new File(path));
            }
        }
    }
    
    long endTime = System.currentTimeMillis();
    
    System.out.println("Spring方法的运行时间:"
    +String.valueOf(endTime-startTime)+"ms");
    return "success"; 
} 

2、采用file.Transto来保存上传的文件,这是目前自认为最好的上传方式,代码简单,速度快

@RequestMapping("upload")
public String upload(@RequestParam("file")
CommonsMultipartFile file) throws IOException {

 long startTime = System.currentTimeMillis();
 System.out.println("fileName:"+file.getOriginalFilename());
 String path = "E:/upload/" + new Date().getTime()+
     file.getOriginalFilename();
     
 File newFile = new File(path);
 //通过CommonsMultipartFile的方法直接写文件
 file.transferTo(newFile);
 
 long endTime = System.currentTimeMillis();
 System.out.println("采用file.Transto的运行时间:"
     +String.valueof(endTime-startTime)+"ms");
 return "success";
}

3、采用流的方式上传

此方式又慢又难写

@RequestMapping("upload")
public String upload(@RequestParam("file")
CommonsMultipartFile file) throws IOException {
    
    //用来检测程序运行时间
 long startTime = System.currentTimeMillis();
 System.out.println("fileName:"+file.getOriginalFilename);
 
 try {
     //获取输出流
     OutputStream oStream = new FileOutputStream(
         "E:/upload/"+new Date().getTime() +
         file.getOriginalFilename());
     //获取输入流CommonsMultipartFile中可以直接得到文件的流
     InputStream iStream = file.getInputStream();
     byte[] bts = new byte[1024];
     //一个字节一个字节地读取并写入
     while(iStream.read(bts)!=-1) {
         oStream.write(bts);
     }
     oStream.flush();
     oStream.close();
     iStream.close();
 } catch(FileNotFoundException e) {
     e.printStackTrace();
 }
 
 long endTime = System.currentTimeMillis();
 System.out.println("采用流上传的方式的运行时间:"+
     String.valueOf(endTime-startTime)+"ms");
     
 return "success";
}

JavaWeb后台上传的这三种方式中,第二种最优,第一种次之,第三种最不推荐。

今天的分享到此就结束了,感谢您的阅读,如果确实帮到您,您可以动动手指转发给其他人。

发表回复