成都网站建设设计

将想法与焦点和您一起共享

大文件切片上传到服务器

  1. SparkMD5工具
查看代码

/* SparkMD5 - https://github.com/satazor/js-spark-md5 */
/* SparkMD5 - https://codechina.csdn.net/mirrors/satazor/js-spark-md5/-/blob/master/spark-md5.js */
//spark-md5 begin
(function (factory) {
 if (typeof exports === "object") {
  module.exports = factory();
 } else if (typeof define === "function" && define.amd) {
  define(factory);
 } else {
  var glob;
  try {
   glob = window;
  } catch (e) {
   glob = self;
  }
  glob.SparkMD5 = factory();
 }
})(function (undefined) {
 "use strict";
 var add32 = function (a, b) {
   return (a + b) & ;
  },
  hex_chr = [
   "0",
   "1",
   "2",
   "3",
   "4",
   "5",
   "6",
   "7",
   "8",
   "9",
   "a",
   "b",
   "c",
   "d",
   "e",
   "f",
  ];




 function cmn(q, a, b, x, s, t) {
  a = add32(add32(a, q), add32(x, t));
  return add32((a << s) | (a >>> (32 - s)), b);
 }




 function md5cycle(x, k) {
  var a = x[0],
   b = x[1],
   c = x[2],
   d = x[3];
  a += (((b & c) | (~b & d)) + k[0] - ) | 0;
  a = (((a << 7) | (a >>> 25)) + b) | 0;
  d += (((a & b) | (~a & c)) + k[1] - ) | 0;
  d = (((d << 12) | (d >>> 20)) + a) | 0;
  c += (((d & a) | (~d & b)) + k[2] + ) | 0;
  c = (((c << 17) | (c >>> 15)) + d) | 0;
  b += (((c & d) | (~c & a)) + k[3] - ) | 0;
  b = (((b << 22) | (b >>> 10)) + c) | 0;
  a += (((b & c) | (~b & d)) + k[4] - ) | 0;
  a = (((a << 7) | (a >>> 25)) + b) | 0;
  d += (((a & b) | (~a & c)) + k[5] + ) | 0;
  d = (((d << 12) | (d >>> 20)) + a) | 0;
  c += (((d & a) | (~d & b)) + k[6] - ) | 0;
  c = (((c << 17) | (c >>> 15)) + d) | 0;
  b += (((c & d) | (~c & a)) + k[7] - ) | 0;
  b = (((b << 22) | (b >>> 10)) + c) | 0;
  a += (((b & c) | (~b & d)) + k[8] + ) | 0;
  a = (((a << 7) | (a >>> 25)) + b) | 0;
  d += (((a & b) | (~a & c)) + k[9] - ) | 0;
  d = (((d << 12) | (d >>> 20)) + a) | 0;
  c += (((d & a) | (~d & b)) + k[10] - ) | 0;
  c = (((c << 17) | (c >>> 15)) + d) | 0;
  b += (((c & d) | (~c & a)) + k[11] - ) | 0;
  b = (((b << 22) | (b >>> 10)) + c) | 0;
  a += (((b & c) | (~b & d)) + k[12] + ) | 0;
  a = (((a << 7) | (a >>> 25)) + b) | 0;
  d += (((a & b) | (~a & c)) + k[13] - ) | 0;
  d = (((d << 12) | (d >>> 20)) + a) | 0;
  c += (((d & a) | (~d & b)) + k[14] - ) | 0;
  c = (((c << 17) | (c >>> 15)) + d) | 0;
  b += (((c & d) | (~c & a)) + k[15] + ) | 0;
  b = (((b << 22) | (b >>> 10)) + c) | 0;
  a += (((b & d) | (c & ~d)) + k[1] - ) | 0;
  a = (((a << 5) | (a >>> 27)) + b) | 0;
  d += (((a & c) | (b & ~c)) + k[6] - ) | 0;
  d = (((d << 9) | (d >>> 23)) + a) | 0;
  c += (((d & b) | (a & ~b)) + k[11] + ) | 0;
  c = (((c << 14) | (c >>> 18)) + d) | 0;
  b += (((c & a) | (d & ~a)) + k[0] - ) | 0;
  b = (((b << 20) | (b >>> 12)) + c) | 0;
  a += (((b & d) | (c & ~d)) + k[5] - ) | 0;
  a = (((a << 5) | (a >>> 27)) + b) | 0;
  d += (((a & c) | (b & ~c)) + k[10] + ) | 0;
  d = (((d << 9) | (d >>> 23)) + a) | 0;
  c += (((d & b) | (a & ~b)) + k[15] - ) | 0;
  c = (((c << 14) | (c >>> 18)) + d) | 0;
  b += (((c & a) | (d & ~a)) + k[4] - ) | 0;
  b = (((b << 20) | (b >>> 12)) + c) | 0;
  a += (((b & d) | (c & ~d)) + k[9] + ) | 0;
  a = (((a << 5) | (a >>> 27)) + b) | 0;
  d += (((a & c) | (b & ~c)) + k[14] - ) | 0;
  d = (((d << 9) | (d >>> 23)) + a) | 0;
  c += (((d & b) | (a & ~b)) + k[3] - ) | 0;
  c = (((c << 14) | (c >>> 18)) + d) | 0;
  b += (((c & a) | (d & ~a)) + k[8] + ) | 0;
  b = (((b << 20) | (b >>> 12)) + c) | 0;
  a += (((b & d) | (c & ~d)) + k[13] - ) | 0;
  a = (((a << 5) | (a >>> 27)) + b) | 0;
  d += (((a & c) | (b & ~c)) + k[2] - ) | 0;
  d = (((d << 9) | (d >>> 23)) + a) | 0;
  c += (((d & b) | (a & ~b)) + k[7] + ) | 0;
  c = (((c << 14) | (c >>> 18)) + d) | 0;
  b += (((c & a) | (d & ~a)) + k[12] - ) | 0;
  b = (((b << 20) | (b >>> 12)) + c) | 0;
  a += ((b ^ c ^ d) + k[5] - ) | 0;
  a = (((a << 4) | (a >>> 28)) + b) | 0;
  d += ((a ^ b ^ c) + k[8] - ) | 0;
  d = (((d << 11) | (d >>> 21)) + a) | 0;
  c += ((d ^ a ^ b) + k[11] + ) | 0;
  c = (((c << 16) | (c >>> 16)) + d) | 0;
  b += ((c ^ d ^ a) + k[14] - ) | 0;
  b = (((b << 23) | (b >>> 9)) + c) | 0;
  a += ((b ^ c ^ d) + k[1] - ) | 0;
  a = (((a << 4) | (a >>> 28)) + b) | 0;
  d += ((a ^ b ^ c) + k[4] + ) | 0;
  d = (((d << 11) | (d >>> 21)) + a) | 0;
  c += ((d ^ a ^ b) + k[7] - ) | 0;
  c = (((c << 16) | (c >>> 16)) + d) | 0;
  b += ((c ^ d ^ a) + k[10] - ) | 0;
  b = (((b << 23) | (b >>> 9)) + c) | 0;
  a += ((b ^ c ^ d) + k[13] + ) | 0;
  a = (((a << 4) | (a >>> 28)) + b) | 0;
  d += ((a ^ b ^ c) + k[0] - ) | 0;
  d = (((d << 11) | (d >>> 21)) + a) | 0;
  c += ((d ^ a ^ b) + k[3] - ) | 0;
  c = (((c << 16) | (c >>> 16)) + d) | 0;
  b += ((c ^ d ^ a) + k[6] + ) | 0;
  b = (((b << 23) | (b >>> 9)) + c) | 0;
  a += ((b ^ c ^ d) + k[9] - ) | 0;
  a = (((a << 4) | (a >>> 28)) + b) | 0;
  d += ((a ^ b ^ c) + k[12] - ) | 0;
  d = (((d << 11) | (d >>> 21)) + a) | 0;
  c += ((d ^ a ^ b) + k[15] + ) | 0;
  c = (((c << 16) | (c >>> 16)) + d) | 0;
  b += ((c ^ d ^ a) + k[2] - ) | 0;
  b = (((b << 23) | (b >>> 9)) + c) | 0;
  a += ((c ^ (b | ~d)) + k[0] - ) | 0;
  a = (((a << 6) | (a >>> 26)) + b) | 0;
  d += ((b ^ (a | ~c)) + k[7] + ) | 0;
  d = (((d << 10) | (d >>> 22)) + a) | 0;
  c += ((a ^ (d | ~b)) + k[14] - ) | 0;
  c = (((c << 15) | (c >>> 17)) + d) | 0;
  b += ((d ^ (c | ~a)) + k[5] - ) | 0;
  b = (((b << 21) | (b >>> 11)) + c) | 0;
  a += ((c ^ (b | ~d)) + k[12] + ) | 0;
  a = (((a << 6) | (a >>> 26)) + b) | 0;
  d += ((b ^ (a | ~c)) + k[3] - ) | 0;
  d = (((d << 10) | (d >>> 22)) + a) | 0;
  c += ((a ^ (d | ~b)) + k[10] - ) | 0;
  c = (((c << 15) | (c >>> 17)) + d) | 0;
  b += ((d ^ (c | ~a)) + k[1] - ) | 0;
  b = (((b << 21) | (b >>> 11)) + c) | 0;
  a += ((c ^ (b | ~d)) + k[8] + ) | 0;
  a = (((a << 6) | (a >>> 26)) + b) | 0;
  d += ((b ^ (a | ~c)) + k[15] - ) | 0;
  d = (((d << 10) | (d >>> 22)) + a) | 0;
  c += ((a ^ (d | ~b)) + k[6] - ) | 0;
  c = (((c << 15) | (c >>> 17)) + d) | 0;
  b += ((d ^ (c | ~a)) + k[13] + ) | 0;
  b = (((b << 21) | (b >>> 11)) + c) | 0;
  a += ((c ^ (b | ~d)) + k[4] - ) | 0;
  a = (((a << 6) | (a >>> 26)) + b) | 0;
  d += ((b ^ (a | ~c)) + k[11] - ) | 0;
  d = (((d << 10) | (d >>> 22)) + a) | 0;
  c += ((a ^ (d | ~b)) + k[2] + ) | 0;
  c = (((c << 15) | (c >>> 17)) + d) | 0;
  b += ((d ^ (c | ~a)) + k[9] - ) | 0;
  b = (((b << 21) | (b >>> 11)) + c) | 0;
  x[0] = (a + x[0]) | 0;
  x[1] = (b + x[1]) | 0;
  x[2] = (c + x[2]) | 0;
  x[3] = (d + x[3]) | 0;
 }




 function md5blk(s) {
  var md5blks = [],
   i;
  for (i = 0; i < 64; i += 4) {
   md5blks[i >> 2] =
    s.charCodeAt(i) +
    (s.charCodeAt(i + 1) << 8) +
    (s.charCodeAt(i + 2) << 16) +
    (s.charCodeAt(i + 3) << 24);
  }
  return md5blks;
 }




 function md5blk_array(a) {
  var md5blks = [],
   i;
  for (i = 0; i < 64; i += 4) {
   md5blks[i >> 2] =
    a[i] + (a[i + 1] << 8) + (a[i + 2] << 16) + (a[i + 3] << 24);
  }
  return md5blks;
 }




 function md51(s) {
  var n = s.length,
   state = [, -, -, ],
   i,
   length,
   tail,
   tmp,
   lo,
   hi;
  for (i = 64; i <= n; i += 64) {
   md5cycle(state, md5blk(s.substring(i - 64, i)));
  }
  s = s.substring(i - 64);
  length = s.length;
  tail = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
  for (i = 0; i < length; i += 1) {
   tail[i >> 2] |= s.charCodeAt(i) << (i % 4 << 3);
  }
  tail[i >> 2] |= 128 << (i % 4 << 3);
  if (i > 55) {
   md5cycle(state, tail);
   for (i = 0; i < 16; i += 1) {
    tail[i] = 0;
   }
  }
  tmp = n * 8;
  tmp = tmp.toString(16).match(/(.*?)(.{0,8})$/);
  lo = parseInt(tmp[2], 16);
  hi = parseInt(tmp[1], 16) || 0;
  tail[14] = lo;
  tail[15] = hi;
  md5cycle(state, tail);
  return state;
 }




 function md51_array(a) {
  var n = a.length,
   state = [, -, -, ],
   i,
   length,
   tail,
   tmp,
   lo,
   hi;
  for (i = 64; i <= n; i += 64) {
   md5cycle(state, md5blk_array(a.subarray(i - 64, i)));
  }
  a = i - 64 < n ? a.subarray(i - 64) : new Uint8Array(0);
  length = a.length;
  tail = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
  for (i = 0; i < length; i += 1) {
   tail[i >> 2] |= a[i] << (i % 4 << 3);
  }
  tail[i >> 2] |= 128 << (i % 4 << 3);
  if (i > 55) {
   md5cycle(state, tail);
   for (i = 0; i < 16; i += 1) {
    tail[i] = 0;
   }
  }
  tmp = n * 8;
  tmp = tmp.toString(16).match(/(.*?)(.{0,8})$/);
  lo = parseInt(tmp[2], 16);
  hi = parseInt(tmp[1], 16) || 0;
  tail[14] = lo;
  tail[15] = hi;
  md5cycle(state, tail);
  return state;
 }




 function rhex(n) {
  var s = "",
   j;
  for (j = 0; j < 4; j += 1) {
   s += hex_chr[(n >> (j * 8 + 4)) & 15] + hex_chr[(n >> (j * 8)) & 15];
  }
  return s;
 }




 function hex(x) {
  var i;
  for (i = 0; i < x.length; i += 1) {
   x[i] = rhex(x[i]);
  }
  return x.join("");
 }
 if (hex(md51("hello")) !== "5dabc4b2a76b9719dc592") {
  add32 = function (x, y) {
   var lsw = (x & ) + (y & ),
    msw = (x >> 16) + (y >> 16) + (lsw >> 16);
   return (msw << 16) | (lsw & );
  };
 }
 if (typeof ArrayBuffer !== "undefined" && !ArrayBuffer.prototype.slice) {
  (function () {
   function clamp(val, length) {
    val = val | 0 || 0;
    if (val < 0) {
     return Math.max(val + length, 0);
    }
    return Math.min(val, length);
   }
   ArrayBuffer.prototype.slice = function (from, to) {
    var length = this.byteLength,
     begin = clamp(from, length),
     end = length,
     num,
     target,
     targetArray,
     sourceArray;
    if (to !== undefined) {
     end = clamp(to, length);
    }
    if (begin > end) {
     return new ArrayBuffer(0);
    }
    num = end - begin;
    target = new ArrayBuffer(num);
    targetArray = new Uint8Array(target);
    sourceArray = new Uint8Array(this, begin, num);
    targetArray.set(sourceArray);
    return target;
   };
  })();
 }




 function toUtf8(str) {
  if (/[\u0080-\uFFFF]/.test(str)) {
   str = unescape(encodeURIComponent(str));
  }
  return str;
 }




 function utf8Str2ArrayBuffer(str, returnUInt8Array) {
  var length = str.length,
   buff = new ArrayBuffer(length),
   arr = new Uint8Array(buff),
   i;
  for (i = 0; i < length; i += 1) {
   arr[i] = str.charCodeAt(i);
  }
  return returnUInt8Array ? arr : buff;
 }




 function arrayBuffer2Utf8Str(buff) {
  return String.fromCharCode.apply(null, new Uint8Array(buff));
 }




 function concatenateArrayBuffers(first, second, returnUInt8Array) {
  var result = new Uint8Array(first.byteLength + second.byteLength);
  result.set(new Uint8Array(first));
  result.set(new Uint8Array(second), first.byteLength);
  return returnUInt8Array ? result : result.buffer;
 }




 function hexToBinaryString(hex) {
  var bytes = [],
   length = hex.length,
   x;
  for (x = 0; x < length - 1; x += 2) {
   bytes.push(parseInt(hex.substr(x, 2), 16));
  }
  return String.fromCharCode.apply(String, bytes);
 }




 function SparkMD5() {
  this.reset();
 }
 SparkMD5.prototype.append = function (str) {
  this.appendBinary(toUtf8(str));
  return this;
 };
 SparkMD5.prototype.appendBinary = function (contents) {
  this._buff += contents;
  this._length += contents.length;
  var length = this._buff.length,
   i;
  for (i = 64; i <= length; i += 64) {
   md5cycle(this._hash, md5blk(this._buff.substring(i - 64, i)));
  }
  this._buff = this._buff.substring(i - 64);
  return this;
 };
 SparkMD5.prototype.end = function (raw) {
  var buff = this._buff,
   length = buff.length,
   i,
   tail = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
   ret;
  for (i = 0; i < length; i += 1) {
   tail[i >> 2] |= buff.charCodeAt(i) << (i % 4 << 3);
  }
  this._finish(tail, length);
  ret = hex(this._hash);
  if (raw) {
   ret = hexToBinaryString(ret);
  }
  this.reset();
  return ret;
 };
 SparkMD5.prototype.reset = function () {
  this._buff = "";
  this._length = 0;
  this._hash = [, -, -, ];
  return this;
 };
 SparkMD5.prototype.getState = function () {
  return {
   buff: this._buff,
   length: this._length,
   hash: this._hash,
  };
 };
 SparkMD5.prototype.setState = function (state) {
  this._buff = state.buff;
  this._length = state.length;
  this._hash = state.hash;
  return this;
 };
 SparkMD5.prototype.destroy = function () {
  delete this._hash;
  delete this._buff;
  delete this._length;
 };
 SparkMD5.prototype._finish = function (tail, length) {
  var i = length,
   tmp,
   lo,
   hi;
  tail[i >> 2] |= 128 << (i % 4 << 3);
  if (i > 55) {
   md5cycle(this._hash, tail);
   for (i = 0; i < 16; i += 1) {
    tail[i] = 0;
   }
  }
  tmp = this._length * 8;
  tmp = tmp.toString(16).match(/(.*?)(.{0,8})$/);
  lo = parseInt(tmp[2], 16);
  hi = parseInt(tmp[1], 16) || 0;
  tail[14] = lo;
  tail[15] = hi;
  md5cycle(this._hash, tail);
 };
 SparkMD5.hash = function (str, raw) {
  return SparkMD5.hashBinary(toUtf8(str), raw);
 };
 SparkMD5.hashBinary = function (content, raw) {
  var hash = md51(content),
   ret = hex(hash);
  return raw ? hexToBinaryString(ret) : ret;
 };
 SparkMD5.ArrayBuffer = function () {
  this.reset();
 };
 SparkMD5.ArrayBuffer.prototype.append = function (arr) {
  var buff = concatenateArrayBuffers(this._buff.buffer, arr, true),
   length = buff.length,
   i;
  this._length += arr.byteLength;
  for (i = 64; i <= length; i += 64) {
   md5cycle(this._hash, md5blk_array(buff.subarray(i - 64, i)));
  }
  this._buff =
   i - 64 < length ?
   new Uint8Array(buff.buffer.slice(i - 64)) :
   new Uint8Array(0);
  return this;
 };
 SparkMD5.ArrayBuffer.prototype.end = function (raw) {
  var buff = this._buff,
   length = buff.length,
   tail = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
   i,
   ret;
  for (i = 0; i < length; i += 1) {
   tail[i >> 2] |= buff[i] << (i % 4 << 3);
  }
  this._finish(tail, length);
  ret = hex(this._hash);
  if (raw) {
   ret = hexToBinaryString(ret);
  }
  this.reset();
  return ret;
 };
 SparkMD5.ArrayBuffer.prototype.reset = function () {
  this._buff = new Uint8Array(0);
  this._length = 0;
  this._hash = [, -, -, ];
  return this;
 };
 SparkMD5.ArrayBuffer.prototype.getState = function () {
  var state = SparkMD5.prototype.getState.call(this);
  state.buff = arrayBuffer2Utf8Str(state.buff);
  return state;
 };
 SparkMD5.ArrayBuffer.prototype.setState = function (state) {
  state.buff = utf8Str2ArrayBuffer(state.buff, true);
  return SparkMD5.prototype.setState.call(this, state);
 };
 SparkMD5.ArrayBuffer.prototype.destroy = SparkMD5.prototype.destroy;
 SparkMD5.ArrayBuffer.prototype._finish = SparkMD5.prototype._finish;
 SparkMD5.ArrayBuffer.hash = function (arr, raw) {
  var hash = md51_array(new Uint8Array(arr)),
   ret = hex(hash);
  return raw ? hexToBinaryString(ret) : ret;
 };
 return SparkMD5;
});

