备案控制台
探索云世界
开发者社区 开发与运维 文章 正文

前端（六）：读取本地音视频设备并进行播放

2023-07-21 91
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： 读取本地音视频设备并进行播放

效果

image.png

navigator.mediaDevices.enumerateDevices

请求媒体输入和输出设备的列表，例如麦克风，摄像机，耳机设备等

navigator.mediaDevices.getUserMedia

会提示用户给予使用媒体输入的许可，媒体输入会产生一个MediaStream，里面包含了请求的媒体类型的轨道。此流可以包含一个视频轨道（来自硬件或者虚拟视频源，比如相机、视频采集设备和屏幕共享服务等等）、一个音频轨道（同样来自硬件或虚拟音频源，比如麦克风、A/D 转换器等等），也可能是其他轨道类型

源码

```html



请选择


请选择



```

文章标签：
前端开发
关键词：
前端播放
前端设备
ProsperLee
目录
相关文章
音视频牛哥
|
7月前
|
编解码 前端开发 Android开发
如何让Android平台像IPC一样实现GB28181前端设备接入
好多开发者在做国标对接的时候，首先想到的是IPC摄像头，通过参数化配置，接入到国标平台，实现媒体数据的按需查看等操作。
音视频牛哥
45 0
Boale_H
|
1月前
|
前端开发
前端播放第三方外链视频报403 forbidden的原因及解决方案
前端播放第三方外链视频报403 forbidden的原因及解决方案
Boale_H
64 0
音视频牛哥
|
7月前
|
编解码 监控 前端开发
如何快速实现Android平台前端设备接入能力
SIP(会话初始化协议)是在 IP网络上进行多媒体通信的应用层控制协议，以几种RFC的形式提供，其中最重要的是包含核心协议规范的RFC3261。该协议用于创建，修改和终止与一个或多个参与者的会话。通过会话，我们了解了一组进行通信的发送方和接收方，以及在通信过程中这些发送方和接收方保持的状态。会话的示例可以包括Internet电话呼叫，多媒体分发，多媒体会议，分布式计算机游戏等。
音视频牛哥
49 0
音视频牛哥
|
7月前
|
编解码 监控 前端开发
如何实现Android平台GB28181前端设备接入
在实现Android平台GB28181前端设备接入之前，我们几年前就有了非常成熟的RTMP推送、RTSP推送和轻量级RTSP服务等模块，特别是RTMP推送，行业内应用非常广泛，好多开发者可能会问，既然有了以上模块，干嘛还要实现GB28181的前端接入呢？
音视频牛哥
120 0
前端李十三
|
8月前
|
JavaScript 前端开发
Vue前端获取客户端设备类型
Vue前端获取客户端设备类型
前端李十三
137 0
ProsperLee
|
9月前
|
移动开发 前端开发
前端（四）：移动端页面闪烁、设备识别、全屏切换
移动端页面闪烁、设备识别、全屏切换
ProsperLee
88 0
HeartSuit
|
11月前
|
存储 JavaScript 前端开发
TDengine极简实战：从采集到入库，从前端到后端，体验物联网设备数据流转
TDengine极简实战：从采集到入库，从前端到后端，体验物联网设备数据流转
HeartSuit
1044 1
萌狼蓝天
|
前端开发
【前端】CSS实现图片文字对齐 并随着设备尺寸改变而改变大小
【前端】CSS实现图片文字对齐 并随着设备尺寸改变而改变大小
萌狼蓝天
167 0
【前端】CSS实现图片文字对齐 并随着设备尺寸改变而改变大小
开发者说
|
存储 自然语言处理 前端开发
OTT端登录态设备穿透：扫码登录与扫码反登录 | 《优酷OTT互联网大屏前端技术实践》第二章
常规“扫码登录”业务，一般由PC端和手机端两部分组成，而且PC端一般作为“被扫码方”，登录态则由手机端进行操作及确认。那以“CIBN酷喵影视”为代表的OTT大屏电视场景，其扫码登录实现情况又是怎样的呢？
开发者说
969 0
OTT端登录态设备穿透：扫码登录与扫码反登录 | 《优酷OTT互联网大屏前端技术实践》第二章
朗锐智科1
|
机器学习/深度学习 人工智能 算法
嵌入式人工智能前端设备智能化前景广阔
朗锐智科1
1561 0

热门文章

最新文章

  • 1
    构建高效响应式Web界面：现代前端框架的比较
  • 2
    Nginx配置详解Docker部署Nginx使用Nginx部署vue前端项目
  • 3
    前端开发中的跨域问题及解决方案
  • 4
    前端最常见的JS面试题大全
  • 5
    前端代码整洁与规范之CSS篇
  • 6
    ECS负载问题之前端包加载很慢如何解决
  • 7
    使用机器学习优化前端用户体验
  • 8
    探索前端开发中的新趋势：WebAssembly 技术应用与展望
  • 9
    layui：从崛起到蜕变，前端框架的华丽篇章
  • 10
    Web 前端开发中的最佳实践
  • 1
    构建响应式Web界面：现代前端开发的最佳实践
    42
  • 2
    探索现代Web应用中的微前端架构
    29
  • 3
    构建高效前端项目：模块化与组件化策略
    31
  • 4
    前端发展趋势：WebAssembly、PWA 和响应式设计
    26
  • 5
    前端开发新趋势：Web3、区块链和虚拟现实
    37
  • 6
    架构的未来：微前端与微服务的融合
    63
  • 7
    前端模块规划
    14
  • 8
    调试前端时，在浏览器上修改参数并重新调用接口
    42
  • 9
    构建响应式Web界面：Flutter的跨界前端技术
    63
  • 10
    前端的CSS选择器
    23

    • 相关课程

    更多
  • 网站性能前端监控课程
  • 移动Web前端开发
  • Ajax 前端开发入门与实战
  • 零基础学前端HTML+CSS
  • 前端开发CSS基础
  • 前端开发框架Bootstrap使用教程

    • 相关电子书

    更多
  • Vue.js 在前端服务化上的探索与实践
  • 阿里文娱大前端技术实践
  • 前端代码是怎样智能生成的

    • 相关实验场景

    更多
  • 前端开发基础3：CSS3常见显示属性
  • 前端开发基础6：Node.js和LESS预编译工具
  • 前端开发基础2：VS Code和Edge的联动开发
  • 前端开发基础1：前端开发环境的安装和配置
  • 快速实现摄像头视频画面的远程预览
  • 基于函数计算实现音视频转码
    • 下一篇
    部署LAMP环境（Alibaba Cloud Linux 3）