ウェブ用 Permissions API

以前に Geolocation API を扱ったことがある場合は、プロンプトを表示せずに位置情報を使用する権限があるかどうかを確認することをおすすめします。これは不可能でした現在の位置をリクエストする必要がありました。これにより、権限の状態を示すか、ユーザーにプロンプトが表示されます。

すべての API がこのように機能するわけではありません。Notifications API には、Notification.permission を介して現在の権限の状態を確認できる独自の方法が用意されています。

ウェブ プラットフォームが API で拡大するにつれ、デベロッパーはすべての API の仕組みを覚える必要がなくなり、権限のステータスを確認するための単一の標準的な方法が必要になります。Chrome バージョン 43 で提供されている Permission API は、API の権限ステータスをチェックする単一の標準的な方法です。

permissions.query()

permissions.query() メソッドを使用して権限のステータスを確認します。これにより、付与(権限がある)、拒否(API へのアクセスをブロック)、またはプロンプト(ユーザーにプロンプトを表示)のステータスが返されます。次に例を示します。

// Check for Geolocation API permissions
navigator.permissions.query({name:'geolocation'})
    .then(function(permissionStatus) {
    console.log('geolocation permission state is ', permissionStatus.state);

    permissionStatus.onchange = function() {
        console.log('geolocation permission state has changed to ', this.state);
    };
    });

クエリメソッドは PermissionDescriptor オブジェクトを受け取ります。このオブジェクトで権限の名前を定義します。レスポンスは、PermissionStatus オブジェクトに解決される Promise です。このオブジェクトから、permissionStatus.state を使用して状態を「granted」、「denied」、「prompt」で確認できます。また、permissionStatus.onchange のイベント ハンドラを実装し、権限の状態の変更を処理することもできます。

サポートされている PermissionDescriptor

上記の例では、権限記述子 {name:'geolocation'} を使用して位置情報の権限の状態をクエリする方法をハイライト表示しています。

通知権限記述子は、名前属性 {name:'notifications'} のみを必要とする点で類似しています。

pushmidi には、それぞれその API に固有の追加パラメータがあります。

push 権限の場合は、userVisibleOnly パラメータを指定できます。これは、すべてのプッシュ メッセージに対して通知を表示するか、サイレント プッシュ通知を送信できるようにするかを示します(現時点では、Chrome は通知付きのプッシュ メッセージにのみ対応しています)。次のように使用します。

navigator.permissions.query({name:'push', userVisibleOnly:true})

Midi では sysex パラメータを使用できます。これは、システム エクスクルーシブ メッセージを受信する必要があるかどうかを示します。MIDI の場合は次のようになります。

navigator.permissions.query({name:'midi', sysex:true})

権限のリクエスト

ユーザーに権限をリクエストする方法は、API によって異なります。たとえば、getCurrentPosition() を呼び出すと、位置情報によって権限プロンプトが表示されます。

navigator.geolocation.getCurrentPosition(function(position) {
    console.log('Geolocation permissions granted');
    console.log('Latitude:' + position.coords.latitude);
    console.log('Longitude:' + position.coords.longitude);
});

一方、requestPermission() を呼び出すと、ユーザーにメッセージが表示されます。

Notification.requestPermission(function(result) {
    if (result === 'denied') {
    console.log('Permission wasn\'t granted. Allow a retry.');
    return;
    } else if (result === 'default') {
    console.log('The permission request was dismissed.');
    return;
    }
    console.log('Permission was granted for notifications');
});

ここでのポイントは、Permission API を使用すると、ウェブ上で現在公開されているさまざまな API をサポートしながら、一貫した方法で権限のステータスをモニタリングすることができることです。

この大きな利点は、追加の権限が必要な理由がユーザーに明白な場合にのみプロンプトを表示し、権限が付与されていることを確認してこれらの API を最大限に活用することで、ユーザー エクスペリエンスを改善できることです。

例については、こちらをご覧ください

対応ブラウザ

Chrome が初めて実装したブラウザです。Mozilla はこれの提供を計画しており、Microsoft もこの API に関心を示しています。

既知の問題

  • ユーザーが権限リクエストを拒否しても、位置情報ではメッセージが再表示されません。ただし、権限のステータスは「プロンプト」のままです。[bugs.chromium.org]