😼Base64:画像↔テキスト2025年04月11日 03:03

Base64:画像↔テキスト
Base64:画像↔テキスト


(画像Base64 エンコード)
https://web-toolbox.dev/tools/base64-encode-image

スマホ衛星通信の記事で、テキストベースの情報しかやり取りできない風情だったので、んじゃあバイナリーデータをテキストに変換すればいいじゃんという発想になった(たんじゅん・・・)。

まあ、1と0だって立派なテキストだから、そのまま送ってもいいんだろうけど、メールの添付ファイルなどではBase64でアスキー文字列に変換してから復号しているようだ(未調査:ホームページの送信にも使われているようです:後述)。

で、実際のところ、どうなるかに興味があったので、上記のページを見つけて試してみた。

作成した元画像は、ウィンPCにオマケで付いているペイントで作成した(PNG画像:アサブロの添付ファイルもPNGに変換されるからな)。

ファイルサイズは4KBと極小だ(画像参照)。

これを、上記のページにあるツールに放り込んで変換するとこうなる(Rawデータ)。

「iVBORw0KGgoAAAANSUhEUgAAAJsAAACbCAYAAAB1YemMAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAKPSURBVHhe7dIhDgNADAPB+/+nW14ea6XOSCZBAfs+MPJ+D3BFbMyIjRmxMSM2ZsTGjNiYERszYmNGbMyIjRmxMSM2ZsTGjNiYERszYmNGbMyIjRmxMSM2ZsTGjNiYERszYmNGbMyIjRmxMSM2ZsTGjNiYERszYmNGbMyIjRmxMSM2ZsTGjNiYERszYmNGbMyIjRmxMSM2ZsTGjNiYERszYmMmE9t7zw5X0PhCbOcraHwhtvMVNL4Q2/kKGl+I7XwFjS/Edr6CxhdiO19B4wuxna+g8YXYzlfQ+EJs5ytofCG28xU0vhDb+QoaX4jtfAWNL8R2voLGF2I7X0HjC7Gdr6DxhdjOV9D4QmznK2h8IbbzFTS+ENv5ChpfiO18BY0vxHa+gsYXYjtfQeMLsZ2voPGF2M5X0PhCbOcraHwhtvMVNL4Q2/kKGl+I7XwFjS/Edr6CxhdiO19B4wuxna+g8YXYzlfQ+EJs5ytofCG28xU0vhDb+QoaX4jtfAWNL8R2voLGF2I7X0HjC7Gdr6DxhdjOV9D4QmznK2h8IbbzFTS+ENv5ChpfiO18BY0vxHa+gsYXYjtfQeMLsZ2voPGF2M5X0PhCbOcraHwhtvMVNL4Q2/kKGl+I7XwFjS/Edr6CxhdiO19B4wuxna+g8YXYzlfQ+EJs5ytofCG28xU0vhDb+QoaX4jtfAWNL8R2voLGF2I7X0HjC7Gdr6DxhdjOV9D4QmznK2h8wV8QGzNiY0ZszIiNGbExIzZmxMaM2JgRGzNiY0ZszIiNGbExIzZmxMaM2JgRGzNiY0ZszIiNGbExIzZmxMaM2JgRGzNiY0ZszIiNGbExIzZmxMaM2JgRGzNiY0ZszIiNGbExIzZmvsO0MptuhLlRAAAAAElFTkSuQmCC」

ワケワカ・・・。

「変換処理はブラウザ上で完結するため画像はサーバーへアップロードされず、高速・安全に利用できます。」

まあ、どうでもいいんですが。

このままでは、何にも使えない(そうなのかあ?:文字列を眺めていると図形が見えてくるとかは、・・・ない!)。

で、ページの下の方に「画像Base64 デコード」のページへのリンクがあったので、これを開いてみる。

(画像Base64 デコード)
https://web-toolbox.dev/tools/base64-decode-image

