js如何实现大文件上传

1、需要两个接口，接口a：一个接口用来确定上传内容分多少块，每块大小，上传文件内容，初始化百分比，初始化start，初始化complete：0。接口b：文件上传到后台的接口

2、创建formdata，对formdata进行分块,上传函数是$scope.customUploadFileChunkHandler

const start = config.count * config.chunkSize; // config.count:第几块，config.chunkSize:每块大小

const end = Math.min(file.size, start + config.chunkSize); // 确定上传对下一块的内容

const fileData = new FormData();

fileData.append('file', file.slice(start, end));//file是上传的文件，slice截取需要上传的块的内容

fileData.append('chunk_total', config.chunkCount);// config.chunkCount：上传文件的总块数

fileData.append('chunk_index', config.count + 1); // 上传的位置

fileData.append('upload_basename', flie.name);//上传文件的名字

3、最后通过ajax上传内容

       $.ajax({
           url: ,
           type: 'POST',
           data: fileData,
           dataType: 'json',
           success: (res) => {
               const result = res.data || {};
               if (res.rawStatusCode != 200) {
                   setTimeout(() => {
                       $scope.customUploadFileChunkHandler();
                   }, 3000);
                   return;
               }
               if (result.error != 0) {
                   return;
               }
               config.count ++;
               config.percent = result.percent;
               if (result.complete) {
                   $scope.changeOKButtonStatusToEnabled();
                   config.info = '上传完毕！';
                   config.count = 0;
                   config.complete = 1;
                   config.id = result.id;
               } else if (config.count > config.chunkCount) {
                   config.info = '上传失败，请重新上传……';
               } else {
                   setTimeout(() => {
                       $scope.customUploadFileChunkHandler();
                   }, 0);
               }
               !$scope.$$phase && $scope.$apply();
           },
           error: (XMLHttpRequest, textStatus, errorThrown) => {
               if (XMLHttpRequest.status == 0) {
                   config.info = '网络故障，正在重试……';
                   setTimeout(() => {
                       $scope.customUploadFileChunkHandler();
                   }, 3000);
               } else {
                   config.info = '发生故障，上传失败。';
                   setTimeout(() => {
                       $scope.customUploadFileChunkHandler();
                   }, 5000);
               }
           }
       });

   };