GoogleがAMPページからオリジナルのURLを表示＆コピーして共有できる新機能を追加

Googleはスマートフォンやタブレットでウェブページに従来の4倍の速度でアクセスできる「AMP(Accelerated Mobile Pages)」を提供しています。モバイル版Google検索では、検索ワードに関連するAMP対応のウェブページが表示されるのですが、AMPで表示されたページにはオリジナルのドメインとは異なるURLが付与されます。この仕組みが読者の混乱を招いたり、読んでいるオリジナルのURLをコピーできないという問題があったのですが、AMPのURL問題を改善する新機能が追加されたことについて、Google Developers Blogで解説されています。

Google Developers Blog: What’s in an AMP URL?
https://developers.googleblog.com/2017/02/whats-in-amp-url.html

2017年2月6日からAMP対応ページに新機能が追加され、AMPページのヘッダーバーにオリジナルURLの表示・コピー・共有が行えるアンカーボタンが実装されました。

AMP対応ページではオリジナルページとほぼ同じ内容が表示されますが、URLが異なるため「本当にいつものウェブサイトのページなのかわからない」などの混乱が生じていたとのこと。「なぜオリジナルのURLと異なるURLが生成されるのか」という疑問が混乱の原因のひとつであるため、Google検索部門のソフトウェアエンジニアであるAlex FischerさんがAMPのURLの仕組みについて解説しています。Fischerさんによると、AMPのコンテンツは以下のような3つの異なるURLを持っているとのこと。

◆AMPページで生成される3種類のURL
1：オリジナルURL
AMP形式で書かれたパブリッシャー側のドキュメントのURL。
例）http://www.example.com/amp/doc.html

2：AMP Cache URL
Google AMP Cacheを介して配信されるドキュメントのURLで、大半のユーザーはこのURLを見ることはありません。(GoogleのAMPコンテンツはすべてAMP Cacheを介して提供されています)
例）https://www-example-com.cdn.ampproject.org/c/www.example.com/amp/doc.html

3：Google AMP Viewer URL
AMP viewerに表示されるドキュメントのURL。(Google検索の結果にレンダリングされたとき)
例）https://www.google.com/amp/www.example.com/amp.doc.html

つまり、ひとつのコンテンツに複数のURLが混在していることが混乱の原因になっているわけですが、逆に言えば通常の4倍の速度でコンテンツを表示し、データ量も約1/10に抑えられるというAMPの特性は、複数のURLが混在することによって成り立っているとのこと。

◆AMP Cache URLとは？
まず、「Google AMP Cache」は取得したAMP HTMLページをキャッシュして、自動でページのパフォーマンスを改善するのですが、この挙動の際に「AMP Cache URL」が生成されます。これはウェブマスターが特定のURLでコンテンツを利用できるようにする必要があるためで、Google AMP CacheはオリジナルのURLをミラーリングして変換する新しいURL(AMP Cache URL)を介して、Googleの世界規模のインフラを通してコンテンツをキャッシュ、配信できるようにしています。オリジナルURLを使ってGoogle AMP Cacheを利用すると、ウェブマスターはDNSレコードを変更、またはネームサーバーを再設定する必要が生じます。小規模のウェブサイトでは、これらの複雑なAPIを介してコンテンツを配信するエンジニアリングリソースがないことが考えられるため、オリジナルURLをAMP Cache URLに変換することで、誰でもAMPの恩恵を簡単に受けられるようにしているそうです。

◆AMP Viewer URLとは？
AMP Cache URLはAMPコンテンツのキャッシュバージョンとして存在していますが、一般ユーザーの目に触れることはありません。一方で、Google検索上で検索ワードに応じてタイル上に表示される記事をタップすると、ブラウザのURLバーに表示される「google.com/amp」から始まるURLには、AMPを利用する人なら見覚えがあるかもしれません。この「AMP Viewer URL」は、プレレンダリングのために存在しています。

◆プレレンダリングの仕組み
ユーザーがGoogle検索上でAMPページを実行すると、同時にいくつかの関連するAMPページがプレレンダリングされます。事前にコンテンツをプレレンダリングしておくことで、ユーザーは関連するAMPを一瞬にして次々と読み込むことができます。プレレンダリングは検索結果ページ上に隠して埋め込まれたiframeを、AMPコンテンツの内容と、AMPページがプレレンダリングされていることを示す追加パラメータを読み込むことで行われています。これらのiframeの挙動を処理するJavaScriptコンポーネントは「AMP Viewer」と呼ばれています。

◆「google.com/amp」のURL
上記の挙動はすべてGoogle検索の検索結果ページ上で行われています。AMPページをタップしても別のページに移動したのではなく、同じページ上でiframeを読み込んだだけなので、ブラウザはURLを変更する必要はありません。一方で、スクリーンにはGoogle検索から表示したウェブサイトのページ(AMP viewer)が表示されていますが、ユーザーがページをリロードすると裏にあるGoogle検索のページが表示されることになります。これを回避するため、AMP viewerはブラウザのURLバーを負荷を掛けずに非同期処理できる「History API」を使って手動で更新しているとのこと。

ここでHistory APIが「オリジナルページ」または「AMP Cache URL」を更新できれば理想的なのですが、History APIは同じドメインを起点としたページしか読み込めないという制限があるため、AMPでは「www.google.com」を起点にする必要があり、そこでも「AMP Viewer URL」が必要になるわけです。

◆AMPのヘッダーバー
AMPは複数のURLを必要とするわけですが、オリジナル以外のURLが混在することは、フィッシング攻撃を受ける可能性を高めてしまいます。例えばAMPページ内にGoogleそっくりのログインページが表示された場合、URLバーが見えにくいためニセのサイトにGoogleのログイン情報を入力してしまうことが考えられますが、これを防ぐため、AMP Viewerはユーザーが閲覧しているコンテンツの出所を示すヘッダーバーを表示しています。

◆新機能の使い方
今回追加された新機能はヘッダーバーからオリジナルページのURLを表示、コピー、共有できるというもの。実際にはAMPページを開いた時に表示されているヘッダーバーにアンカーボタンが追加されているので、タップするとオリジナルURLが表示されます。ロングタップすると「新しいタブで開く」「新しいシークレットタブで開く」「リンクのURLをコピー」というブラウザの選択肢が表示されます。新機能はすでにiOS版Googleアプリに実装済みで、数週間以内にAndroidにも実装されるとのこと。今後は「Web Share API」を実装することで、AMP viewerからオリジナルページのURLをブラウザ自身の共有機能などで呼び出せるようにすることも予定しています。