利用JS调取电脑摄像头,实现拍照功能
1.调取电脑摄像头非常简单,看代码一幕了然
window.addEventListener("DOMContentLoaded", function() {
var canvas = document.getElementById("canvas"),
context = canvas.getContext("2d"),
video = document.getElementById("video"),
videoObj = { "video": true },
errBack = function(error) {
console.log("Video capture error: ", error.code);
};
if(navigator.getUserMedia) { // Standarda
navigator.getUserMedia(videoObj, function(stream) {
video.src = stream;
video.play();
}, errBack);
} else if(navigator.webkitGetUserMedia) { // WebKit-prefixed
navigator.webkitGetUserMedia(videoObj, function(stream){
video.src = window.webkitURL.createObjectURL(stream);
video.play();
}, errBack);
}
else if(navigator.mozGetUserMedia) { // Firefox-prefixed
navigator.mozGetUserMedia(videoObj, function(stream){
video.src = window.URL.createObjectURL(stream);
video.play();
}, errBack);
}
document.getElementById("snap").addEventListener("click", function() {
context.drawImage(video, 0, 0, 640, 480);
});
}, false);
可以自己去试试,可能还会有点兼容性问题。
利用JS调取电脑摄像头,实现拍照功能的更多相关文章
- 如何在app里利用js调取手机第三方地图--以高德地图和百度地图为例(2)
接着上篇文章说一下js调取第三方地图的问题,上次的方式是通过一个链接直接接到了第三方的web页面,又从第三方的web页面调用的第三方app;结果,这个方法被否定了,因为需求不是这样,需求直接就想调用第 ...
- 移动端js调取手机相册和拍照功能
前端可以通过js调取手机的相册和拍照功能,但不能拍视频!!! <!DOCTYPE html> <html lang="en"> <head> & ...
- WinForm利用AForge.NET调用电脑摄像头进行拍照和视频
当然了,你需要去官网下载类库,http://www.aforgenet.com/ 调用本机摄像头常用的组件: AForge AForge.Controls AForge.Imaging AForge. ...
- 【转】js实现复制到剪贴板功能,兼容所有浏览器
两天前听了一个H5的分享,会议上有一句话,非常有感触:不是你不能,而是你对自己的要求太低.很简单的一句话,相信很多事情不是大家做不到,真的是对自己的要求太低,如果对自己要求多一点,那么你取得的进步可能 ...
- 文件件监听器,android系统拍照功能调用后删除系统生成的照片
先说说要实现的功能: android调用系统拍照功能实时 预览 删除 上传 保存 (用户不能再本地文件夹中看到拍的照片) 再说说遇到的问题: 1.调用系统拍照在系统自带的拍照文件夹中生成一张随机命名图 ...
- 【原】js实现复制到剪贴板功能,兼容所有浏览器
两天前听了一个H5的分享,会议上有一句话,非常有感触:不是你不能,而是你对自己的要求太低.很简单的一句话,相信很多事情不是大家做不到,真的是对自己的要求太低,如果对自己要求多一点,那么你取得的进步可能 ...
- 黄聪:JS实现复制到剪贴板功能,兼容所有浏览器(转)
两天前听了一个H5的分享,会议上有一句话,非常有感触:不是你不能,而是你对自己的要求太低.很简单的一句话,相信很多事情不是大家做不到,真的是对自己的要求太低,如果对自己要求多一点,那么你取得的进步可能 ...
- Java乔晓松-android中调用系统拍照功能并显示拍照的图片
android中调用系统拍照功能并显示拍照的图片 如果你是拍照完,利用onActivityResult获取data数据,把data数据转换成Bitmap数据,这样获取到的图片,是拍照的照片的缩略图 代 ...
- 拖拽系列二、利用JS面向对象OOP思想实现拖拽封装
接着上一篇拖拽系列一.JavaScript实现简单的拖拽效果这一篇博客将接着对上一节实现代码利用JS面向对象(OOP)思维对上一节代码进行封装; 使其模块化.避免全局函数污染.方便后期维护和调用:写到 ...
随机推荐
- 恢复scout工具栏
删除scout安装路径 C:\PROGRAM FILES\SIEMENS\STEP7\U7UMC\DATA\WRKBNCH 下的三个文件: acppersi.dat uespersi.dat uesu ...
- OOA-OOD—OOP
关于面向对象(OO)程序设计的思想,现在把它记下来. ----OOA Object-Oriented Analysis(面向对象分析方法)是确定需求或者业务的角度,按照面向对象的思想来分析业务.例如: ...
- vuejs 开发中踩到的坑
用 v-for 循环式 每个item的值相等的情况下,会影响v-model的双向绑定: Modal 组件开发,主要用slot 标签来实现 <template> <transitio ...
- 【[NOI2013]矩阵游戏】
我们看到了及其可怕的数据范围 这个样子都没有办法直接读入的数据范围应该怎么算 我们观察一下递推式\(f[i][j]=a*f[i][j]+b(j!=1)\) \(f[i][1]=c*f[i-1][m]+ ...
- Windows7安装Envi4.8简体中文破解版
在正式安装前,建议先完整阅读本教程!本教程所使用的是Envi 4.8 32 位安装包,径测试,在64位windows7上可以正常安装使用!本教程就是在64位windows7上安装32位Envi4.8! ...
- maven 项目运行找不到类
其实maven 仓库有jar包,可能未编译或破损, 在本地仓删除它,然后maven install
- Git相关内容
先聊一点关于gitlab的内容和github的内容 Gitlab和GitHub,都是我们可以存放代码库的地方.不过Gitlab可以免费的存储私人代码,GitHub需要花钱才能够存储私人代码库,不过我想 ...
- Spring Boot应用的测试——Mockito
Spring Boot应用的测试——Mockito Spring Boot可以和大部分流行的测试框架协同工作:通过Spring JUnit创建单元测试:生成测试数据初始化数据库用于测试:Spring ...
- ATK-DataPortal 设计框架(二)
在信息的交换过程中,总是有此相同相似的功能,由于业务的各自不同,由同一类型来处理诸如增删改查等常见的信息处理方式.从日常的对些类行为操作为生成的类分析,大量雷同的代码遍布整个项目.框架中xxxHand ...
- SpringBoot学习18:springboot使用Scheduled 定时任务器
Scheduled 定时任务器:是 Spring3.0 以后自带的一个定时任务器. 1.在pom.xml文件中添加Scheduled依赖 <!-- 添加spring定时任务 Scheduled ...