欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Java實(shí)現(xiàn)瀏覽器大文件上傳的示例詳解

 更新時(shí)間:2024年07月02日 09:24:17   作者:BLACK595  
文件上傳是許多項(xiàng)目都有的功能,用戶上傳小文件速度一般都很快,但如果是大文件幾個(gè)g,幾十個(gè)g的時(shí)候,上傳了半天,馬上就要完成的時(shí)候,網(wǎng)絡(luò)波動(dòng)一下,文件又要重新上傳,所以本文給大家介紹了Java實(shí)現(xiàn)瀏覽器大文件上傳的示例,需要的朋友可以參考下

前言

文件上傳是許多項(xiàng)目都有的功能,用戶上傳小文件速度一般都很快,但如果是大文件幾個(gè)g,幾十個(gè)g的時(shí)候,上傳了半天,馬上就要完成的時(shí)候,網(wǎng)絡(luò)波動(dòng)一下,文件又要重新上傳,抓狂。那有什么辦法解決解決這個(gè)問題,答案就是把文件分片,一段一段把文件拆開上傳。

核心講解

原理

分片上傳:把一個(gè)完整的文件,前端把文件分成多個(gè)小塊的chunk,一塊一塊的傳遞給后端,后端接收到后再把全部的塊拼接起來(lái),這樣就算在某個(gè)時(shí)間點(diǎn)發(fā)生網(wǎng)絡(luò)波動(dòng),那么丟失的也只有一塊。

秒傳:前端在把文件分片前,先計(jì)算出文件的md5值,后端拿到這個(gè)md5先去檢查下是否已經(jīng)有這個(gè)文件了,如果有直接給前端上傳成功。這就是我們?cè)诰W(wǎng)盤上有時(shí)候出現(xiàn)的文件秒傳,說(shuō)明已經(jīng)有人跟你上傳過同一份文件了。

斷點(diǎn)續(xù)傳:當(dāng)網(wǎng)絡(luò)出現(xiàn)異常上傳中斷后我們繼續(xù)上傳時(shí),先去后端請(qǐng)求接口,拿到已經(jīng)上傳過的分片下標(biāo),再繼續(xù)上傳沒有上傳的分片。

整體流程

  • 用戶選擇文件進(jìn)行上傳
  • 前端獲取文件唯一標(biāo)識(shí)md5
  • 判斷文件md5是否已經(jīng)保存,是則秒傳
  • 判斷文件分片是否已經(jīng)上傳部分,是則斷點(diǎn)續(xù)傳
  • 上傳分片文件
  • 后端合并分片
  • 分片上傳完成

功能分析

前端

前端實(shí)現(xiàn)的功能難點(diǎn)在于文件分片,和獲取文件的md5。

文件分片

因?yàn)閖s的File對(duì)象繼承自Blob,所以他也有slice方法,slice方法需要的參數(shù)有兩個(gè),一個(gè)是startByte文件起始讀取的字節(jié)位置,另一個(gè)是endByte結(jié)束讀取的字節(jié)位置。

let fileChunkList = []; //存放文件切片
let cur = 0;
// 分片
while(cur < file.size){
  fileChunkList.push(file.slice(cur,cur + chunkSize));
  cur += chunkSize;
}

獲取文件md5

獲取文件的md5,推薦使用SparkMD5的文件增量方式獲取,如果直接計(jì)算文件的hash,文件過大時(shí)對(duì)瀏覽器負(fù)擔(dān)會(huì)較大。

上傳文件

通過check接口上傳前先判斷是否秒傳和獲取已經(jīng)上傳的分片下標(biāo)。

function handleBeforeUpload(file) {
  const chunkSize = 1024 * 1024 * 10; // 10MB
  // 計(jì)算md5
  md5(file, chunkSize).then(md5 => {
    //檢查是否秒傳
    request({
      url: "/upload/check/" + md5,
      method: "get",
    }).then(result => {
      const isOk = result.isOk;
      const haveList2 = result.haveList; //已經(jīng)上傳的分片下標(biāo)
      if(isOk) {
        console.log("秒傳成功");
        return;
      }
      haveList.value = haveList2;
      let chunkIndex = 0;
      //上傳第一個(gè)分片
      upload(fileChunkList.value, chunkIndex, md5, file);
    })
  });
  return false;
}

