Google Photosやはてなフォトライフなどの画像管理サービスでは、公式にはパーマリンクは提供されていない。しかし、画像のURL自体は、永続性が保証されていないとはいえ、取得できる。ならば、そのURLを埋め込んでブログを書いてしまってから、後の適当なタイミングで埋め込んだ画像を自鯖にダウンロードしてURLを書き換えてしまえばよさそうだ。それを自動化して簡単にできるようにした。
各社の画像管理サービスではパーマリンク（永続リンク）を公開しないことが多い。配信サーバの仕様を変えにくくなるし、単にデータ置き場として使われても費用だけ嵩んで利益にならないので、パーマリンクの提供はデメリットの方が大きいのだろう。しかし、画像がブラウザ上で表示できる以上、画像データにはURLが必ずつく。Google Photosとはてなブログでは、表示した画像を右クリックして「画像のアドレスをコピー」すればそのURLが取得でき、少なくともしばらくの間はそのURLをブラウザにペーストすると同じ画像が取得できるようになっている。Flickrとかは画像の上に透明divを置くなどしてガードしているが、ブラウザのdeveloper toolでネットワーク転送を見ればURLがわかる。
永続的とは言えないかもしれないが当面の間は有効なURLが手に入ったなら、それを埋め込んでブログ記事を書くことができる。しかし、その状態で長期間運用するのはまずい。URLが変わるとリンク切れになって画像が表示されなくなってしまうからだ。よって、適当なタイミングで、埋め込んだ画像を自鯖にダウンロードした上で、URLを自鯖のものに書き換えることにする。その作業を手動でやるのは面倒でやっていられないが、自動化すれば、特に手間ではない。
この方法の利点は、ブログに張り込む一部のデータだけを自鯖に複製するので、自鯖のストレージの容量は大して圧迫しないということだ。しかも画像の元データではなくWeb配信用の小さめなデータが得られるので、ストレージ容量の面でも転送量の面でもブログなどに貼るのにうってつけだ。また、記事を執筆している途中で一枚一枚の画像を自鯖にアップロードする面倒が省けるので、執筆作業が効率化する。特に写真主体の記事を書く場合にその効果は大きい。各種サービスのシェア機能を使ってブログに張り込むことも可能ではあるが、右クリックでURLを取得した方が遥かに楽だし、デザイン上の制約もかからない。
ということで、自作CMSであるBikiBikiBobにその機能をつけてみた。その使い方を説明する。似たような機能を作りたい人にも参考になるかもしれない。
記事を書く際には、端末なりブラウザなりで作業を行うが、それとは別に画像管理サービスのページをブラウザで開いておく。Google Photosの場合、画像のURLを取得するには一手間かかる。まずは埋め込みたい画像を選んで表示して、そのシェアボタンを押す。
そうすると出てくるダイアログで、「Create link」を選ぶと、シェア用のリンクが作られるので、それをクリックする。
行った先のページで、画像をまた選んで大きく表示してから、その画像を右クリックしてブラウザの機能で「Copy Image Address」を選ぶ。要点は、シェアした画像じゃないと外からアクセスできないということだ。ブログに張り込みたい画像を予め複数枚選んでシェアしてしまえば、Copy linkの作業は一回で済む。
そうして得られたURLを埋め込んだ記事の内容は以下のようになるだろう。
@title プレーパーク @date 2024/05/30 今日は近所の公園のプレーパークに行ってきた。やっぱり焚き火は楽しいなー。 @image https://lh3.googleusercontent.com/pw/AP1GczPXkFDl2tn0tmYFCRX4hjTCEr9unHqVfK_0qqbJ0FVa_IUwmgd6IxEZdeLlYphn9RsI1c8iVUCOnTNUlVcJl2KXBP6clmXvKMSWXMtXOkai8UV9J8vnrnBML62rP_2SrUGViTKgDJ0l-OKj0HnrRsX3SA=w1950-h1462-s-no-gm?authuser=0
これでHTMLを書き出してブラウザでアクセスすると、以下のようにちゃんと画像が表示される。
はてなフォトライフの場合はもっと簡単で、普通に該当の写真を表示して、その画像を右クリックして「Copy Image Address」を選べば良い。
それを貼り付ければ、やはり普通に表示できる。
埋め込んだURLの永続性は全く保証されていないので、いつ画像が表示されなくなるかわからない。実際には月単位でそのままでも大丈夫なのだが、いつまで大丈夫なのかを確認するのが面倒だ。よって、記事が完成してプレビューが済んだら、さっさと画像を取り込んでしまった方が良い。それには、以下のコマンドを実行する。つまり通常の運用で使うHTML生成コマンドに "--hoard" オプションが加わっただけだ。
$ bbb_generate.py --conf input/bbb.conf --hoard 20240530.art
設定ファイルには、あらかじめ対応サービスのデータ置き場のパターンマッチとデータの保存先と保存したデータに与えられるURLの接頭辞を書いておく。
hoard_target_url: ^https://[^/]+\.googleusercontent\.com/ hoard_target_url: ^https://[^/]+\.staticflickr\.com/ hoard_target_url: ^https://[^/]+\.st-hatena\.com/ hoard_local_url: https://dbmx.net/bikibikibob/myblog/data/ hoard_data_dir: /home/mikio/myblog/data
そうすると、指定した記事の内容を解析して、@imageや@videoで埋め込んだURLのデータを自鯖にダウンロードして保存した上で、URLを自鯖のものに書き換えてくれる。上述の記事は以下のようになるだろう。HTMLの再生成も自動的に行われる。
@title プレーパーク @date 2024/05/30 今日は近所の公園のプレーパークに行ってきた。やっぱり焚き火は楽しいなー。 @image https://dbmx.net/bikibikibob/bikibikibob/myblog/data/20240530-0001.jpg
これで、画像は同じように表示される一方で、データは自鯖から配信されるようになる。この手順は一見面倒なようだが、私が試した中では最も楽な方法だ。管理用のWeb UIからも呼び出せるので、工程を今までと全く変えずに、単に外部URLの画像や動画が張り込めるようになったという使用感になる。記事が完成したら、「Hoard Embeds」にチェックを入れて保存すれば、外部データの取り込みと保存と記事の書き換えを一気にやってくれる。
取り込んだデータはWeb UIで一覧できるし、削除等の管理もできる。
外部データの取り込み機能はまじで便利だ。写真主体の記事の場合、記事の執筆にかかる時間が半減するんじゃないかな。だって、任意のサービスに保存した写真をを見ながら思い出したことを書いてURLを貼り付けるだけでいいのだから。なお、私はGoogle Photosに加えて自作の写真管理システムを使っていて、それは16ビットTIFFをアップロードすると12ビットのJPEG2000に変換して保持した上でWeb閲覧用のJPEGを自動輝度補正とHDR処理の上で生成するという変態的なシステムなのだが、それと連携するのも同じ方法でできる。
まとめ。パーマリンクがない画像でも、取り込んで自鯖から配信するように変換する機能があれば、ブログに埋め込んで記事を執筆することが可能になる。このような「いつ無効になるか分からない他社サービスのURLを執筆に使い、そのデータを取り込んで配信する」という割り切りは、大手のブログサービスにはできまい。自作した甲斐があった。
