js:File大文件分片为小文件Blob

简介: js:File大文件分片为小文件Blob

实现代码

/**
* 文件分片
 */
function getFileChunks(file, chunkSize) {
  let chunks = []
  // 默认分片大小 2MB
  let defaultChunkSize = 1024 * 1024 * 2
  chunkSize = chunkSize || defaultChunkSize
  let blobSlice =
    File.prototype.slice ||
    File.prototype.mozSlice ||
    File.prototype.webkitSlice
  let current = 0
  while (current < file.size) {
    let chunk = blobSlice.call(file, current, current + chunkSize)
    chunks.push(chunk)
    current += chunkSize
  }
  return chunks
}
<input
      type="file"
      id="file"
    />
<script>
  document.querySelector('#file').addEventListener('change', function (e) {
    let file = e.target.files[0]
    let chunks = getFileChunks(file, 1024 * 1)
    console.log(chunks)
  })
</script>

文件切片结果

image.png


相关文章
|
4天前
|
JavaScript
浏览器插件crx文件--JS混淆与解密
浏览器插件crx文件--JS混淆与解密
10 0
|
16天前
|
JavaScript 前端开发 容器
AJAX载入外部JS文件到页面并让其执行的方法(附源码)
AJAX载入外部JS文件到页面并让其执行的方法(附源码)
18 0
|
1月前
|
JavaScript
uni-app中关于格式化时间的js文件
uni-app中关于格式化时间的js文件
32 0
|
2月前
|
JavaScript 前端开发 内存技术
js文件的入口代码及需要入口代码的原因
js文件的入口代码及需要入口代码的原因
|
2月前
|
存储 前端开发 JavaScript
JavaScript 中的 BLOB 数据结构的使用介绍
JavaScript 中的 BLOB 数据结构的使用介绍
60 1
|
3月前
|
XML JSON JavaScript
|
3月前
|
存储 JavaScript 前端开发
只使用简单的 JavaScript 创建文件共享型网站
只使用简单的 JavaScript 创建文件共享型网站
39 0
只使用简单的 JavaScript 创建文件共享型网站
|
3月前
|
JavaScript Android开发
AutoJs4.1.0实战教程---js文件打包发布成APK文件
AutoJs4.1.0实战教程---js文件打包发布成APK文件
103 0
AutoJs4.1.0实战教程---js文件打包发布成APK文件
|
1月前
|
JSON JavaScript 前端开发
vue项目使用Print.js插件实现PDF文件打印
vue项目使用Print.js插件实现PDF文件打印
53 0
|
2月前
|
数据采集 机器学习/深度学习 JavaScript
画【Python折线图】的一百个学习报告(二、pyecharts引入js文件)
画【Python折线图】的一百个学习报告(二、pyecharts引入js文件)
51 0