2019/01/24

ブログカードの実装

Blog

Freo

WordPress にはプラグインが豊富に合って「あれできないかな？」ということが大抵あるので便利は便利なんだけど、そのうちの一つに「ブログカード」がある。

まさしくこのようなやつで、はてなブログではリンクを挿入する際にブログカード形式が選べてこれが OGP を取得表示してくれて便利なわけです。そして WordPress にはこのようなブログカードを実装するプラグインとして、Pz-LinkCard というまさしくなプラグインがあり簡単に利用できる。

しかし Freo にはこのような機能はないので、今のところ他のエントリーでは HTMLでそれっぽいものを書いたり、上記のはてなブログカードを呼び出して使っています。

これでも別にいいのですがもっと便利にしようと思うと、リンクを自動的にブログカードに変換する機能を実装するということになる。

先の PZ-Link のような動作にするには各テンプレートが DBを呼び出して表示するときに特定の文字列があればそれを変換して表示するというフローになると思うのですが、そうすると Smarty修飾子プラグインで実装するのが一番早いのかしら？と考えました。

例えば

[blogcard url="https://801.std201.com/index.php/view/410"]

と書けば

こうなるようにする。

エントリーを解析して、上記の blogcard で始まる文字列を取得して、URLから OGPを取得して HTMLに展開するというフローなのでそれほど難しくはなさそう。

OGP を取得するためには自分でルーチンを書くという手もありますが、あるものは使うべきだと思うので opengraphライブラリを使うことにしてテストしてみたら日本語の文字化け。

調べてみるとHTML解析しているところが問題のようで下記の通り修正したら直りました。日本語を使っていると常に文字化けと隣り合わせなので辛いですよね。もう日本語を廃止すれば？と思う瞬間でもあります。

（追記）HTML-ENTITIES だけでは shift_JIS とかで書かれているサイトに対応できなかったので更に文字コード変換を追加した。

	static private function _parse($HTML) {
		$old_libxml_error = libxml_use_internal_errors(true);

		/* 日本語文字列処理 */
		$HTML = mb_convert_encoding($HTML, "UTF-8", "auto");
		$HTML = mb_convert_encoding($HTML,"HTML-ENTITIES","UTF-8");

で、一応このページはそのルーチンを使っているので先の [blogcard url=""] でブログカードに変換されます。

問題点

pixiv 等の特定 IPからの呼び出しを遮断しているサイトの場合、Smarty修飾子プラグインは PHPが実行しているサーバから実行されそのページにアクセスされるため、サーバがその特定 IPに該当すると OGPが取得できない。
Freo のフィルター機能を使用していると、フィルターしているページの OGPには当然アクセスできない。

以上2点になるが、1については何らかの事情で OGPが取得できなかったときははてなブログパーツ APIを呼び出してそれを使用することにする。これも何の問題解決にもなっていないが、はてなブログパーツ API が公開を停止しない限りはうまくいくので次善策としては問題ないかと思う。そもそもブログカードプラグインも favicon の取得にはてなブログAPIを使っているので……。
2については OGPを取得するルーチンを Cookie対応にすればいけるのかもしれないが、それも面倒なのでそういうブログカードを貼りたい場合は、フィルター機能についてに書かれている通り、「フィルター適用時のタイトル」と「フィルター適用時の本文」にそれぞれ [$title] と [$text] 入れてしまえばいいのではないかと思う。直接リンクされない限りフィルタは機能するわけだしそれでいいような気もする。

現在のところ、modifier.blogcard をこのサイトには適用しているのでブログカードを貼るのがものすごく楽になった。