---
title: 什麼是 blob
tags: blob, image, 圖檔
---
# 什麼是 blob

參考資料：
[Blob Storage](https://www.youtube.com/watch?v=Jw1wLldeLlQ)
[Azure Blob 儲存體簡介](https://docs.microsoft.com/zh-tw/azure/storage/blobs/storage-blobs-introduction)
[DAY12 - 檔案類的物件關係釐清(1) - File, FileList, Blob](https://ithelp.ithome.com.tw/articles/10271735)

## 主要功能

### Blob 儲存體設計用來：

1. 直接提供映像或文件給瀏覽器。
2. 儲存檔案供分散式存取。
3. 串流影片和音訊。
4. 寫入記錄檔。
5. 儲存備份和還原、災害復原和封存資料。


### Blob 物件(Binary large Object) ＝ 二進位類型的大物件
Blob 其實不是 javascript 獨有的。++最早 Blob 是應用在在資料庫管理中，用於儲存影音、大型文件或圖檔++。這些大型檔案，無法儲存在一般的常規資料庫中，因此有了 Blob的 資料型態，儲存大量的非結構化物件資料。

使用者或用戶端應用程式可以從世界各地透過 HTTP/HTTPS 存取 Blob 儲存體中的物件。 Blob 儲存體中的物件可透過 Azure 儲存體 REST API、Azure PowerShell、Azure CLI 或 Azure 儲存體用戶端程式庫存取。 用戶端程式庫適用於不同的語言，包括：

* .NET
* Java
* Node.js
* Python
* Go
* PHP
* Ruby

## 實際應用

### 前端網頁中的 Blob
Blob 物件為一個不可變、相當於檔案(原始資料)的類檔案物件。在前端網頁最大的貢獻應該就是可以讓我們更方便地處理檔案相關的操作ex. ++分片上傳、圖檔預覽++等等，透過 Blob，javaScript才能讀寫二進位資料的檔案。

### Blob 的屬性
Blob主要包含兩個屬性

#### Blob.size (read only)：
物件中所包含資料的大小（位元組）
Blob.type(read only)：
一個字串，表此 Blob 物件所包含資料的 MIME 型別。若型別未知，則值為空字串。

備註：MIME 型別 - MIME Type (Multipurpose Internet Mail Extensions Type)
一種用來描述檔案格式的標準化方式，Ex.圖檔可能就會是image/png。也可以稱為「媒體類型」（media type）、「内容類型」（content type)。瀏覽器通常使用 MIME type，而「不是」我們一般看到的檔案的副檔名(file extention)來決定怎麼處理這份文件。

### Blob的方法

#### arrayBuffer
return Promise 物件且包含 blob 所有内容的二進位格式的 ArrayBuffer
slice([start[, end[, contentType]]])
會 return 一個新的 blob，並可指定範圍的資料
PS.由於 File 繼承自Blob，可用在開發上傳檔案的分片上傳，就是利用此方式分割檔案。
#### stream
return 一個能讀取 blob 内容的 ReadableStream
#### text
return一個 Promise 物件，包含 blob 所有内容 UTF- 8格式的 USVString