//为了实现断点续传，研究了js的文件分片
//实现断点续传的构思
//文件分片按顺序上传，上传第一个后文件名md5加密保存到rdis的key，value保存为上传的index，
//然后下面每次上传成功就更新对应的value，保持最新的
//第一次上传时
//查询redis是否已经存在相同的key，如果相同就跳到保存的index的下一个上传
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<script>

    var 切片大小=(1024*1024)*1;//确定分片大小
    var xmt=new XMLHttpRequest();//axaj请求
    function updata(index) {//index是上传标记的序列

    var file=document.getElementById("文件").files[0];//获取文件
    let {fname ,fext}=.split('.');//获取文件的名字和拓展名
    var star=index*切片大小;//切片的起点
    if(star>file.size)//判断起点是否已经超过文件的长度，超过说明已经
    {
        return;
    }


    var bool=file.slice(star,star+切片大小);//slice（分割起点，分割终点）是js切割文件的函数，
    var boolname=fname+index+fext
    var boolfile=new File([bool],boolname)//把分割后的快转成文件传输
    var from=new FormData();//定义集合方便后端接收

        from.append("切片序列", index);
        from.append("切片长度", 切片大小);
        from.append("name",)
        from.append("file",boolfile);
        from.append("name",)
        from.append("file",boolfile);
    xmt.open("post","/接收文件",true)//发送请求
    xmt.send(from)//携带集合
        xmt.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
                //alert(this.responseText)
                    if ( this.responseText=="上传完成"){//按顺序上传，只有上一片上传成功下一个才能上传
                         //这里可以加个判断，获取断点，获取后下一个，后端也会判断切片是否已经下载过


                         updata(++index);
                        document.getElementById("显示").value=star/file.size;//显示上传的进度

                    }


                       }
        };

    }


</script>
<body>
<div>
<input type="file" name="选择文件" id="文件">//获取文件
<input type="button" value="确定" onclick="updata(0)">//点击执行
<br>
    <input type="text" id="显示">//
</div>

</body>
</html>