html5系列:device's media capture mechanism(设备的媒体捕捉机制)——利用input:file调用设备的照相机/相册、摄像机、录音机
来源:互联网 发布:战龙三国关羽进阶数据 编辑:程序博客网 时间:2024/05/06 18:00
先贴W3C官方文档链接:http://www.w3.org/TR/html-media-capture
HTML Media Capture
作为一个候选的建议方案,尚未定稿,即未被W3C完全认可,还处于不断更新的状态,截至目前为止,HTML Media Capture
的最新版本是2014年6月版。
html5对input:file
作了扩展,使用户可以通过input:file
来调用设备(主要是移动设备:手机/平板)的照相机/相册、摄像机、录音机功能
此扩展方案首先是给input:file
加了一个属性:capture
,这是一个boolean类型的属性,也就是只要有出现就为true,没出现就是false,这跟网上的一些资料有所冲突:
<input type="file" accept="image/*" capture="camera" />
<input type="file" accept="video/*" capture="camcorder" />
<input type="file" accept="audio/*" capture="microphone" />
capture表示,可以捕获到系统默认的设备,比如:camera–照相机;camcorder–摄像机;microphone–录音。
事实上,capture并不需要有值,直接用 <input type="file" accept="image/*" capture />
即可。
接下来要说的是跟capture属性搭配使用的accept属性。
accept属性实际上指的就是该input:file接受的文件类型(MIME),如image/jpg
,image/png
等,另外,也可以用 * 来代替全选,如:image/*
、video/*
、audio/*
。未试验过是否能直接用accept="*"
,不过想必也不会有人这么用。
accept属性对于HTML Media Capture
来说至关重要,在最新版本的HTML Media Capture
候选方案中,规定若要用capture属性启动device's media capture
,必须得指定capture control type
,这指的是一种针对特定文件类型优化后的选择文件的控制方式,如从照相机/相册里选择图片、从摄像机里选择视频等。而这capture control type
,实际上就是通过accept属性(MIME)来进行指定的:accept="image/*"
=》 相册/照相机;accept="video/*"
=> 摄像机;accept="audio/*"
=》 录音。换句话说,如果给出的accept属性(MIME)没有相对应的 capture control type ,例如:accept="application/rtf"
;或是根本没有给出accept属性,那么就无法启动 device’s media capture 了。
当用户成功通过device's media capture
选择好图片/视频/音频后,就跟普通的input:file
无异,该上传的上传,改用html5 file api 读的就用api读文件,这些内容就与本文无关了。
- html5系列:device's media capture mechanism(设备的媒体捕捉机制)——利用input:file调用设备的照相机/相册、摄像机、录音机
- H5调用本地的照相机,摄像机等设备
- 移动设备上的媒体查询 CSS media queries for mobile device
- 关于 HTML5 调用用户的 照相机、相册 初步整理
- HTML5调用手机摄像机、相册功能 <input>方法
- HTML5调用手机摄像机、相册功能 <input>方法
- 控制设备的照相机(camera)
- 达夫设备(Duff's Device)的详细说明
- 达夫设备(Duff's Device)的详细说明
- 达夫设备(Duff's Device)的详细说明
- 达夫设备(Duff's Device)的详细说明
- 关于达夫设备(Duff's device)的理解
- 达夫设备(Duff's Device)的详细说明
- 调用设备的照相机和获取本地的图片
- pro.Android Media--调用内置的照相机
- 基于Bluetooth AVRCP Input Device分析Android Media Button Mechanism
- 巧妙使用CSS媒体查询(Media Queries)和JavaScript判断浏览器设备类型的好方法
- 字符设备 和 input 设备--input设备的注册
- 嗅探,arp欺骗,会话劫持与重放攻击
- 深入CSS,让网页开发少点“坑”
- Qwt在Qt中的安装
- upstream prematurely closed connection while reading upstream 错误
- boost xpressive库正则表达式使用笔记
- html5系列:device's media capture mechanism(设备的媒体捕捉机制)——利用input:file调用设备的照相机/相册、摄像机、录音机
- silverlight运行基本原理
- Android实现双进程守护
- Context-aware CNNs for person head detection
- iOS9 之3DTouch 入门
- 二、3DES
- 古怪的嗜酒者(二)
- 支付宝等大型支付系统交易额巨大,后台系统是如何对账和风控的呢?
- Android进阶之路——NDK(二)