javascript - 前段文件分片后后端怎么接收

问题描述

问 题

我们现在想做一个大文件分片上传的组件但是文件被分割后后端怎么接受不到啊

前端代码

 $(function () {
        $("#upload").click(function () {
            var ufile = $("#file")[0].files[0];  //文件对象
            var name = ufile.name;       //文件名
            var size = ufile.size;        //总大小
            var succeed = 0;
            var shardSize = 200 * 1024 * 1024;    //以2MB为一个分片
            var shardCount = Math.ceil(size / shardSize);  //总片数
            for (var i = 0; i < 1; ++i) {
                //计算每一片的起始与结束位置
                var start = i * shardSize,
                    end = Math.min(size, start + shardSize);
                var form = new FormData();
                var reader = new FileReader();
                if(size<shardSize){
                    reader.readAsBinaryString(ufile.slice(start, end));
                }else{
                    reader.readAsBinaryString(ufile.slice(start, end));
                }

                reader.onload = (function (file) {
                    console.log(this.result)
                    form.append("file", this.result);
                    var settings = {
                        "async": true,
                        "crossDomain": true,
                        "url": "/file/upload",
                        "method": "POST",
                        "processData": false,
                        "contentType": false,
                        "mimeType": "multipart/form-data",
                        "data": form
                    }

                    $.ajax(settings).done(function (response) {
                       // console.log(response);
                        ++succeed;
                        $("#output").text(succeed + " / " + shardCount);
                    });
                });
            }
        })
    });

后端代码

@RestController
@RequestMapping("/file")
public class FileController {
    @RequestMapping(value = "/upload", method = RequestMethod.POST)
    public void upload(/*@RequestBody*/ @RequestParam(value = "file") MultipartFile file,/*byte[] bytes,*/ HttpServletRequest req, HttpServletResponse res) throws IOException {
        if (!ServletFileUpload.isMultipartContent(req)) {
            System.out.println("hello"+file.getName());
        }
    }
}

解决方案

经过一番折腾终于ok了，很开心

这篇关于javascript - 前段文件分片后后端怎么接收的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！