「Base64文字列から画像データへデコードします。」

で、実際に、上記のテキストをコピペして貼り付けたんだが失敗する。

えーっ、なんでやあ!?。

「画像Base64 デコードツールの使い方:
・・・
注意:変換対象のBase64文字列には先頭にData-URL宣言が必要です(例:data:image/png;base64,)」

RTFM(リードザフレンドリーマニュアル)・・・。

で、言われたとおりに「data:image/png;base64,」を先頭に貼り付けたら上手くPNG画像が現れた。

やれやれ・・・。

まあいい。

何となくイメージが掴めればいいのだ。

画像をテキストに変換し、再び画像に戻せることは確認した(インチキなしで!)。

ところで、「Data-URL宣言」って、何よ?。

(Data URI scheme)
https://ja.wikipedia.org/wiki/Data_URI_scheme

「あたかも外部リソースを読み込むのと同じように、ウェブページにインラインにデータを埋めこむ手段を提供するURIスキームである。」

「この技術を利用することで、通常は別のデータに分かれている画像やスタイルシートなどの要素を、1つのHTTPリクエストによって読み込むことが可能になる。これにより、HTTPリクエスト数が削減され、データの転送効率が改善される可能性がある。」

「構文は、以下の通りである。
data:[<MIME-type>][;charset=<encoding>][;base64],<data>」

URLじゃなくって、URIなのかあ?。

(Uniform Resource Identifier)
https://ja.wikipedia.org/wiki/Uniform_Resource_Identifier

「URI はUniform Resource Locator (URL) の考え方を拡張したものである。」

ははあ、それで変換ページでは「Data-URL宣言」といってるわけだ。

なーる(ほど!)。

「2001年、W3CはRFC 3305内で、上記の考え方を古典的な見解とした。ここで示されたW3Cの新たな考え方により、従来のURLとURNとはすべてURIと呼ばれることになった。」

インターネットの世界は日進月歩だな・・・。

<以下追加>ーーーーーーーーーー

(画像 バイナリ 変換)
https://colorcodesearch.com/binary/

このページ、コピペ出来ないので作業だけ書く。

