webRtc之指定摄像头设备绿屏问题

news2025/5/11 22:17:54

摘要:最近发现,在使用navigator.mediaDevices.getUserMedia({ deviceId: ‘xxx’}),指定设备的时候,video播放总是绿屏,发现关闭浏览器硬件加速不会出现,但显然这不是一个最好的方案;

播放后张这样

在这里插入图片描述

修复后

在这里插入图片描述

上代码

指定采集宽度高度后就不会出现这个绿屏问题

// js
navigator.mediaDevices.getUserMedia({
	video: {
		deviceId: devId,
		// 指定采集尺寸
		width: { ideal: 1280 },
		height: { ideal: 720 },
	}
}).then((stream) => {
     const elm: HTMLVideoElement | any = document.getElementById('devDetectionVideoRef');
     if (elm) {
         elm.srcObject = stream;
     }
}).catch((error) => {
})
// html
<video id="devDetectionVideoRef" className={style.video_element}
	autoPlay
	playsInline
	webkit-playsinline='true'
></video>
// css
.video_element{
	width: 640px;
	height: 480px;
	background-color: #233149;
}

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

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

相关文章

2023年03月青少年软件编程(图形化)等级考试四级编程题

求和 1.准备工作 &#xff08;1&#xff09;保留舞台中的小猫角色和白色背景。 2.功能实现 &#xff08;1&#xff09;计算1&#xff5e;100中&#xff0c;可以被3整除的数之和&#xff1b; &#xff08;2&#xff09;说出被3整除的数之和。 标准答案&#xff1a; 参考程序&…

ensp的华为小实验

1.先进行子网划分 2.进行接口的IP地址配置和ospf的简易配置&#xff0c;先做到全网小通 3.进行ospf优化 对区域所有区域域间路由器进行一个汇总 对区域1进行优化 对区域2.3进行nssa设置 4.对ISP的路由进行协议配置 最后ping通5.5.5.5

ragflow报错:KeyError: ‘\n “序号“‘

环境&#xff1a; ragflowv 0.17.2 问题描述&#xff1a; ragflow报错&#xff1a;KeyError: ‘\n “序号”’ **1. 推荐表&#xff08;输出json格式&#xff09;** [{"},{},{"},{} ]raceback (most recent call last): May 08 20:06:09 VM-0-2-ubuntu ragflow-s…

FHE与后量子密码学

1. 引言 近年来&#xff0c;关于 后量子密码学&#xff08;PQC, Post-Quantum Cryptography&#xff09; 的讨论愈发热烈。这是因为安全专家担心&#xff0c;一旦有人成功研发出量子计算机&#xff0c;会发生什么可怕的事情。由于 Shor 算法的存在&#xff0c;量子计算机将能够…

CSS: 选择器与三大特性

标签选择器 标签选择器就是选择一些HTML的不同标签&#xff0c;由于它们的标签需求不同&#xff0c;所以CSS需要设置标签去选择它们&#xff0c;为满足它们的需求给予对应的属性 基础选择器 标签选择器 <!DOCTYPE html> <head><title>HOME</title>…

M0基础篇之ADC

本节课使用到的例程 一、Single模式例程基本配置的解释 在例程中我们只使用到了PA25这一个通道&#xff0c;因此我们使用的是Single这个模式&#xff0c;也就是我们在配置模式的时候使用的是单一转换。 进行多个通道的测量我们可以使用Sequence这个模式。 二、Single模式例程基…

OSPF综合实验实验报告

OSPF综合实验实验报告 一、实验拓扑 二、实验要求 1.R5为ISP&#xff0c;其上只能配置IP地址&#xff1b;R4作为企业边界路由器&#xff0c; 出口公网地址需要通过PPP协议获取&#xff0c;并进行chap认证 2&#xff0c;整个OSPF环境IP基于172.16.0.0/16划分&#xff1b; 3&…

vue3+ant design vue + Sortable实现多级表格列拖动

1、最近遇到个需求&#xff0c;需使用vue3ant design vue Sortable实现多级表格的表头允许用户拖拽移动。即当用户拖拽一级表头时&#xff0c;其对应的子级表头及数据应同步移动&#xff0c;并且只允许一级非固定表头允许拖拽。 2、代码 <a-table:data-source"rowDat…

基于开源链动2+1模式AI智能名片S2B2C商城小程序的分销价格管控机制研究

摘要&#xff1a;本文聚焦开源链动21模式AI智能名片S2B2C商城小程序在分销体系中的价格管控机制&#xff0c;通过解析其技术架构与商业模式&#xff0c;揭示平台如何通过"去中心化裂变中心化管控"双轨机制实现价格统一。研究显示&#xff0c;该模式通过区块链存证技术…

