Capture Media from Device Sensors (Fire Tablets)
With HTML5, you can use a standard file input element to capture media from the device's sensors, including camera and microphone. The W3C provides an HTML Media Capture document that describes how to capture media.
The PhotoUpload sample demonstrates how to use the camera to capture an image. The code for this sample is located in <Amazon Apps & Games Services SDKs>/Web/Cookbook/PhotoUpload/. The Web App SDK can be downloaded from the SDK Download page.
File Input Attributes
Adding the accept and capture attributes to a standard file input element enables users to use the device's sensors to capture media.
The accept attribute takes a set of comma-separated tokens whose values must be an ASCII case-insensitive match with one of the following values. Duplicate tokens are not allowed.
| Token | Meaning |
|---|---|
| audio/* | Indicates that sound files are accepted. |
| video/* | Indicates that video files are accepted. |
| image/* | Indicates that image files are accepted. |
| A valid MIME type with no parameters | Indicates that files of the specified type are accepted. |
| A string whose first character is "." (U+002E) | Indicates that files with the specified file extension are accepted. |
The capture attribute is a boolean that is either present or not. Note: Some older browsers that conform to the July 12, 2012 version of the W3C HTML Media Capture spec expect capture to be assigned one of the following values:
Formatted HTML:
| Value of `capture` attribute | Media capture control type |
|---|---|
| camera | A camera. |
| camcorder | A video camera. |
| microphone | A sound recorder. |
| filesystem | A generic file picker. |
Both the accept and capture attributes must be present for device capturing to work. If none of the MIME types supplied in the accept attribute is supported by the device, then the capture attribute is ignored.
The following examples shows these attributes in use in modern browsers:
<input type="file" name="image" accept="image/*" capture>
<input type="file" name="video" accept="video/*" capture>
<input type="file" name="sound" accept="audio/*" capture>
The following examples shows these attributes in use in older browsers:
<input type="file" name="image" accept="image/*" capture="camera">
<input type="file" name="video" accept="video/*" capture="camcorder">
<input type="file" name="sound" accept="audio/*" capture="microphone">
Last updated: Oct 29, 2020