0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

【小ネタ・自分メモ】GitBashでローカルフォルダの画像をbase64に変換する方法

Posted at

base64とは

https://ja.wikipedia.org/wiki/Base64
Base64は、データを64種類の印字可能な英数字のみを用いて、それ以外の文字を扱うことの出来ない通信環境にてマルチバイト文字やバイナリデータを扱うためのエンコード方式です。
とWikipediaには書いてありますが、簡単に言うと「画像などをテキストデータに変えたもの」と理解しています。

なぜbase64に変換する必要があったか

今回は画像を外部のクラウドストレージに保存する処理を行うアプリのAPIにJSONでbase64の画像データを送りたいため、
ローカル内で「画像ファイル→base64」の変換を行う必要がありました。

画像のbase64変換手順

変換したい画像の用意

base64に変換したい画像をローカルのストレージ内に用意します。
ひとまず画像は何でもよいので適当に撮ったスクリーンショットを使いたいと思います。
今回は「base64image_from.PNG」という画像を「C:\base64test」のディレクトリに保存しました。
どのフォルダに保存したかだけメモしておいてください。
image.png
image.png

base64への変換とテキストデータへの保存

  • 保存場所へディレクトリ移動
    まずはGitBashでcdコマンドを使用し該当データのディレクトリに移動します。
    ※現在の場所から相対パスを使用してこの次の手順を行ってもOKです。
cd base64test/

image.png

  • 該当画像ファイルをbase64に変換
    catコマンドを使用し画像ファイルを指定し、base64への変換を行います。
    プロンプト画面にbase64に変換された文字列を表示させることできました。
    しかし、プロンプト画面出るだけでどこにも保存されないので少し使いずらいですね。
    また、自分が使用しているVScodeのターミナル画面では表示行数に限界があるため上のほうのテキストは消えてしまっています。
cat ./base64image_from.PNG | base64

image.png
image.png

  • 出力されたbase64のデータをテキストとして保存する
    プロンプト画面ではすべて表示しきれないため、先ほどのcatコマンドに追記して出力されたテキストを.txtファイルとして保存しなおしています。
cat ./base64image_from.PNG | base64 > ./base64iamge_to.txt

image.png
image.png

「base64image_to.txt」として保存することに成功しました。

改行の削除

上記のcatコマンドで画像をbase64変換し.txtファイルとして保存しなおすことはできましたが、
今度はデータの途中に大量の改行が入ってしまいました。
image.png
改行を抜いてテキストにするためのcatコマンドが以下になります。
こちらはtrコマンド(置換コマンド)を使用して改行文字「\n」を削除しています。

cat ./base64image_from.PNG | base64 | tr -d '\n' > ./base64iamge_to.txt

image.png
改行なしで.txtファイルにすることができました。

さいごに

今回はGitBashを使用して画像のbase64変換を行いました。
同様のコマンドをPowerShellでも試しましたが動作しませんでした。
PowerShellで行うには別の方法を調べる必要がありそうです。
また、コマンドを使用せずに変換を行う方法としてはWeb上で画像を登録するとbase64に変えてくれるようなサービスもありそうなので、
結果だけほしいときや外部に漏れても問題ない画像データの場合はそちらを使ってみてもよいかもしれません。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?