OS連携権限不要スマホ推奨判定中...
Battery Status API
端末のバッテリー残量・充電状態・満充電/放電までの推定時間を取得し、変化イベントも購読できるAPI。
1対応判定
| ブラウザ | 対応バージョン |
|---|---|
| Chrome | 38+ |
| Firefox | 未対応(43で追加後52で削除) |
| Safari | 未対応 |
備考: Chromium限定
2権限フロー
権限不要このAPI
API呼び出しだけで動く。プロンプトも操作起点の縛りもない
ユーザージェスチャー必須
ボタンクリック等のユーザー操作の中でしか呼べない。プロンプトは出ない
権限プロンプトあり
呼び出すとブラウザが許可/ブロックのプロンプトを表示し、ユーザーが選ぶ
iOS独自requestPermission
iOSではrequestPermission()を操作起点で呼び、明示的に許可を得る
権限プロンプトなし。navigator.getBattery() を呼ぶだけで取得できる。
3ライブデモ: バッテリー残量ゲージのリアルタイム表示
4コードスニペット
TypeScript(要約版)
// バッテリー情報の取得(権限プロンプトなし)
const battery = await navigator.getBattery();
console.log("残量:", Math.round(battery.level * 100), "%");
console.log("充電中:", battery.charging);
console.log("満充電まで:", battery.chargingTime, "秒");
console.log("放電まで:", battery.dischargingTime, "秒");
// 変化イベントを購読してリアルタイム更新
function render() {
updateGauge(battery.level, battery.charging);
}
battery.addEventListener("levelchange", render);
battery.addEventListener("chargingchange", render);
battery.addEventListener("chargingtimechange", render);
battery.addEventListener("dischargingtimechange", render);
// 後始末: リスナー解除
battery.removeEventListener("levelchange", render);