HTML media capture
capture 属性は、オプションとして、新しいファイルをキャプチャすることと、 accept 属性で定義された種類の新しいメディアをどの機器でキャプチャするかを指定します。
値としては、 user と environment があります。 capture 属性は file 入力型が対応しています。
capture 属性は、accept 属性が入力の種類を示す場合、画像やビデオデータの取り込みに使用するカメラを指定する文字列をその値として受け取ります。
値 説明
user ユーザー側のカメラやマイクを使用します。
environment 外向きのカメラやマイクを使用します。
メモ: capture は、以前は論理属性で、存在する場合、ファイル入力を要求する代わりに、カメラやマイクなどの機器のメディアキャプチャ機器を使用するように要求していました。
対応ブラウザ
| 機能 | デスクトップ | モバイル | ||||
|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Chrome Android | Safari iOS | |
| | | | | 25 | 10 | |
| HTML 属性 | ||||||
| capture 属性は、オプションとして、新しいファイルをキャプチャすることと、 accept 属性で定義された種類の新しいメディアをどの機器でキャプチャするかを指定します。 | | | | | 25 | 10 |
基本構文
HTML
<!-- Camera activation --> <input type="file" accept="image/*" capture="environment"> <!-- Front camera --> <input type="file" accept="image/*" capture="user"> <!-- Microphone activation --> <input type="file" accept="audio/*" capture> 実務での使いどころ
-
HTML media capture の活用
capture 属性は、オプションとして、新しいファイルをキャプチャすることと、 accept 属性で定義された種類の新しいメディアをどの機器でキャプチャするかを指定します。
注意点
- 一部のブラウザでのみ対応。使用前にブラウザサポートを確認すること。
アクセシビリティ
- スクリーンリーダーでの読み上げを確認すること。