如何搭建一個高可用、高擴充套件的圖片儲存功能

專注於PHP、MySQL、Linux和前端開發，感興趣的感謝點個關注喲！！！文章整理在GitHub,主要包含的技術有PHP、Redis、MySQL、JavaScript、HTML&CSS、Linux、Java、Golang、Linux和工具資源等相關理論知識、面試題和實戰內容。

文章簡介

本文通過對一個小型電商系統的圖片儲存模組分析與總結，分享如何設計一個適用的圖片儲存功能。

常見圖片儲存方式

在日常的系統設計中，難免會涉及到圖片功能，例如商品的圖片、文章封面圖、使用者頭像等等。一般常規的方式對資料建立一個圖片的欄位，這個欄位儲存的就是檔案的路徑。如下面的格式:
| 資料編號 | 其他的欄位 | 圖片欄位 |
| :——: | :————-: | :——: |
| 1 | … | www.baidu.com/1.png |
| 2 | … | www.baidu.com/1.png |
上述的資料表設計有好也有壞的地方：

優勢:

1. 儲存方式簡單，只需要使用者上傳圖片，獲取到圖片的url儲存起來即可。
2. 展示方式簡單，客戶端只需要根據欄位的值，顯示即可。

劣勢:

1. 擴充套件性弱，如果後期我們的圖片更換了域名，需要針對所有的資料中的域名部分進行替換。

2. 多圖片擴充套件性弱，如果我們的某一條資料有多張圖片，這時候儲存的值可能是這種格式。圖片路徑1,圖片路徑2,….,圖片路徑n。雖然儲存起來簡單，但是在展示階段需要做資料格式的轉換，需要將字串轉換為陣列的格式進行迴圈處理。

3. 浪費儲存資源，假設有一張圖片a，在使用者頭像的時候上傳了一次，在商品圖片的時候也上傳了一次，這樣同一張圖片就會儲存兩次，多了一倍的儲存空間。

4. 第2點提到了路徑問題，可能你會想我圖片裡面不儲存具體得域名資訊，只儲存圖片的名稱，在客戶端展示的時候進行拼接即可。

   $domain = 'https://www.baidu.com/';
   $imageArray = ['1.png', '2.png', '3.png', '4.png'];
   foreach ($imageArray as $value) {
   $domain .= $value;
   }

   上面這種方式可以規避域名問題，但是也難免避免儲存方式問題。有可能系統前期使用的是七牛雲端儲存，後面適用了阿里雲端儲存，騰訊雲端儲存，這種就需要處理儲存方式。雖然也可以解決，但是讓系統設計起來顯得更加的複雜。

優化思路

根據上面的問題，我們可以思考一下，如果將系統的所有圖片，都做成一個功能模組，沒一個需要涉及到圖片的地方，去呼叫這個模組中的列表資料，獲取到系統的圖片，這樣是不是會更好一些呢？

如上圖，微信公眾號的圖片管理功能。左側是圖片的分類，右側是對應的具體圖片。我們在需要適用圖片的地方，去獲取對應的圖片資料即可。

同時，我們也有一個獨立的素材庫管理，可以檢視系統的所有圖片，便於對圖片的管理。

方案設計

優化思路提到了，我們單獨做一個圖片管理器。那我們資料表該具體怎麼設計呢？我們這裡以微信公眾號的圖片管理做演示。

1. 首先我們有一個圖片的分類，這時候就需要一個圖片分類表(image_category)。

2. 接下來，我們就需要建立一張具體得圖片表(image)，用來儲存具體的圖片資料。

1. 圖片分類主要就是分類的名稱、排序、建立時間等等資訊。

1. 圖片資訊表儲存的欄位就相對比較多一些。有圖片分類的id、儲存域名、圖片的名稱、圖片的url、圖片的大小、圖片的型別等資訊。

2. 表中拿一個欄位儲存域名，客戶端在獲取到域名和圖片的名稱時，直接拼接起來就是一個圖片的完成路徑。

3. 圖片的大小和圖片的副檔名，方便後期我們在頁面上進行展示。有的系統可能會展示圖片的大小。

方案總結

通過上面的設計，我們可以總結出如下幾點優勢：

1. 優化了圖片的儲存空間，避免同一張圖片多次上傳，佔用系統的儲存空間。

2. 如果涉及到不同的儲存平臺，我們圖片中有域名欄位，直接將域名和圖片名稱進行拼接即可。後期不管是換了多少個儲存平臺，系統也不會有任何影響。

3. 便於系統對圖片的管理，這樣將圖片儲存獨立出來，方便檢視系統的所有圖片資料。

4. 涉及到業務資料的表，只需要去關聯圖片表中的id即可。

本作品採用《CC 協議》，轉載必須註明作者和本文連結