WordPressのバージョン4.4が１２月の中頃にリリースされた。新しいデフォルトテーマ「TwentySixteen」やsrcsetを用いたレスポンシブ画像など興味深い新機能があるが、なかでも、より強化されたoembedでの埋め込み機能が面白い。
今ままでoembedはYouTubeやTwitterなど限られたoembedプロバイダに制限されていたが、WordPress 4.4からは全てのプロバイダが（制限付きで）対象になる。さらに、WordPress自身がoembedのプロバイダの役割も果たすようになる。つまり、WordPressを使っている世界中のウェブサイトが相互にブログカードを表示できるようになったのだ。
美しく、使いやすいブログカード
上がja.wordpress.orgの記事を埋め込んだ結果だ。恐らくWordPressのデフォルトデザインのブログカードだと思うが、シンプルで見やすく、シェアボタンも主張しすぎていない。★だの、○○ usersだの無い分、はてなブログのものより使いやすそうだ。
ホワイトリスト内のプロバイダとの違い
先頭で「制限付き」と書いたが、WordPress 4.4ではoembedはホワイトリスト内のプロバイダとそれ以外で区別される。ホワイトリスト内のoembedプロバイダとはハードコードされたプロバイダ及び、ユーザーが定義したプロバイダのことで、プロバイダが指示したhtmlがそのままドキュメントに挿入されてコンテンツが埋め込まれる。JavaScriptなども挿入されうるので「信頼済み」のプロバイダに限定されるわけだ。一方、「その他」のプロバイダではサニタイズされたiframeのみ、htmlが許可される。コンテンツはインラインフレーム内で表示されるのでクロスサイトスクリプティングのリスクが減少するわけだ。
ただ、ホワイトリストにプロバイダが登録されていなくても、oembedを使わず、そのサイトで提供されている埋め込みコードを貼り付ければそれで終わりなのだが。
WordPress以外のoembedを利用する
今回、WordPressにoembedのプロバイダ機能が追加されたわけだが、別に、埋め込みコードがiframeであればWordPress以外のどんなoembedでも利用できる。例として次のようなデモを用意した。
<!DOCTYPE html>
<html>
<head>
<link rel="alternate" type="application/json+oembed" href="https://aquei.github.io/junk/demo/blog/2015/12/wordpress-4.4-oembed/oembed.json" title="oembedのテスト">
</head>
<body>
テスト、テスト。<a href="https://blog.srytk.com/aquei/feed">フィード</a>を登録するのを忘れずに！
</body>
</html>{
"type": "rich",
"version": "1.0",
"html":"<iframe src=\"https://aquei.github.io/junk/demo/blog/2015/12/wordpress-4.4-oembed/test.html\"></iframe>",
"width": "250",
"height": "100"
}URL(https://aquei.github.io/junk/demo/blog/2015/12/wordpress-4.4-oembed/test.html)をエディタに貼り付けると次のようにoembedが利用できる。
このように、手軽に埋め込みを用意・利用できる。oembedはイマイチ陽の目を浴びていない感があったが、WordPressがサポートを開始したことで普及することが期待される。
デメリット・問題
oembedや埋め込み用ページはリッチなリンクとして時代に合った機能だとは思うが、やはり問題もありそうだ。デメリットとして思いついたもの、見つけたものを列挙する。
ウェブサイトへの負荷
Yahoo! JapanのトピックスなどからリンクされることをYahoo砲などと言ったりする。短期間に大量のトラフィックが押し寄せ、サイトの反応時間が伸びるなどその影響は絶大だ。
ところで通常のリンクであればYahooトピックスの閲覧者が全てリンクを辿って自サイトを訪れるわけではない。せいぜい数パーセントだろう。だが、もしYahooトピックスが埋め込みを利用してリンクしたなら、Yahooトピックス閲覧者のほぼ100%から自サイトのサーバーへリクエストが飛ぶことになる。碌に対策をしていないWordPressサイトなら負荷に耐え切れず一瞬で終わりだ。そして重量課金制のホスティングなら大金が請求されるかもしれない。これは怖い。
Yahooトピックスなどがすぐに埋め込みを利用し始めるとは思わないが、2chまとめブログなどはウェブページのキャプチャを利用することも多い。埋め込みやoembedが普及し始めれば負荷は確実に上がるだろう。
ページロード時間の増加
通常のリンクであればロード時間への影響はほぼ皆無であるが、インラインフレーム(iframe)ではコンテンツを表示する分ロード時間が伸びることになる。すなわち、DNSで名前解決・サーバーへ接続・ファイルをダウンロード・DOMを作ってスタイリング・描画という工程を経てようやく表示される。これらは数秒かかることもザラで、しかもメインのページを表示するためのリソースを奪い合う。
セキュリティの懸念
挿入されるインラインフレームにはsandbox属性にallow-scriptsがセットされる。そのため、フォームや新しいウィンドウなどは無効となるが、埋め込みコンテンツとして音を鳴らしたり画像を表示したりできる。また埋め込み元と同じようなデザインにして不正なウェブサイトに誘導するようなメッセージを表示したりもできる。
埋め込みコンテンツはテキストリンクと異なり、自サイトの一部スペースを貸し出すことになるため、通常のリンクより慎重にならなければならない。
HTTPSなサイトでは使いづらい
https上のページでは、iframeのsrcもhttpsでなければならない。つまり、埋め込みコンテンツがhttpでしか提供されていない場合、httpsなページからはoembedも埋め込みも利用できない。HTTPS Everywhereと言われて久しいが、国内のウェブサイトのほとんどは未だhttpで配信されているのが現実であり利便性が大きく下がる。例えば、はてなブログは標準でoembedでの埋め込みコードを提供しているが、出力されるコードはhttpのみである（これを書いている現在）。
WordPressの埋め込み機能を無効にするのがプラグインだのみ
WordPressのoembedプロバイダはコア機能であり、デフォルトで有効になっている。ダッシュボードの設定でオン・オフを切り替えたりは今のところできないようだ。しかもembed機能を使うかどうかに関わらず、「wp-embed.min.js」がフッタに出力される。
埋め込み機能をオフにするにはプラグイン「Disable Embeds」を使うのが現実的な方法だが、なんとも面倒くさい。oembedプロバイダなど上級向けの機能はオプションで有効にするオプトイン形式にしたほうがよさそうだが・・・。
どのサイトがoembedに対応しているのかわからない
oembedや埋め込みは便利な機能だが、全てのサイトが対応しているわけではない。はてなブログやwordpress.comなどドメインでプラットフォームが分かる場合はいいが、独自ドメインだとURLを一見して対応しているかがわからない(しかもwordpress.comのブログ全てが対応しているわけでもない！)。現状では実際に編集画面に貼り付けるか、htmlのソースを検索するしかない。これはかなり不便だ。かと言って、ブラウザアドオンを導入するほどでもない。とりあえず、全てのWordPressサイトがさっさと4.4以上にアップデートしてくれたらいいのだが。
結論
WordPress 4.4の埋め込み機能は面白いが、時期尚早か。ただ、普通のテキストリンクより目立ってトラフィックが増えるのは間違いないので、アクセス命のバイラルメディアとかは対応しておいたほうが良さそうだ。ちなみにこのブログはプリティパーマリンクの関係か/wp-json/が404を返すので今のところ埋め込めない。REST APIとはなんだったのか。
そういえば、oembedのホワイトリストにredditのコメントが追加された。地味に便利だ。