1.5.0 • Published 1 year ago

big-file-down v1.5.0

Weekly downloads
-
License
ISC
Repository
-
Last release
1 year ago

简介

本工具支持大文件下载,设置并发下载,暂停/继续,不含界面纯粹的文件上传插件。

  • 大文件分流下载:会自行计算请求次数,分片下载
  • 并发下载:可自由控制并发数量,默认3个
  • 暂停/继续功能:可随时暂停或开启下载

版本更新内容

  • 1.5.0版本,优化下载模式
  • 1.4.1版本,增加插件演示地址
  • 1.4.0版本,增加了可修改最后下载文件名字的字段
  • 1.3.0版本,修复了暂停和继续的问题

插件使用演示

点击查看演示 账号:18306058718 密码:888888

联系方式

q:1805231651,有问题可联系我更改

使用方法

1.npm安装

npm i big-file-down

2.引入

import { DownFile } from "big-file-down";

3.视频切片使用示例

import { DownFile } from "big-file-down"
const down = document.getElementById("down");
let downObj;
down?.addEventListener("click", () => {
    downObj = new DownFile({
        downUrl:'/index/Mymedia/downFile', //下载地址
        src:'/fenpian/1/水墨画.mov', //文件存放地址(文件名字和后缀会自动从这取)
        headers:{ //请求头
            'user-id':1,
            token:'f97132ab303a1ad9de8bd7fcfa88aec5',
        },
        change(schedule) { //下载进度变化触发函数
            console.log("schedule",schedule)
        },
        changeStatus(status) { //下载状态变化触发函数
            console.log("status",status)
        },
        success:()=>{ //下载成功触发函数
            console.log("下载成功");
        },
        fail(error) { //错误触发函数
            console.log(error)
        },
    })
})
// //暂停下载
// downObj.stop();
// //继续下载
// downObj.start();

参数结构

参数说明类型可选值默认值
downUrl下载文件的请求地址string--
getSizeUrl获取下载的文件大小string--
size每次下载多大,单位:Mnumber-2
src文件地址string--
fileName可修改最终下载后的文件名string--
headers请求头Record<string, any>--
count并发数number-3
auto数据传输完成,是否直接触发下载boolean-true
type下载模式number1或21
success成功完成函数() => void--
fail报错触发函数(error: string ) => void--
change下载进度变化触发函数(schedule:number) => void--
changeStatus请求状态变化触发函数(status:status) => void--
beforeRequest下载函数掉用前的数据处理(data:any) => any--
beforeResponse下载函数掉用前的数据处理(data:any) => ResponseApiBlob--

方法说明

方法名称说明参数参数是否必传
start继续下载--
stop暂停下载--

注意事项

获取文件大小是GET方法

分片下载文件是POST方法

获取文件大小接口在getSizeUrl参数没有得情况下,默认使用downUrl参数

返回统一处理函数替换

/**
 * 如返回的参数结构跟此插件不一致,需替换
 * 此插件统一返回结构主要为:{ bool:Boolean, msg:string|{[key:string]:any} }|Blob
 * bool:true为成功的返回,false:失败的返回,需要触发错误函数的
 * msg:错误返回这个就是错误的提示语
 */
/**
 * 下面是替换处理函数的示例
 * 如统一返回的结构为:{code:number, data:any, message:string} | Blob
 * code:0为成功,其他的为失败
 * data:数据
 * message:提示语
 */
//方法一 :
const bigFIleUp = new BigFileUp({
    ...,
    beforeResponse:function(response: any){
        const type = Object.prototype.toString.call(response);
        //由于有下载,下载的时候会有直接返回Bolb这种情况
        if(type === "[object Object]"){//这种主要用于获取文件大小
            if(response.code === 0){
                return {bool:true,msg:response.data};
            }else{
                return {bool:false,msg:response.message};
            }
        }else if(type === '[object Blob]'){ //直接返回的Bolb类型,下载
            return response;
        }
    }
});
1.5.0

1 year ago

1.4.1

1 year ago

1.4.0

1 year ago

1.3.0

1 year ago

1.2.0

1 year ago

1.1.0

1 year ago

1.0.0

1 year ago