ブラウザのさまざまな権限が正常に利用できるかどうかを一発でチェック可能なサイト「permission.site」を使ってみた

位置情報やカメラ、マイクなどを利用するウェブアプリを構築する時、各種のブラウザ・デバイスの組み合わせでどんな権限が利用できるのかを調べるのは面倒なものです。「permission.site」はウェブアプリから利用できるブラウザのさまざまな権限をまとめてチェックできるサイトとのことなので、実際に使って試してみました。

permission.site
https://permission.site/

サイトには下記の通り、多数のボタンが配置されています。

試しに「Notifications(通知)」をクリックすると、通知の許可を求めるポップアップが出現しました。「許可する」をクリックします。

通知が許可されると同時に、サイトの「Notifications」のボタン背景が緑色になりました。このように、機能が正常に利用可能になったかどうかを一発で分かるように表示してくれるサイトというわけです。

今回のレビューで使用しているPCではNFCやVR、AR機能が利用できないため、これらのボタンをクリックすると即座に背景が赤色に変化しました。一方、「Device Orientation」機能は特にブラウザの許可不要で利用できるため、クリックした瞬間緑色に変化します。「Device Motion」や「<keygen>」など、クリックしても何の変化も起きないボタンも存在していました。

ページの最上部にはHTTPとHTTPSを切り替えるボタンが設置されています。ボタンをクリックしてみます。

するとページがリロードされて最上部のボタンが「HTTP」に切り替わり、アドレスバーにも「保護されていない通信」と表示されました。

HTTPでページを表示している場合でも利用可能な機能があるか確かめるために全てのボタンをクリックしてみましたが、特に許可を求められることはなく、ボタンが緑色になることはありませんでした。

ページをスクロールするとフルスクリーン表示を試せるボタンやポインターを非表示にするボタンが設置してあります。この2つのボタンに関しては、実際に機能を試すためのボタンということのようで、背景色は変化しない模様でした。

Copyボタンをクリックするとクリップボードに「This text was copied from the permission.site clipboard example.」というテキストがコピーされます。

その他、複数のファイルを自動でダウンロードさせられる「Auto Download」や、ポップアップの許可状況を確認できる「Popup」ボタン、非同期のクリップボードAPIを試せるボタンなどが用意してあります。

最下部には細かな補足説明が記載してありました。

サイトの具体的なコードはGitHubで公開されているので、気になる人は確認してみて下さい。