已經(jīng)上傳的這些分片下標(biāo)要跳過上傳

后端

分片來(lái)后端后,使用RandomAccessFile就可以在一個(gè)文件上進(jìn)行操作,而不用使用創(chuàng)建多個(gè)臨時(shí)文件最后合并的方式,通過分片下標(biāo)和分片大小計(jì)算出偏移量,使用RandomAccessFile將跳到偏移開始位置存放數(shù)據(jù)。RandomAccessFile的第二個(gè)參數(shù)的model有如下;

? "r":以只讀方式打開指定文件。 ? "rw":以讀、寫方式打開指定文件。 ? "rws":以讀、寫方式打開指定文件。相對(duì)于"rw"模式,還要求對(duì)文件的內(nèi)容或元數(shù)據(jù)的每個(gè)更新都同步寫入到底層存儲(chǔ)設(shè)備。 ? "rwd":以讀、寫方式打開指定文件。相對(duì)于"rw"模式,還要求對(duì)文件內(nèi)容的每個(gè)更新都同步寫入到底層存儲(chǔ)設(shè)備。

/**
 * 分片文件上傳
 * @param file 文件
 * @param chunkIndex 分片下標(biāo)
 * @param md5 md5
 * @param totalFileSize 文件總大小
 * @param fileName 文件名
 */
@PostMapping("/shard")
public AjaxResult shardUpload(@RequestParam MultipartFile file, @RequestParam Integer chunkIndex,
                              @RequestParam String md5, @RequestParam Long totalFileSize,
                              @RequestParam String fileName) throws Exception{
    // 存放文件目錄
    String dirPath = System.getProperty("user.dir") + "/file/"+md5+"/";
    File dirFile = new File(dirPath);
    if(!dirFile.exists()){
        dirFile.mkdir();
    }
    File tempFile = new File(dirPath + fileName);
    RandomAccessFile rw = new RandomAccessFile(tempFile, "rw");
    // 定位到分片的偏移量
    rw.seek(CHUNK_SIZE * chunkIndex);
    // 寫入分片數(shù)據(jù)
    rw.write(file.getBytes());
    // 關(guān)閉流
    rw.close();
    // 讀取已經(jīng)分片集合
    List<Object> hasChunkList;
    String hasChunkKey = CHUNK_PREFIX + md5;
    if(redisCache.hasKey(hasChunkKey)){
        hasChunkList = redisCache.getCacheList(hasChunkKey);
    } else {
        hasChunkList = new ArrayList<>();
    }
    hasChunkList.add(chunkIndex);
    // 將最新的分片下標(biāo)更新到Redis中
    redisCache.addCacheListOne(hasChunkKey,chunkIndex);
    // 判斷是否上傳完成
    int totalNeedChunks = (int) Math.ceil((double) totalFileSize / CHUNK_SIZE);
    // 總共需要的分片數(shù) 和 已經(jīng)分片上傳的數(shù)量相等 則上傳完成
    boolean isOk = totalNeedChunks == hasChunkList.size();
    if(isOk){
        redisCache.setCacheObject(UPLOAD_ISOK_PREFIX + md5, true);
    }
    AjaxResult ajax = AjaxResult.success();
    ajax.put("hasChunkList",hasChunkList);
    ajax.put("isOk",isOk);
    return ajax;
}

最終演示

上傳完成演示

秒傳演示

斷點(diǎn)演示

待優(yōu)化

  • 提供查詢進(jìn)度接口,前端進(jìn)度條展示,增加用戶體驗(yàn)。
  • 多線程上傳,不同分片用多線程,提高下載速度。

到此這篇關(guān)于Java實(shí)現(xiàn)瀏覽器大文件上傳的示例詳解的文章就介紹到這了,更多相關(guān)Java瀏覽器大文件上傳內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!

