圖片轉 Base64

在瀏覽器中將圖片轉換為 Base64 資料 URI，用於嵌入 HTML、CSS 或 JSON。

如何使用圖片轉 Base64

這個轉換器的作用

該影像到 Base64 轉換器將圖片轉換為資料 URI、直接嵌入影像的長文字字串以及現成的 CSS 背景片段。你可以內聯影像而不是連結到單獨的檔案。

它在你的瀏覽器本機執行，因此你的影像會在你的裝置上讀取，而不會上傳。

資料 URI 在標記內攜帶整個影像，因此瀏覽器不會發出單獨的網路請求來取得它。對於像圖示這樣的小資源，節省的往返可以讓頁面感覺更快。

問題在於大小和快取。 Base64 增加了大約 33% 的開銷，因為它表示具有有限文字字母的二進位資料，並且內聯影像無法單獨快取，因此包含它的每個頁面都會再次下載。

經驗法則是內嵌小影像、圖示、小標誌或精靈，避免請求是值得的開銷，並將較大的影像保留為瀏覽器可以並行快取和載入的普通檔案。

資料 URI 可在任何接受 URL 的地方使用：img src、CSS 背景或 JSON 或電子郵件範本中的欄位。這使得它們可以方便地用於獨立的片段。

常見問題

我的圖片會上傳到伺服器嗎？

不會。圖片完全在瀏覽器中讀取，不會離開你的裝置。

什麼時候應該使用資料 URI？

適用於圖示等小型圖片，避免額外的網路請求值得增加的大小。對於大型圖片，使用普通檔案更好。

為什麼 Base64 比檔案更大？

Base64 編碼使用有限的文字字元集表示二進位資料，因此會增加約 33% 的開銷。