「100010010101000001001110010001110000110100001010000110100000101000000000000000000000000000001101010010010100100001000100010100100000000000000000000000001001101100000000000000000000000010011011000010000000011000000000000000000000000001110101011000011110100110001100000000000000000000000000000000010111001101010010010001110100001000000000101011101100111000011100111010010000000000000000000000000000010001100111010000010100110101000001000000000000000010110001100011110000101111111100011000010000010100000000000000000000000000001001011100000100100001011001011100110000000000000000000011101100001100000000000000000000111011000011000000011100011101101111101010000110010000000000000000000000001010001111010010010100010001000001010101000111100001011110111011011101001000100001000011100000001101000000000011000000001111000001111110111111111110100111010110110101111000011110011010111010010111001110010010000010011001000001000000011111101100111110001100001111001001111110000011110111000001000101011011001100110010001000100011010001100110110001001100010010001100110110011001101100010011000110100011001101100010011000000100010001101100110011011000100110001101000110011011001100110010001000100011010001100110110001001100010010001100110110011001101100010011000110100011001101100010011000000100010001101100110011011000100110001101000110011011001100110010001000100011010001100110110001001100010010001100110110011001101100010011000110100011001101100010011000000100010001101100110011011000100110001101000110011011001100110010001000100011010001100110110001001100010010001100110110011001101100010011000110100011001101100010011000000100010001101100110011011000100110001101000110011011001100110010001000100011010001100110110001001100010010001100110110011001101100010011000110100011001101100010011000000100010001101100110011011000100110001101000110011011001100110010001000100011010001100110110001001100010010001100110110011001101100010011000110100011001101100010011000000100010001101100110011011000100110001100100110000100111101101101111011110011110000111001010111110100001111100001000010011011001110011100101011011010000111110000100001101101101111001100010101001101001011111000010000110110111111100100001010000110100101111110001000111011010111110000000101100011010010111111000100011101101011111010000010110001100001011101100010001110110101111101000001111000110000101110110001100111011010111110100000111100011000010111011000110011100101011111010000111110000100001001101100111001110010101101101000011111000010000110110110111100110001010100110100101111100001000011011011111110010000101000011010010111111000100011101101011111000000010110001101001011111100010001110110101111101000001011000110000101110110001000111011010111110100000111100011000010111011000110011101101011111010000011110001100001011101100011001110010101111101000011111000010000100110110011100111001010110110100001111100001000011011011011110011000101010011010010111110000100001101101111111001000010100001101001011111100010001110110101111100000001011000110100101111110001000111011010111110100000101100011000010111011000100011101101011111010000011110001100001011101100011001110110101111101000001111000110000101110110001100111001010111110100001111100001000010011011001110011100101011011010000111110000100001101101101111001100010101001101001011111000010000110110111111100100001010000110100101111110001000111011010111110000000101100011010010111111000100011101101011111010000010110001100001011101100010001110110101111101000001111000110000101110110001100111011010111110100000111100011000010111011000110011100101011111010000111110000100001001101100111001110010101101101000011111000010000110110110111100110001010100110100101111100001000011011011111110010000101000011010010111111000100011101101011111000000010110001101001011111100010001110110101111101000001011000110000101110110001000111011010111110100000111100011000010111011000110011101101011111010000011110001100001011101100011001110010101111101000011111000010000100110110011100111001010110110100001111100001000011011011011110011000101010011010010111110000100001101101111111001000010100001101001011111100010001110110101111100000001011000110100101111110001000111011010111110100000101100011000010111011000100011101101011111010000011110001100001011101100011001110110101111101000001111000110000101110110001100111001010111110100001111100001000010011011001110011100101011011010000111110000100001101101101111001100010101001101001011111000010000110110111111100100001010000110100101111110001000111011010111110000000101100011010010111111000100011101101011111010000010110001100001011101100010001110110101111101000001111000110000101110110001100111011010111110100000111100011000010111011000110011100101011111010000111110000100001001101100111001110010101101101000011111000010000110110110111100110001010100110100101111100001000011011011111110010000101000011010010111111000100011101101011111000000010110001101001011111100010001110110101111101000001011000110000101110110001000111011010111110100000111100011000010111011000110011101101011111010000011110001100001011101100011001110010101111101000011111000010000100110110011100111001010110110100001111100110000010101111100010000000110110011001101100010011000110100011001101100110011001000100010001101000110011011000100110001001000110011011001100110110001001100011010001100110110001001100000010001000110110011001101100010011000110100011001101100110011001000100010001101000110011011000100110001001000110011011001100110110001001100011010001100110110001001100000010001000110110011001101100010011000110100011001101100110011001000100010001101000110011011000100110001001000110011011001100110110001001100011010001100110110001001100000010001000110110011001101100010011000110100011001101100110011001000100010001101000110011011000100110001001000110011011001100110110001001100011010001100110110001001100000010001000110110011001101100010011000110100011001101100110011001000100010001101000110011011000100110001001000110011011001100110101111101100001110110100001100101001101101101110100001001011100101010001000000000000000000000000000000000100100101000101010011100100010010101110010000100110000010000010」

Base64もワケワカだが、これこそ究極のワケワカだ。

(Base64)
https://ja.wikipedia.org/wiki/Base64

対応表が載っているので、最初のところだけ見てみる(6つずつの区切り)。

100010→i
010101→V
000001→B
・・・

延々とやってもいいんだが、疲れそうなのでやめる。

要するに、画像はバイナリデータだが、Base64の文字列として扱うルールが確立されている。

だからどーしたということなわけだが、メールに画像を添付する際には、頭の片隅に入れておきたいもんだな・・・。

