Node中的文件操作(後端)與瀏覽器中的文件操作(前端)
瀏覽器端文件對象
File
重要及其常用屬性:
File.name;
File.size;
File.type;(對於保存文件到本地時命名文件的格式)
瀏覽器中對文件對象的操作
重要及其常用操作方法:
文件切片:Blob.prototype.slice()
文件預覽(獲取指向文件的url鏈接):
1 URL.createObjectURL()
2 fileReader.readAsDataURL(file);
FileReader常用方法及其使用場景:
獲取文件的ArrayBuffer; 獲取文件的原始二進制數據; 獲取文件的Base64格式的URL編碼地址; 獲取文件的文本內容;
Node端文件對象
重要並且常用屬性:
由於我們處理文件上傳時, 是用multer模塊進行完成的, 所以重點關注multer中的文件對象的各種屬性:
File.fieldname ---> 上傳的表單中與文件對象對應的屬性名
File.originalname ---> 在客戶端選擇文件時的名字
File.mimetype
File.size
File.destination
File.filename ---> 文件存儲在服務器上的名字
File.path
File.buffer(僅當存儲在內存上時有此屬性)
Node中對文件對象的操作
重要及其常用方法:
將多個文件合併成一個文件:
保存前端的文件數據到本地:
讀取本地的文件的文本內容:
讀取本地的文件的二進制數據:
前后端发送与接受文件(對於文件的交接)
1 後端把文件資源放到公共資源裡面, 然後暴露給前端url鏈接, 直接可以訪問和下載.
2 後端讀取文件, 提取出文件的二進制數據, 將二進制數據封裝到json對象中, 通過ajax請求返回到前端, 前端提取出文件的二進制數據, 可以將此二進制數據封裝到File或Blob對象中, 通過前端的各種API對其進行各種操作. 這個應該可以作為文件的中轉操作. 然後...(不知道能不能復原成原文件, 主要是如何確定文件的類型, 以及如何通過二進制數據生成文件並下載到本地)
1 前端通過input標籤元素或者通過拖拽事件獲取獲取文件對象, 封裝到FormData對象當中, 通過文件上傳的方式發送到後端, 後端通過解析請求體獲取並保存文件對象
2 前端獲取到文件對象之後, 通過提取其中的二進制數據, 封裝到json對象當中, 發送到後端, 後端提取出二進制數據, 然後...(不知道能不能復原成原文件, 主要是如何確定文件的類型, 以及如何通過二進制數據生成文件並下載到本地)
關於上述前端與後端第一種文件交接的方式, 已基本了解.
第二種方式沒有太了解過, 這牽扯到前後端對二進制數據操作的不同, 文件二進制數據是固定的, 可是前後端對二進制數據的解析方式需要分別進行仔細的了解. 本質上就是二進制數據與文件實體(或者文件對象)的轉換方式, 需要明白.
前端:
ArrayBuffer ==> (Blob ==> File) 通過Blob(ArrayBuffer)構造函數, 也可以通過File(ArrayBuffer)構造函數, File繼承自Blob, 可以把這兩個對象理解成一個東西.
猜測: ArrayBuffer中包含了關於文件的所有信息, 包括文件的格式, 等一切數據. 通過構造函數生成File對象之後, 會自動獲得其name, size, type等屬性;
前端如何獲取文件的ArrayBuffer
後端:
來自前端的ArrayBuffer --> 後端的Buffer(構造函數) --> fs.write(Buffer)保存到本地;
後端如何獲取文件的ArrayBuffer;