自定义封装上传窗口

成都创新互联是一家集网站建设,峄城企业网站建设,峄城品牌网站建设,网站定制,峄城网站建设报价,网络营销,网络优化,峄城网站推广为一体的创新建站企业,帮助传统企业提升企业形象加强企业竞争力。可充分满足这一群体相比中小企业更为丰富、高端、多元的互联网需求。同时我们时刻保持专业、时尚、前沿,时刻以成就客户成长自我,坚持不断学习、思考、沉淀、净化自己,让我们为更多的企业打造出实用型网站。

查看代码

import axios from "axios";
//utils工具看:https://www.cnblogs.com/wxchun/p/.html
import utils from "@/utils";
const localUploadFile = {
 upload: function (files) {
  // console.log(files, "upload");
  this.file = files[0]; //上传文件资源
  this.fileName = this.file.name; //资源名称
  this.fileSize = this.file.size; //资源大小
  this.partList = [], //切片数组
   this.partsize = 0; //切片大小
  this.savedPath = ""; //保存路径
  this.hash = "",
   this.blobSlice =
   File.prototype.slice ||
   File.prototype.mozSlice ||
   File.prototype.webkitSlice;
  this.i = 0;
  this.funArr = [];
  this.isFail = false;
  if (!this.blobSlice) {
   this.$message.error('错误:上传组件不被此浏览器支持');
   return;
  }
  if (this.fileSize == 0) {
   this.$message.error('错误:无效的文件大小');
   return;
  }
  if (this.fileName.substring(
    this.fileName.lastIndexOf(".") + 1,
    this.fileName.length
   ) === "") {
   this.$message.error('错误:无效的文件类型');
   return;
  }
  // this.preprocess();
  this.sendCheckChunk();
 },





 /**
 * [sendRequest 文件检查]
 */
 sendCheckChunk: async function () {
  let buffer = await utils.fileParse(this.file, "buffer"),
   spark = new SparkMD5.ArrayBuffer();
  spark.append(buffer);
  this.hash = spark.end();
  axios
   .get("/apicc/v1/checkChunk", {
    params: {
     'hash': this.hash
    }
   }, {
    headers: {
     'Content-Type': 'application/json;charset=UTF-8',
    },
   })
   .then((res) => {
    console.log(res, "res");
    if (res.data && res.data.code == "200") {
     this.preprocess();
    } else {
     this.$message.error(res.data.msg);
    }
   })
   .catch((XMLHttpRequest, textStatus, errorThrown) => {
    this.$message.error('网络报错');
   });
 },





 /**
 * [preprocess 预处理]
 */
 preprocess: function () {
 //设置切片大小
  let chunkCount = Math.ceil(this.fileSize / )
  // let chunkCount = Math.ceil(this.fileSize / )
  let partList = [],
   cur = 0,
   partsize = this.fileSize / chunkCount; //一份的大小
  let suffix = /\.([0-9a-zA-Z]+)$/i.exec(this.fileName)[1];
  let lastdot = this.fileName.lastIndexOf(".");
  let fileName = this.fileName.substring(0, lastdot);
  for (let i = 0; i < chunkCount; i++) {
   let item = {
    file: this.file.slice(cur, cur + partsize),
    hash: this.hash,
    fileName: `${this.hash}_${i}.${suffix}`,
   };
   cur += partsize;
   partList.push(item);
  }
  this.partList = partList;
  // console.log(this, "this");
  this.sendRequest();
  // this.sendCheckChunk();
 },




 /**
 * [sendRequest 发送请求]
 */
 sendRequest: function () {
  // 根据100个切片创造100个请求(集合)
  let chunkCount = Math.ceil(this.fileSize / )
  let requestList = [];
  console.log(this.fileName, "this.fileName");
  this.partList.forEach((item, index) => {
   // 每一个函数都是发送一个切片的请求
   let fun = () => {
    let formData = new FormData();
    // formData.append("file", item.chunk); //新增切片文件
    // formData.append("chunkindex", index); //切片索引
    // formData.append("chunktotal", chunkCount); //切片总数
    // formData.append("filesize", this.fileSize); //文件总大小
    // formData.append("srcFileName", this.fileName); //文件总大小
    formData.append("hash", item.hash);
    formData.append("file", item.file);
    formData.append("fileName", item.fileName);
    return axios
     .post("/apicc/v1/uploadChunk", formData, {
      headers: {
       "Content-Type": "multipart/form-data"
      },
     })
     .then((result) => {
      result = result.data;
      console.log(result, "result124");
      if (result.code == 200) {
       console.log(result, "result");
       // this.isFail = false;
       this.savedPath = result.data && result.data.pathfile || "";
       if (this.percent) {
        let percent = parseInt(((this.i + 1) / chunkCount) * 100);
        this.percent(percent);
       }
       // 传完的切片我们把它移除掉
       this.partList.splice(index, 1);
      } else {
       // this.isFail = true;
       this.err({
        "msg": result.msg
       })
      }
     }).catch((v) => {
      // if (this.err) {
      //  this.err(v)
      // }
      console.log(v);
      // this.isFail = true;
     });
   };
   requestList.push(fun);
  });
  this.funArr = requestList;
  this.i = 0;
  this.uploadChunk();
 },




 uploadChunk: async function () {
  if (this.i >= this.funArr.length) {
   //已上传全部
   if (this.callback) {
    // this.callback(this, this.file, "http://39.103.229.29:7002" + this.savedPath);
    let _this = this
    console.log(_this.fileName, "_this");
    console.log(_this.hash);
    axios
     .get("/apicc/v1/mergeChunk", {
      params: {
       'fileName': _this.fileName,
       'hash': _this.hash
      }
     }, {
      headers: {
       'Content-Type': 'application/json;charset=UTF-8',
       // 'Content-Type': 'application/x-www-form-urlencoded',




      },
     })
     .then((res) => {
      res = res.data;
      console.log(res, "result124");
      if (res.code == 200) {
       if (res.data && res.data.fileUrl) {
        this.callback(this, this.file, "http://"+document.domain+":7002" + res.data.fileUrl);
       } else {
        this.err({
         "msg": "合并不成功"
        })
       }
      } else {
       // this.isFail = true;
       this.err({
        "msg": res.msg
       })
      }
     })
     .catch((XMLHttpRequest, textStatus, errorThrown) => {
      this.$message.error('网络报错');
     });




   }
   return
  }
  await this.funArr[this.i]();
  this.i++;
  this.uploadChunk();
 },




 /**
 * [progress 上传进度]
 * @param {Function} callback [回调]
 * @return {[type]}      [实例]
 */
 progress: function (callback) {
  this.percent = callback;
  return this;
 },
 /**
 * [success 上传成功]
 * @param {Function} callback [回调]
 * @return {[type]}      [实例]
 */
 success: function (callback) {
  this.callback = callback;
  return this;
 },
 /**
 * [success 上传失败]
 * @param {Function} callback [回调]
 * @return {[type]}      [实例]
 */
 fail: function (callback) {
  this.err = callback;
  return this;
 }
}




export const aetherupload = function () {
 var newInstance = Object.create(localUploadFile);
 return newInstance
}

文章标题:大文件切片上传到服务器
网站网址:http://chengdu.cdxwcx.cn/article/dsojhje.html