uni-app web端使用getUserMedia,摄像头拍照

news2024/11/24 3:08:43
<template>
	<view>
		<video id="video"></video>
	</view>
</template>	

摄像头显示在video标签上

var opts = {
	audio: false,
	video: true
}

navigator.mediaDevices.getUserMedia(opts).then((stream)=> {
	video = document.querySelector('video');
	video.srcObject = stream
	video.play();
}).catch((err)=>{
	console.log(err)
});

拍照 npm i html2canvas

cxBackToBlank() {
	uni.showLoading({});
	html2canvas(document.querySelector('video'), {
		backgroundColor: null,
		useCORS: true
	}).then(async (canvas) => {
		let url = canvas.toDataURL('image/jpeg');
	})
},
<style scoped>
	#video {
		position: absolute;
		left: 100rpx;
		top: 100rpx;
		width: 1000rpx;
		height: 1000rpx;
	}
</style>	

在这里插入图片描述
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1590094.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

emmet语法--快速生成html标签

emmet语法介绍 可以直接把它理解为快捷键。 通过一定简略的缩写配合快捷键&#xff0c;直接生成我们想要的html代码。 vscode中已经内置了emmet语法&#xff0c;可以直接使用。 emmet的核心就是tab键&#xff0c;我们输入关键词然后按下tap就可以直接生成我们要的代码。 标…

高云FPGA的管脚约束文件的复制

问&#xff1a;Gowin里面能不能直接拷贝一个管脚约束文件进去用&#xff1f; 答&#xff1a; 可以直接拷贝&#xff0c;但是拷贝前后两个工程对应的芯片必须要是同一个芯片 拷贝方法: 第一步&#xff1a;按照被拷贝约束文件对应的芯片新建一个工程&#xff0c;然后将原工程文…

产品推荐 | 基于Lattice的Crosslink系列LIF-MD6000 FPGA开发板

1、产品概述 LATTICE是一家老牌的FPGA厂家。在CPLD和FPGA低成本&#xff0c;小封装独树一帜。特别在消费电子&#xff0c;小型化设备&#xff0c;控制领域用的比较多。 Crosslink开发板采用Lattice的Crosslink家族系列芯片&#xff0c;LIF-MD6000-6JM80。Crosslink芯片具有低…

取出/var/log/secure中一小时内登录失败超过三次的IP

取出/var/log/secure中一小时内登录失败超过三次的IP 前两个字段是日期&#xff0c;第三个字段是小时&#xff0c;第四个字段是IP cat /var/log/secure | sort -i | awk -F [ :] /Failed/{a[$1" "$2" "$3" "$4" "$(NF-3)]}END{for(i …

二百三十一、ClickHouse——DBeaver连接ClickHouse中时间戳字段的时区差了8小时

一、目的 在用kettle把MySQL中的数据同步到ClickHouse中&#xff0c;发现kettle里的数据显示正常、DataGrip查询ClickHouse中的数据显示正常&#xff0c;但是DBeaver中显示的ClickHosue中的时间字段晚8个小时 二、错误原因 DBeaver的数据库时区设置有问题 三、解决办法 右…

DP10RF001一款工作于200MHz~960MHz低功耗、高性能、单片集成的(G)FSK/OOK无线收发芯片

产品概述. DP10RF001是一款工作于200MHz~960MHz范围内的低功耗、高性能、单片集成的(G)FSK/OOK无线收发机芯片。内部集成完整的射频接收机、射频发射机、频率综合器、调制解调器&#xff0c;只需配备简单、低成本的外围器件就可以获得良好的收发性能。芯片支持灵活可设的数据包…

[大模型]Langchain-Chatchat安装和使用

项目地址&#xff1a; https://github.com/chatchat-space/Langchain-Chatchat 快速上手 1. 环境配置 首先&#xff0c;确保你的机器安装了 Python 3.8 - 3.11 (我们强烈推荐使用 Python3.11)。 $ python --version Python 3.11.7接着&#xff0c;创建一个虚拟环境&#xff…

Day98:云上攻防-云原生篇K8s安全Config泄漏Etcd存储Dashboard鉴权Proxy暴露

目录 云原生-K8s安全-etcd(Master-数据库)未授权访问 etcdV2版本利用 etcdV3版本利用 云原生-K8s安全-Dashboard(Master-web面板)未授权访问 云原生-K8s安全-Configfile鉴权文件泄漏 云原生-K8s安全-Kubectl Proxy不安全配置 知识点&#xff1a; 1、云原生-K8s安全-etcd未…

Failure Unable to retrieve image details-解决Portainer与Docker v26不兼容问题

