現代において、SNSやアプリへのページシェアは必須とも言える機能です。例えばこのブログの記事も、記事の下部に多数のシェアボタンが設置されています。

Web Share APIはそういったページシェアをブラウザ上で実現するAPIです。今までは各サービス独自のシェアボタンを設置していましたが、Web Share APIを使うことで、統一的な手法でシェアができるようになります。

Web Share APIについて

Web Share APIはページをシェアするためのAPIで、WICGが仕様を定めています。詳しい仕様は以下のURLになります:

対応ブラウザは現在のところAndroid版Chrome61のみです。

簡単な使い方

Web Share APIは非常に単純なAPIです。以下に最も簡単な例を示します:

この例では、ボタンをクリックすると今見ているページをシェアする動作となります。どうシェアするかはブラウザによっても異なりますが、例えばAndroid版Chrome61では以下のような表示がポップアップします:

詳しい使い方

Web Share APIのインターフェイスは以下のようになっています:

Web Share APIは、たったこれだけのシンプルなAPIです。データとしてtitle、text、urlが指定できます。このうち最低ひとつは指定している必要があります。

このとき、urlは絶対URL/相対URLのどちらも受け付けます。空白にすると現在のページのURLとなります。

Web Share APIの使用には、コンテキストがセキュアである必要があります。簡単にいうと、HTTPSに対応したページでしか使えません。

また、Web Share APIを使うには、何らかのユーザージェスチャーが必要になります。つまり、ボタンをクリックさせるなど、ユーザーが能動的にシェアする場合のみにしか動作しないということです。

戻り値

navigator.shareはPromise<void>を返します。このPromiseはユーザーがシェアを実行すると解決されます。

シェア対象がひとつも存在しない場合、またはユーザーがシェアをキャンセルした場合、Promise<void>はAbortErrorでrejectされます。

将来的な拡張性

Web Share APIは将来拡張される可能性があります。将来的には、例えば画像のシェアができるようになるかもしれません。ただし今はtitle、text、urlの3つのみです。

例として、imageがシェアできるようになったとしましょう。このとき以下のようにシェアできます:

Web Share APIは拡張性を持った柔軟なAPIです。今後の拡張に期待しましょう。