😼ジャンクライフ:HTTPサーバー実戦投入(第2弾)2025年04月11日 22:43

ジャンクライフ:HTTPサーバー実戦投入(第2弾)
ジャンクライフ:HTTPサーバー実戦投入(第2弾)


今日は、先日のダイビングで袖没したシェルドライの修理(漏れ箇所の確認)で、自転車の荷台にメッシュに入れたドライスーツを積んで大井町へ。

左手首のシリコンにピンホールがあって、そこから漏れていたことが判明した。

やれやれ・・・。

サイテックのリストシールは交換可能な仕様にしてもらっているので、早速注文。

が、まあ、そっちは表向きの用事で、浮沈子的メインな用件は例によって標記のHTTPファイルサーバーでのミッションだ。

今回は京セラのKYV44にサーバーを入れ、Wi-Fiテザリングでインターネット無しの接続でアイフォーンから入ってもらった。

QRコードを読み込んでタップしてもらうと、ちゃあーんとトップページが表示される。

で、いよいよここからが緊張の一瞬。

テキトーなJPEG画像を選んでアップロードしてもらったら、京セラのサーバー機に無事に転送された。

やれやれ・・・。

柏崎さんからは、アイフォーンでもこういう仕掛けはないのかと聞かれるが、想定していなかったので即答は出来なかった。

ご本人も、アンドロイドスマホとのファイル交換に苦労しているようだ。

iOSでもHTTPサーバーは立てられるだろうから(元々、BSDユニックスだからな)、調べればザクザク出てくるだろう(未確認)。

(iOS)
https://ja.wikipedia.org/wiki/IOS

「BSD系UNIXから開発されたNeXTのOPENSTEPを起源とするMacintosh専用のmacOSをモバイル機器用途に改変したものである。」

スティーブジョブズの魂が、掌の中で動いているのだ。

まあ、どうでもいいんですが。

山奥で突然出会ったアイフォーンとアンドロイドユーザーが画像ファイルを交換するという状況は、無事にクリアされた。

ミッションコンプリート!。

が、パラオへはKYV44じゃなく、ギャラクシーA21を持って行く(税込み3000円のジャンクだし:京セラのは6000円以上したからな:ジャンクじゃないし)。

ホテルではWi-Fiくらい繋がるだろうから、同じネットワーク内での転送が可能だ。

最悪、転送しなければならないQRコードをカメラで写すという手もある(そんなあ!)。

まあいい。

今日は、シェアウォーターのペレグリンもゲットした。

まだ箱(ファスナー付きの立派なケース)から出していないけど、少し弄ってから記事にする予定だ。

この他にも、マレスのクアトロプラスのストラップを2セット発注(獅子浜で同時に2本切れたからな)。

浮沈子は、色違い(白と黒)で2組持ってるから、予備も2本必要だ(同時に切れるかよ・・・)。

ゴムバンジーで自作するのが正解なんだろうけど、手間を惜しんで金を掛ける(トホホ・・・)。

何はともあれ、HTTPサーバーでファイル転送が無事に行えたことが良かった。

ホッとした。

そーか、アイフォーン側で同じことをやってもらえれば、アンドロイドユーザーもメリットを享受できるわけだ。

が、浮沈子は持ってないからな。

簡単にインストール出来て、使いやすいアイフォーン用のHTTPサーバーってないのかな・・・。

<以下追加:4月12日記>ーーーーーーーーーー

画像を見ていて改めて気付いたんだが、このサーバーのホームページのデザインは、ギャラクシーA21スマホの画面(1560×720)の縦横比に最適化されているようだ。

京セラKYV44(1920×1080)では、はみ出しちまうからな(スライドさせないと、QRコードが読めません)。

まあ、どうでもいいんですが。

縦横比を調整できるのかどうかは知らない。

ウクライナ製だからな。

京セラは売ってないんだろう・・・。