<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <input type="button" value="视频" onclick="getMedia()"/> <video src="" id="video" width="500px" height="500px"></video> <canvas id="canvas" width="500px" height="500px"></canvas> <button onclick="takPhone()" id="but">拍照</button> <script> function getMedia() { var constrints={ video:{width:500,height:500}, audio:true }; //获取摄像头区域 var video=document.getElementById('video'); /* * 该方法返回Promise对象 * 这个Promise对象返回成功后会调函数带一个MediaStream对象作为其参数 * then()时Promise的方法 * then()方法是异步执行,当then()前的所有的方法执行完后再执行then()内部的程序 * 避免数据没有获取到 * */ var promise=navigator.mediaDevices.getUserMedia(constrints); promise.then(function(MediaStream){ video.srcObject=MediaStream; video.play(); }); } function takPhone() { var video=document.getElementById("video"); var canvas=document.getElementById("canvas"); var ctx=canvas.getContext('2d'); ctx.drawImage(video,0,0,500,500); } </script> </body> </html>
调用摄像头---图片抓拍和视频录像
2023-01-10
139
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《
阿里云开发者社区用户服务协议》和
《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写
侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介：
代码如下
目录
相关文章
|
2月前
|
算法
计算机视觉
基于RT-Thread摄像头车牌图像采集系统
【10月更文挑战第9天】使用基于RT-thread操作系统的AB32VG1开发板作为主控，对ov7670摄像头进行图像采集，并使用串口发送图片RGB565格式到PC供opencv进行图像识别。
44
1
1
|
6月前
|
编解码
Linux
计算机视觉
python 调用ffmpeg使用usb摄像头录制视频，输出h264格式，自动获取摄像头的最佳帧率和最大画面尺寸
使用 Python 调用 FFmpeg 进行 USB 摄像头视频录制，需先确保安装 FFmpeg 和 Python 的 `subprocess` 模块。代码示例展示了如何自动获取摄像头的最佳帧率和最大分辨率，然后录制视频。首先通过 FFmpeg 列出摄像头格式获取信息，解析出帧率和分辨率，选择最优值。之后调用 FFmpeg 命令录制视频，设置帧率、分辨率等参数。注意 `/dev/video0` 是 Linux 的摄像头设备路径，Windows 系统需相应调整。代码中未直接实现自动获取最佳参数，通常需要借助其他库如 OpenCV。
609
3
3
|
7月前
|
7月前
|
7月前
|
机器学习/深度学习
API
Android开发
视觉智能平台常见问题之判断摄像头抓拍到包含人脸的照片如何解决
视觉智能平台是利用机器学习和图像处理技术，提供图像识别、视频分析等智能视觉服务的平台；本合集针对该平台在使用中遇到的常见问题进行了收集和解答，以帮助开发者和企业用户在整合和部署视觉智能解决方案时，能够更快地定位问题并找到有效的解决策略。
85
0
0
|
计算机视觉
Python
|
Ubuntu
Linux
人机交互
|
计算机视觉
|
移动开发
JavaScript
|
移动开发
JavaScript
h5 实现调用系统拍照或者选择照片并预览
调用手机相机拍照或者是调用手机相册选择照片，这个功能在 手机端页面 或者 webApp 应该是常用到的，就拿个人或会员资料录入那块来说就已经是经常会碰到的，
每当看到这块功能的时候，前端的小伙伴就得去找各种各样的插件。
3023
0
0
热门文章
最新文章
1
《Stata统计分析与应用（第2版）》一3.4 图形的保存、合并及修改
2
Maven 3.6.3 的下载、安装、配置、检测（详细讲解）
3
基于区块链的机器学习模型创建方案
4
WPF listview item mouse enter/over popup
5
DevExpress 10.2.4系列-ASPxListBox根据列值不同设置不同图标
6
[Spring]支持注解的Spring调度器
7
红帽7.4新增的安全特性
8
hdu 1800 Flying to the Mars
9
研究 flex 4 开发后台管理项目（1）
10
Error: XML response that was returned...
1
《docker高级篇（大厂进阶）：2.DockerFile解析》包括：是什么、DockerFile构建过程解析、DockerFile常用保留字指令、案例、小总结
112
2
《Java 人工智能开发：Eclipse 与 IntelliJ IDEA 双雄助力》
42
3
《Java 在开源 AI 框架中的中流砥柱角色》
30
4
《Java 与大数据框架：AI 数据预处理的强力联盟》
33
5
《Java 优化秘籍：计算密集型 AI 任务加速指南》
33
6
《Java 与 OpenAI 协同：开启智能编程新范式》
25
7
uniapp开发鸿蒙，是前端新出路吗？
28
8
鸿蒙(HarmonyOS)原生AI能力之文本识别
36
9
鸿蒙开发之PixelMap介绍与实现图片变换
33
10
鸿蒙(HarmonyOS)开发之无须申请权限写入图片到相册
37