JavaScript如何獲取base64圖片大小

這篇文章將為大家詳細(xì)講解有關(guān)JavaScript如何獲取base64圖片大小，小編覺得挺實用的，因此分享給大家做個參考，希望大家閱讀完這篇文章后可以有所收獲。

JavaScript有什么特點(diǎn)

1、js屬于一種解釋性腳本語言；2、在絕大多數(shù)瀏覽器的支持下，js可以在多種平臺下運(yùn)行，擁有著跨平臺特性；3、js屬于一種弱類型腳本語言，對使用的數(shù)據(jù)類型未做出嚴(yán)格的要求，能夠進(jìn)行類型轉(zhuǎn)換，簡單又容易上手；4、js語言安全性高，只能通過瀏覽器實現(xiàn)信息瀏覽或動態(tài)交互，從而有效地防止數(shù)據(jù)的丟失；5、基于對象的腳本語言，js不僅可以創(chuàng)建對象，也能使用現(xiàn)有的對象。

base64原理

Base64編碼要求把3個8位字節(jié)（38=24）轉(zhuǎn)化為4個6位的字節(jié)（46=24），之后在6位的前面補(bǔ)兩個0，形成8位一個字節(jié)的形式。 如果剩下的字符不足3個字節(jié)，則用0填充，輸出字符使用'='，因此編碼后輸出的文本末尾可能會出現(xiàn)1或2個'='

如何獲取base64圖片大小

通過base64編碼原理我們知道，base64的圖片字符流中的每8個字符就有兩個是用0補(bǔ)充，而且字符流的末尾還可能存在‘='號，我們可以通過這個原理計算圖片的文件流大小。

getImgByteSize(data) {
  if (data.graphicContents) { // 獲取base64圖片byte大小
   const equalIndex = data.graphicContents.indexOf('='); // 獲取=號下標(biāo)
   if (equalIndex > 0) {
    const str = data.graphicContents.substring(0, equalIndex); // 去除=號
    const strLength = str.length;
    const fileLength = strLength - (strLength / 8) * 2; // 真實的圖片byte大小
    data.size = Math.floor(fileLength); // 向下取整
   } else {
    const strLength = data.graphicContents.length;
    const fileLength = strLength - (strLength / 8) * 2;
    data.size = Math.floor(fileLength); // 向下取整
   }
  } else {
   data.size = null;
  }
 }

data.graphicContents是后端獲取的base64圖片的字符串。

關(guān)于“JavaScript如何獲取base64圖片大小”這篇文章就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，使各位可以學(xué)到更多知識，如果覺得文章不錯，請把它分享出去讓更多的人看到。