相關(guān)文章

  • idea運(yùn)行程序報(bào)錯(cuò)java程序包org.junit不存在解決辦法

    idea運(yùn)行程序報(bào)錯(cuò)java程序包org.junit不存在解決辦法

    這篇文章主要給大家介紹了關(guān)于idea運(yùn)行程序報(bào)錯(cuò)java程序包org.junit不存在的解決辦法, 當(dāng)出現(xiàn)程序包org.junit不存在的問題時(shí),可以通過使用適當(dāng)?shù)腏Unit版本、添加依賴或重新下載程序包等方式進(jìn)行解決,需要的朋友可以參考下
    2024-02-02
  • Java深入淺出理解快速排序以及優(yōu)化方式

    Java深入淺出理解快速排序以及優(yōu)化方式

    快速排序由于排序效率在同為O(N*logN)的幾種排序方法中效率較高,因此經(jīng)常被采用,再加上快速排序思想----分治法也確實(shí)實(shí)用,因此很多軟件公司的筆試面試,包括像騰訊,微軟等知名IT公司都喜歡考這個(gè),還有大大小的程序方面的考試如軟考,考研中也常常出現(xiàn)快速排序的身影
    2021-11-11
  • JAVA Comparator 和 Comparable接口使用方法

    JAVA Comparator 和 Comparable接口使用方法

    本文介紹了Java中Comparable和Comparator接口的使用,包括它們的定義、方法和應(yīng)用場(chǎng)景,Comparable用于定義類的自然排序規(guī)則,而Comparator提供了一種靈活的方式來(lái)定義對(duì)象之間的排序規(guī)則,無(wú)需修改類本身,感興趣的朋友一起看看吧
    2025-03-03
  • SpringBoot使用EmbeddedDatabaseBuilder進(jìn)行數(shù)據(jù)庫(kù)集成測(cè)試

    SpringBoot使用EmbeddedDatabaseBuilder進(jìn)行數(shù)據(jù)庫(kù)集成測(cè)試

    在開發(fā)SpringBoot應(yīng)用程序時(shí),我們通常需要與數(shù)據(jù)庫(kù)進(jìn)行交互,為了確保我們的應(yīng)用程序在生產(chǎn)環(huán)境中可以正常工作,我們需要進(jìn)行數(shù)據(jù)庫(kù)集成測(cè)試,在本文中,我們將介紹如何使用 SpringBoot 中的 EmbeddedDatabaseBuilder 來(lái)進(jìn)行數(shù)據(jù)庫(kù)集成測(cè)試
    2023-07-07
  • 探索Java分布式限流技術(shù)

    探索Java分布式限流技術(shù)

    探索Java分布式限流技術(shù),讓你的系統(tǒng)遠(yuǎn)離流量過載的煩惱,本指南將帶你了解如何使用Java實(shí)現(xiàn)高效的限流策略,幫助你輕松應(yīng)對(duì)高并發(fā)場(chǎng)景,讓我們一起開啟這段精彩的技術(shù)之旅,打造更加穩(wěn)定可靠的系統(tǒng),需要的朋友可以參考下
    2024-03-03
  • java隊(duì)列中Queue與Deque的區(qū)別面試精講

    java隊(duì)列中Queue與Deque的區(qū)別面試精講

    這篇文章主要為大家介紹了java隊(duì)列中Queue與Deque的區(qū)別面試精講,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪
    2023-10-10
  • Spring初始化與銷毀順序案例演示詳解

    Spring初始化與銷毀順序案例演示詳解

    這篇文章主要介紹了SpringBoot中的Bean的初始化與銷毀順序,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
    2023-02-02
  • Java高并發(fā)之CyclicBarrier的用法詳解

    Java高并發(fā)之CyclicBarrier的用法詳解

    CyclicBarrier 是 Java 中的一種同步工具,它可以讓多個(gè)線程在一個(gè)屏障點(diǎn)處等待,直到所有線程都到達(dá)該點(diǎn)后,才能繼續(xù)執(zhí)行。本文就來(lái)和大家聊聊它的用法,需要的可以參考一下
    2023-03-03
  • JWT全面解讀和詳細(xì)使用步驟

    JWT全面解讀和詳細(xì)使用步驟

    這篇文章全面解讀了JWT規(guī)范和詳細(xì)使用步驟,文中通過示例代碼介紹的非常詳細(xì)。對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
    2021-12-12
  • 秒懂Java枚舉類型(enum)

    秒懂Java枚舉類型(enum)

    這篇文章主要介紹了秒懂Java枚舉類型(enum),本文給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下
    2020-12-12

最新評(píng)論