Nodejs進階:如何將圖片轉成datauri嵌入到網頁中去

adea1332 8年前發布 | 8K 次閱讀 Node.js Node.js 開發

問題:將圖片轉成datauri

今天,在QQ群有個群友問了個問題:“nodejs讀取圖片,轉成base64,怎么讀取呢?” 想了一下,他想問的應該是 怎么樣把圖片嵌入到網頁中去,即如何把圖片轉成對應的 datauri。

是個不錯的問題,而且也是個很常用的功能。快速實現了個簡單的demo,這里順便記錄一下。

實現思路

思路很直觀:1、讀取圖片二進制數據 -> 2、轉成base64字符串 -> 3、轉成datauri。

關于base64的介紹,可以參考阮一峰老師的 文章 。而 datauri 的格式如下

data:[ ][;base64],

具體到png圖片,大概如下,其中 “xxx” 就是前面的base64字符串了。接下來,我們看下在nodejs里該如何實現

data: image/png;base64, xxx

具體實現

首先,讀取本地圖片二進制數據。

var fs = require('fs');
var filepath = './1.png';

var bData = fs.readFileSync(filepath);</code></pre>

然后,將二進制數據轉換成base64編碼的字符串。

var base64Str = bData.toString('base64');

最后,轉換成datauri的格式。

var datauri = 'data:image/png;base64,' + base64Str;

完整例子代碼如下,代碼非常少:

 

來自:http://www.cnblogs.com/chyingp/p/node-learning-guide-img-base64-datauri.html

 

 本文由用戶 adea1332 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
 轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!