mono製InlineHtmlImagesでhtml+画像の複数ファイルを単一の画像埋め込みhtmlに変換する

npm の html-inline を試しましたが途中でコケてしまいます．

html-inline – npm 🏛️

mono製の InlineHtmlImages を試すとうまくいきました :)

Inline and Extract base64 images into/from HTML 🏛️

画像作成

$ convert pango:"<span font=\"/Library/Fonts/NotoColorEmoji\" size=\"24576\">😺</span>" cat.jpg

html作成

$ cat << __EOF__ > cat.html
> <html>
> <body>
> <img src="cat.jpg">
> </body>
> </html>
> __EOF__

画像埋め込み

$ mono ~/Downloads/inlinehtmlimages-mono.exe -in ./cat.html -out ./cat_inline.html

埋め込まれているのを確認

$ cat cat_inline.html
<html>
<body>
<img src="data:image/png;base64,
/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAAgGBgcGBQgHBwcJCQgKDBQNDAsLDBkSEw8UHRofHh0aHBwgJC4nICIsIxwcKDcpLDAxNDQ0Hyc5PTgyPC4zNDL/2wBDAQkJCQwLDBgNDRgyIRwhMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjL/wAARCAAmACgDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwD1jV/EEllqzWqSpEEUH5o9wYkZ554qS38TMSUktvNcDh4D8uffPT8zWX4p0xptegkwRFNH8x916/piokurKK5WxSeBZwuRBvG7HrjrXx+Kx+MoYqpGMtE9t9D2I0aEqMXbVo1P+EubZ5n2D5PM8v8A13Of++aluPErAhIrfymIyWnPH4Y6/mKwvsB8gR+YOJvMzj36U97qymuGsGnhacrkw7xvx6461zrOMbJNKX4L/IuWGw6asvzNbR/EEl7qotWlSUMpOVj27SPTnmiqHhXTWh1y4kPMcUeFPqW6foDRX0eT1KtTDKdV3bb+44MdGEKtqfZE3ifWbC01a2gurgQMsTcyqVQ5K9GI2np2NcUvhJp/GK6/Hfxvas4mAXlicYwD0x/Tiuv8aR3E06Q219dvcld0Vja2ysxHQszsCFH1wOK871K58QaJDBe2NpHdxhNlxZyZYoQThgU2noeQO46Vw46hUhipSpyUXUVtdtvTTY1oNTpK6b5ex0Qudd/4TQ2P2i3/ALO8vz8bPm2dNvrnP+e1Uh4SNt4xfX5b9FtQ5mKtwwJGME9Mc/0rHbxlqAt/tY8LWf2jZt/4/wBy+OuNuc/hmpdLn1/V7W5vb+2jtxKgS3s4wVz8wJY79xzxgZ/SuSWGq4ePMpxSa5Xbrf5fidDjzNKUJX3V1Y9J8L6zYXeqXUFrcCcmNDuiUsgwWzlgNo6jvRUPgyO4hlkguL66W5C7prG6tkRlHRWV1ADD3GRzRX0WAoeww8ab6f538jy68+eo2drWTf6BZag5kZWilPWSM4J+o6GiiuirRp1Y8tRXREKkqbvB2Zl/8IXF5m77Yf8Av0M/nmtWw0Gy09xIitJKOkkhyR9OwoornpZfhqUuaENfv/M2ni61RWlLQ1aKKK7DnP/Z" alt='cat.jpg' >
</body>
</html>

画像ファイルを削除しておく

$ rm ./cat.jpg

ウェブブラウザで確認

$ xdg-open ./cat_inline.html

20190811 02 08 14 32387

他にもLinuxネイテイブなものがありそうな気がします．(shell script + base64 コマンドでも多分行ける?)

環境

$ mono ~/Downloads/inlinehtmlimages-mono.exe -help|head -6|uniq

InlineHtmlImages v1.7
 Build:  3/31/2018
 Author: Dennis Lang
 Web:    home.comcast.net/~lang.dennis
$ dpkg-query -W mono-runtime chromium imagemagick libpango-1.0-0
chromium        76.0.3809.100-1
imagemagick     8:6.9.10.23+dfsg-2.1
libpango-1.0-0:amd64    1.42.4-7
libpango-1.0-0:i386     1.42.4-7
mono-runtime    5.18.0.240+dfsg-3
$ lsb_release -dr
Description:    Debian GNU/Linux bullseye/sid
Release:        unstable
$ uname -m
x86_64

mono製InlineHtmlImagesでhtml+画像の複数ファイルを単一の画像埋め込みhtmlに変換する

コメントを残すコメントをキャンセル

プロフィール

あなたのプロフィール

コメントを残す コメントをキャンセル

コメントを残すコメントをキャンセル