[Rails]画像ファイルをbase64で送りimgタグで表示する

ここでは、HTMLのimgタグでファイルパスを指定するのではなく、base64エンコードした画像データを指定する方法、およびrailsでbase64エンコードして画像を送信するサンプルを掲示しています。

railsで画像ファイルをbase64エンコードして出力する

base_path = "/var/www/image"
file_name = "sample.jpeg"
# ファイルパスを組み立てる
# ここで、base_pathがURLとかにしてももちろん大丈夫V
file_path = File.join(base_path, file_name)

# ファイルオープン
f = File.open(file_path, "r")
# MIMEタイプを取得する（例：image/jpeg）
mime_type = Marcel::Magic.by_magic(f).type
# 画像ファイルをすべて読み込む
img = f.read
# 画像データをbase64エンコードする
base64_img = Base64.strict_encode64(img)
f.close

# レスポンスを作成する
rsp = {
    "sucess" => true,
    "data" => "data:" + mime_type + ";base64," + base64_img,
};

render json: rsp, status: :ok

HTML imgタグでbase64エンコードデータを表示する

<!-- ファイルパスを指定する場合 -->
<img src="test/sample.jpeg" />

<!--
  base64エンコードデータを指定する場合
 上記のレスポンスのdataをそのまま設定するイメージ
-->
<img src="data:image/jpeg;base64,/fJJ/kflksdkfhwnqk・・・・・" />

base64エンコードデータが正しいか検証する

src属性に設定したものをchrome（他はしらない）のURLバーに張り付けてエンターを押すと、画像データがブラウザに出力されます。しらなかった・・・・・・

追伸

ここ1年間ほどブログの更新をしていなかったため、ワードプレスでの投稿方法もどうやったらいいのかわからず四苦八苦です。さらに、ただでさえ雀の涙の広告収入もいつの間にやら激減してました。残念でなりません。レンタルサーバー代もでないようだとやめてしまおうかと悩む今日この頃です。