阿里云 SLS 多云日志接入最佳实践:链路、成本与高可用性优化

作者&#xff1a;裘文成&#xff08;翊韬&#xff09; 摘要 随着企业全球化业务的扩展&#xff0c;如何高效、经济且可靠地将分布在海外各地的应用与基础设施日志统一采集至阿里云日志服务 (SLS) 进行分析与监控&#xff0c;已成为关键挑战。 本文聚焦于阿里云高性能日志采集…

体育培训的实验室管理痛点 质检LIMS如何重构体育检测价值链

在竞技体育与全民健身并行的时代背景下&#xff0c;体育培训机构正面临双重挑战&#xff1a;既要通过科学训练提升学员竞技水平&#xff0c;又需严格把控运动安全风险。作为实验室数字化管理的核心工具&#xff0c;质检LIMS系统凭借其标准化流程管控与智能化数据分析能力&#…

设计模式【cpp实现版本】

文章目录 设计模式1.单例模式代码设计1.饿汉式单例模式2.懒汉式单例模式 2.简单工厂和工厂方法1.简单工厂2.工厂方法 3.抽象工厂模式4.代理模式5.装饰器模式6.适配器模式7.观察者模式 设计模式 1.单例模式代码设计 ​ 为什么需要单例模式&#xff0c;在我们的项目设计中&…

阿维塔汽车CAN总线数据适配技术解析与免破线数据采集实践

在智能电动汽车快速迭代的背景下&#xff0c;阿维塔凭借其高度集成的电子电气架构成为行业焦点。昨天我们经过实测&#xff0c;适配了该车型CAN总线数据适配的核心技术&#xff0c;从硬件接口定位、无损伤接线方案到关键动力系统数据解码进行系统性剖析&#xff0c;为智能诊断、…

用纯HTML和CSS仿写知乎登录页面

这是知乎的官方的登录页面 这是我的登录页面&#xff0c;使用 HTML CSS 进行编写。我觉得这是一个供前端新手练手的一个不错的小项目&#xff0c; 在这个系列&#xff0c;我将会用 HTML CSS 编写各大知名网站的登录界面&#xff0c;欢迎大家交流探讨。 源码展示: body{ba…

【Redis】C++如何使用redis

文章目录 1. redis客户端2. 使用通用命令3. 使用string命令3. 使用list命令4. 使用set命令5. 使用hash命令6. 使用zset命令 1. redis客户端 在前面的学习种&#xff0c;我们都是使用redis命令行客户端手动执行操作的&#xff1b;但是更多的时候&#xff0c;需要使用redis的api…

考研系列-408真题计算机组成原理篇(2010-2014)

写在前面 此文章是本人在备考过程中408真题计算机组成原理部分(2010年-2014年)的易错题及相应的知识点整理,后期复习也常常用到,对于知识提炼归纳理解起到了很大的作用,分享出来希望帮助到大家~ # 2010年 1.DRAM芯片的排列和编址方式 这个区别于多体交叉编址:这个可以理…

47.电压跌落与瞬时中断干扰的防护改善措施

电压跌落与瞬时中断干扰的防护改善措施 1. 电压跌落与瞬时中断的影响机理2. 解决措施 1. 电压跌落与瞬时中断的影响机理 跌落发生的常见场景如下&#xff1a; &#xff08;1&#xff09;电源插头接触不良&#xff0c;瞬态中断即刻恢复&#xff1b; &#xff08;2&#xff09;电…

极狐Gitlab 里程碑功能介绍

极狐GitLab 是 GitLab 在中国的发行版&#xff0c;关于中文参考文档和资料有&#xff1a; 极狐GitLab 中文文档极狐GitLab 中文论坛极狐GitLab 官网 里程碑 (BASIC ALL) 极狐GitLab 中的里程碑是一种跟踪议题和合并请求的方法&#xff0c;这些请求是为了在特定时间段内实现更…

一次Android Fragment内存泄露的bug解决记录|Fragment not attach to an Activity

Bug描述 前些天出现了一个 bug。Activity 页面里放了一个 ViewPager2&#xff0c;其中的每一页是一个 Fragment。其中第一页的 Fragment 实现了一个监听器&#xff0c;当事件发生和首次添加到监听器管理者 listener manager 时&#xff0c;manager 会通知所有监听者&#xff0…

LVGL图像导入和解码

LVGL版本&#xff1a;8.1 概述 在LVGL中&#xff0c;可以导入多种不同类型的图像&#xff1a; 经转换器生成的C语言数组&#xff0c;适用于页面中不常改变的固定图像。存储系统中的外部图像&#xff0c;比较灵活&#xff0c;可以通过插卡或从网络中获取&#xff0c;但需要配置…