html5直接调用手机相机照相/录像
现在的h5功能越来越强大。之前做项目时上传功能input type=file时,在IOS下居然可以直接照相。。。但是在安卓上是不能。后面研究 了下,其实安卓下也可以的。
就是在input上加上capture属性。至于capture是属性是什么。查到是下图这样解释。
然后举个例子。
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>html5直接调用手机相机照相/录像</title>
</head> <body>
</body>
<div>
<h3>使用设备的面向用户的相机拍摄照片</h3>
<form>
<input type="file" name="image" accept="image/*" capture="user">
<input type="submit" value="照相上传">
</form>
</div>
<div>
<h3>使用面向环境的设备本地摄像机捕获视频:</h3>
<form>
<input type="file" name="video" accept="video/*" capture="environment">
<input type="submit" value="录像上传">
</form>
</div> </html>
个人手机测试 了下确实 没问题
html5直接调用手机相机照相/录像的更多相关文章
- html5调用手机相机并压缩、上传
近日刚做的一个功能,要在app里使用内嵌页面进行图像的上传.从功能上看,原生的实现应该是最好的.毕竟页面上所有的东西都隔着一个浏览器,所有的实现都要依赖浏览器提供的接口,不同的浏览器对接口的实现又有差 ...
- HTML5调用手机相机拍照
前端调用手机相机拍照 实现方式常见有两种: 一种是通过video控件,通过捕获video的流,截取video中的图像实现拍照, 还有一种是通过input[file]控件调用移动端的摄像头,实现拍照. ...
- android 7.0以上共享文件(解决调用系统照相和图片剪切出现的FileUriExposedException崩溃问题)
在android7.0开始试共享“file://”URI 将会导致引发 FileUriExposedException. 如果应用需要与其他应用共享私有文件,则应该使用 FileProvider, F ...
- 关于html5调用手机相机(原创)
很久没写随笔了 从ios6开始,webview支持html <input type="file">标签,用来调取手机的相册和相机,但是没有权限提示,不知道是不是我写的有 ...
- 亲测可用)html5 file调用手机摄像头
在切图网一个客户的webapp项目中需要用到 html5调用手机摄像头,找了很多资料,大都是 js调用api 然后怎样怎样,做了几个demo测试发现根本不行, 后来恍然大悟,用html5自带的 in ...
- HTML5拨号 调用手机拨号功能
<a href="tel:123456789">拨号</a> 这个就是HTML5 运行在手机浏览器上的可以调用手机的拨号tel就是你想要拨打的电话号码
- html5页面调用手机打电话功能
<head>里面加上:<meta name="format-detection" content="telephone=yes"/> 需 ...
- HTML5 页面调用微信接口
参考微信微信官方文档JS_SDK:https://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html#JSSDK.E4.BD.B ...
- java input 实现调用手机相机和本地照片上传图片到服务器然后压缩
在微信公众号里面需要上传头像,时间比较紧,调用学习jssdk并使用 来不及 就用了input 使用input:file标签, 去调用系统默认相机,摄像,录音功能,其实是有个capture属性,直接说 ...
随机推荐
- POJ2536-Gopher II-(匈牙利算法)
题意:n只老鼠,m个洞,s秒逃命,逃命速度为v,一个洞只能保住一只老鼠,最少多少只老鼠会被老鹰抓到. 题解:找出每只老鼠有哪些洞可以保命,建立二分图,算出最大匹配,不是求保住命的老鼠,而是求被抓住的老 ...
- Centos7安装MySQL(多图)
文章目录 一.在线安装1.替换网易yum源2.清理缓存3.下载rpm文件4.安装MySQL数据库二.本地安装1.上传MySQL安装包2.安装依赖的程序包3.卸载mariadb程序包4.安装MySQL程 ...
- Linux磁盘管理——分区和文件系统
1.分区类型 (1)主分区:最多只能有四个(主分区加扩展分区一共有四个). (2)扩展分区:最多有一个,是主分区中的其中一个.不能存储数据也不能格式化,必须再分成逻辑分区才能使用. (3)逻辑分区:是 ...
- css3有哪些新特性?
新选择器,属性选择器.伪类选择器.层次选择器... 圆角属性border-radius font-face加载服务器端的字体 多列布局column 阴影shadow 弹性盒flex 过渡transit ...
- ES6基础-ES6 class
作者 | Jeskson 来源 | 达达前端小酒馆 ES - Class 类和面向对象: 面向对象,即万物皆对象,面向对象是我们做开发一种的方式,开发思维,面向对象的思维中万物皆对象,以人作为例子,它 ...
- Java 并发系列之六:java 并发容器(4个)
1. ConcurrentHashMap 2. ConcurrentLinkedQueue 3. ConcurrentSkipListMap 4. ConcurrentSkipListSet 5. t ...
- 【K8S】Kubernetes: --image-pull-policy always does not work
https://stackoverflow.com/questions/45905999/kubernetes-image-pull-policy-always-does-not-work
- C# IE浏览器操作类
using System; using System.Collections.Generic; using System.Drawing; using System.Runtime.InteropSe ...
- 认识一下microbit扩展板robotbit
在我们买到的套件中,另一块叫robotbit扩展板,所谓扩展板,是把控制板上的针脚引出来,方便我们扩展驱动连接电机.舵机.及各种传感器以展功能. 介绍如下 :下面 反面: 官方文档:http://le ...
- Python3+syslog使用及相关说明
一.说明 1.1 背景说明 syslog这个东西,最早接触是在Z公司做基线安全加固的时候有启用远程日志服务器一项,然后当时还写整理了一篇“rsyslog+loganalyzer远程日志系统搭建教程(C ...