canvas を使う方法もあるようですが、パッケージを使った方が簡単そうだったので、試しに導入してみました。
画像ファイルを Base64 に変換する方法です。
今回使用したパッケージはこちらの「base64-img」です。
GitHub – douzi8/base64-img: convert img to base64, or convert base64 to img
https://github.com/douzi8/base64-img
画像を Base64 に変換できますし、その逆の Base64 を画像に変換することもできます。
さて、導入方法ですが、まずはパッケージをインストールします。
npm install base64-img --save
そうしたら、パッケージを require します。
const base64Img = require('base64-img');
あとは、実行したい関数を記述すればOKです。
私は画像を Base64 に変換したかったので、下記の関数を使用しました。
base64Img.base64('[変換したい画像パス]', function(err, data) {
// 行いたい処理
});
正常に処理が完了すれば、変数 data に変換後のデータが格納されるはずです。
が、私の環境では、下記のようなエラーが発生してしまいました。
Uncaught TypeError: a.readFile is not a function.
「a.readFile は関数ではありません」とのことですが…これってどこのことを指しているの？
現在、絶賛調査中です。
コードもとても単純になるので、出来ればこのパッケージを使えるようにしたいですね。
以上、画像をBase64に変換するためのパッケージ「base64-img」についての紹介でした。
なお、パッケージを使わずに、JavaScript で書きたい場合は、こちらの記事が参考になります。
[JavaScript] 画像変換：
要素 ⇔ Base64（相互変換） – Qiita
https://qiita.com/yasumodev/items/e1708f01ff87692185cd