文章目录 前言解决过程解决方法一解决方法二 前言 今天登上服务器习惯性的升级了yum软件包&#xff0c;结果这一更新后导致Portainer不能正常使用&#xff0c;后续进行成功解决&#xff0c;简单记录一下 解决过程 事故过程模拟 当时顺手升级下docker版本(V26.0.1) 结果Porta…

OpenHarmony南向之编译构建框架

title: OpenHarmony南向之编译构建框架 categories:- OpenHarmony tags:- Ninja- GN author: shell cover: /img/oh/build_framework_ZN.png date: 2024-01-03 21:05:38概述 OpenHarmony编译子系统是以GN和Ninja构建为基座&#xff0c;对构建和配置粒度进行部件化抽象、对内建…

智能售货机:引领便捷生活

智能售货机&#xff1a;引领便捷生活 在这个科技迅速进步的时代&#xff0c;便捷已成为生活的必需。智能售货机作为技术与便利完美结合的产物&#xff0c;正逐渐改变我们的购物方式&#xff0c;为都市生活增添新的活力。 智能售货机的主要优势是它的极致便利性。不论是在地铁…

局域网管理软件哪个好?局域网电脑管理系统实践案例

之前有一个公司案例&#xff0c;是这样的&#xff1a; 公司名称&#xff1a;智慧科技有限公司 背景&#xff1a; 智慧科技有限公司是一家拥有数百名员工的中型企业&#xff0c;随着业务的快速发展&#xff0c;公司面临着网络管理上的挑战。 员工在日常工作中需要频繁地访问…

ChatGPT加持,需求分析再无难题

简介 在实际工作过程中&#xff0c;常常需要拿到产品的PRD文档或者原型图进行需求分析&#xff0c;为产品的功能设计和优化提供建议。 而使用ChatGPT可以很好的帮助分析和整理用户需求。 实践演练 接下来&#xff0c;需要使用ChatGPT 辅助我们完成需求分析的任务 注意&…

车载平板丨车载终端丨车载平板电脑前景如何?

随着人们对车辆安全性和稳定性的关注日益增加&#xff0c;车载加固终端市场前景非常广阔。根据市场研究机构的数据显示&#xff0c;全球车载加固终端市场规模将在未来几年内快速增长。预计到2025年&#xff0c;全球车载加固终端市场规模将达到约55亿美元&#xff0c;年复合增长…

数字IC/FPGA——锁存器/触发器/寄存器

本文主要介绍以下几点&#xff1a; 什么是触发器和锁存器门电路和触发器的区别什么是电平钟控触发器电平钟控触发器触发器和锁存器的区别触发器的分类方式&#xff1a;逻辑功能、触发方式、电路结构、存储数据原理、构成触发器的基本器件寄存器利用移位寄存器实现串并转换或并…

npm问题合集以及npm常规操作整理

问题一&#xff1a;npm install 卡在“sill idealTree buildDeps“ 可以尝试将网络切换为其他网络&#xff0c;我的是这么解决的。可以尝试重新设置镜像。 问题二&#xff1a;npm install 项目依赖报WARN deprecated 原因 依赖版本问题&#xff0c;下载最新版本。 解决方案 …

科研学习|可视化——Origin绘制相关性系数矩阵

一、Origin软件版本 Origin2021版本 二、插件下载地址 CorrelationPlot.opx资源-CSDN文库 三、插件安装步骤 从上述链接下载插件将插件解压缩&#xff08;最好是解压缩到orgin的安装目录&#xff09;用origin打开插件&#xff08;或者打开origin&#xff0c;将插件拖拽到origin…

SPI 机制

一、简述 本文介绍 SPI 机制。 二、什么是 SPI 机制 SPI&#xff08;Service Provider Interface&#xff09;机制是 Java 编程语言中的一种机制&#xff0c;用于实现组件之间的解耦和扩展。SPI 允许开发者编写服务接口&#xff08;Service Interface&#xff09;&#xff0…

开源无需授权2024最新同城上门预约家政按摩小程序+公众号H5+APP源码系统下载

2024最新同城上门预约家政按摩源码简介&#xff1a; 开源无需授权2024最新同城上门预约家政按摩小程序&#xff0b;公众号H5&#xff0b;APP源码系统下载&#xff0c;前端采用uni-app开发&#xff0c; 后端thinkphp框架开发。适配多端&#xff08;小程序&#xff0b;公众号H5&…

吴恩达2022机器学习专项课程(一) 5.9 特征工程 5.10 多项式回归

问题预览/关键词 特征工程的重要性什么是特征工程&#xff1f;什么是多项式回归&#xff1f;特征缩放对多项式回归的重要性特征的选择 笔记 1.特征工程的重要性 选择或输入合适的特征&#xff0c;是让算法正常工作的关键步骤之一。 2.特征工程 根据应用场景&#xff0c;运…