JS文件處理—文件上傳（分塊、斷點續傳）

一、常規文件上傳：

　　方案一：直接通過from表單

　　方案二：通過js上傳文件：https://blog.csdn.net/qq_37568942/article/details/98873471

　　　　說明：H5中，選擇上傳的文件，必須通過 input[type="file"] 標簽實現。js中是無法獲取 input[type="file"] 選中文件的路徑和數據，。但是允許FormData 對象 獲取到 input[file] 內的數據流。

　　　　　　　formData對象中和文件相關的信息，js是無法打印出來的。

　　　　關鍵點：使用new FormData() 創建一個form類型的數據，接受input控件中的文件數據流。

      var inputDOM = this.$refs.file  // 獲取input[type="file"] 對象
      var file = inputDOM.files[0]   
      var formData = new FormData()
      formData.append('uploadFile', file)  // 將input控件里面的數據流，塞到formData對象里
      uploadFileToQiniu(formData)  // 調用ajax請求，注意這里的請求頭Content-Type 必須是 multipart/form-data類型的

二、大文件 分片上傳：https://www.cnblogs.com/sghy/p/9143955.html  或 https://www.jianshu.com/p/bfaad1323a4c

　　原理說明：其實就是js把大文件，分割成多個小文件。在把這些小文件，一個一個單獨上傳上去就可以了。

　　　　　　   前端生成的是分割的文件，后端就需要合並這些小文件。才能成為一個完整的文件。

         var file = document.getElementById("file").files[0];
         var chunk = file.slice(start,end);//切割文件    

 

三、斷點續傳：https://www.cnblogs.com/viewts/p/10820785.html

　　原理說明：斷點續傳是基於 分片上傳 的功能上，在已經上傳的分片上，繼續上傳剩下的分片文件。