簡談文件下載的三種方式

lsxiao 發布于2019-08-16 13:36 / 1020人閱讀

摘要：一前言本文章將以報表下載為例，給大家介紹三種文件下載的方式。通過二進制數據流的方式下載這種方式是我目前采用的方式，用于處理報表下載。缺點對于數據量不大的文件，這種方式是可行的。

一、前言

本文章將以excel報表下載為例，給大家介紹三種文件下載的方式。

原文地址：簡談文件下載的三種方式 | Rychou

二、正文 1. 通過服務器文件地址下載

這是最常見的文件下載方式，大多數網站的音頻、視頻、種子文件等文件的下載方式都是通過這種方式實現的。

這種方式具體的實現方式是這樣的：

前端請求獲取excel報表的下載地址

后端根據前端的請求，查詢數據庫并把查詢結果保存到服務器的一個excel文件中

后端把這個excel文件地址返回給前端

前端將此excel文件地址賦值給一個,并點擊此標簽，利用瀏覽器的默認行為下載此文件。

優點：實現方式簡單，通用。
缺點：需要把文件保存到服務器，會占用服務器資源。這個缺點也有解決方式：給保存的文件設定一個時效性，過了這個時效，服務器就會刪除這個文件。

2. 通過二進制數據流的方式下載

這種方式是我目前采用的方式，用于處理報表下載。

這種方法的具體實現流程如下：

前端請求獲取excel報表的二進制數據流

后端根據前端請求，查詢數據庫并把查詢結果轉成二進制數據流。注意：這里并不生成一個文件保存在服務器

后端把二進制數據流返回給前端

前端把二進制數據流轉成URL對象并賦值給標簽

點擊標簽實現下載

我用的是axios網絡請求庫

代碼示例：

axios({
  url: "/monitors/export",
  method: "GET",
  responseType: "blob",//指定返回數據格式
}).then(res => {
  // 將二進制數據流轉成URL對象
  const url = window.URL.createObjectURL(
    new Blob([res.data], {
      type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8",
    }),
  );
  const link = document.createElement("a");
  link.href = url;
  link.setAttribute("download", "車輛監控列表.xls"); // 需要指定文件格式。
  document.body.appendChild(link);
  link.click(); //點擊事件
});

優點：不需要服務器生成文件，并保存到服務器中，可以有效減少服務器資源占用。
缺點：這種方式可能并不那么通用，也可能有一定的兼容性問題。

3. 前端下載

這種方式是我測試過，確實可行的一種方法，它的具體實現原理是這樣的，前端通過類似export-from-json的庫，把JSON格式的報表數據，導出到excel文件中。

優點：不需要為下載多帶帶發起一次網絡請求，直接把保存在前端的請求的報表數據，導出到excel文件即可。
缺點：對于數據量不大的文件，這種方式是可行的。但是對于數據量很大，像幾千幾萬條數據的話，性能緩慢是它最大的弊端。

GPU云服務器云服務器服務器的三種存儲方式阿里云發送郵件的三種方式云計算的三種服務模式 asp支持的三種控件

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/72012.html

簡談文件下載的三種方式

摘要：一前言本文章將以報表下載為例，給大家介紹三種文件下載的方式。通過二進制數據流的方式下載這種方式是我目前采用的方式，用于處理報表下載。缺點對于數據量不大的文件，這種方式是可行的。一、前言本文章將以excel報表下載為例，給大家介紹三種文件下載的方式。原文地址：簡談文件下載的三種方式 | Rychou 二、正文 1. 通過服務器文件地址下載這是最常見的文件下載方式，大多數網站的音頻...

2i18ns 2019-08-23 12:47 評論0 收藏0
簡談Java Enum

摘要：常量接口是對接口的一種不良使用。如果這些常量最好被看作是枚舉類型成員，那就應該用枚舉類型來導出。因為客戶端既不能創建枚舉類型的實例，也不能對它進行擴展，因此很可能沒有實例，而只有聲明過的枚舉常量。換句話說，枚舉類型是實例受控的。問題我們偶爾能在項目中看到如下風格的代碼： public class ResponseCode { public static final int ...

BicycleWarrior 2019-08-16 10:39 評論0 收藏0
簡談Java String

摘要：而用關鍵字調用構造器，總是會創建一個新的對象，無論內容是否相同。中對象的哈希碼被頻繁地使用比如在等容器中。字符串不變性保證了碼的唯一性因此可以放心地進行緩存。對于所有包含方式新建對象包括的連接表達式，它所產生的新對象都不會被加入字符串池中。前言前陣子和同事在吃飯時聊起Java的String，覺得自己之前的筆記寫的略顯零散。故此又重新整理了一下。 String在Java中算是一個有意...

ssshooter 2019-08-15 12:28 評論0 收藏0
簡談JavaScript閉包

摘要：所以經常看到的說閉包就是綁定了上下文環境的函數。我更偏向于閉包是一個函數和聲明該函數的詞法環境的組合。里面的閉包先上一個閉包該例子的解釋上面的代碼，在函數里面定義的函數和這個函數聲明的詞法環境就形成了一個閉包。閉包是什么第一種說法：閉包創建一個詞法作用域，這個作用域里面的變量被引用之后可以在這個詞法作用域外面被自由訪問，是一個函數和聲明該函數的詞法環境的組合第二種說法：閉包就是...

Zachary 2019-08-26 12:00 評論0 收藏0