问题标签 [mediastream]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
4166 浏览

javascript - 正确使用 MediaRecorder 与 start 指定的时间片参数的方法

阅读此页面https://developer.mozilla.org/en-US/docs/Web/API/MediaRecorder.start后,我​​编写了自己的代码:

我希望在#recordingCamera 元素显示我相机的内容后 3 秒后,我将在 #replay 元素中看到内容重播。
但是#replay 元素只播放 3 秒。之后,#recordingCamera 元素仍然显示摄像机内容,但 #replay 元素没有其他内容。
检查控制台时,我发现了以下消息:

ondataavailable仍然触发,但数据发生了问题。

我的问题

  • 这是Firefox的错误吗?
  • 如果不是,那么使用带有 start 指定的时间片参数的 MediaRecorder 的正确方法是什么?
0 投票
0 回答
319 浏览

webrtc - 释放在 Firefox 中不起作用的用户媒体

我正在为我的应用程序使用网络摄像头和麦克风。当我完成视频和音频部分时,我想释放这两个设备。网络摄像头灯一直亮着,直到我明确停止共享它或刷新页面。

我尝试实现这个问题中给出的答案,但没有任何运气 -停止/关闭由 navigator.getUserMedia 打开的网络摄像头

我不确定出了什么问题。

0 投票
0 回答
1231 浏览

javascript - 从 URL.createObjectUrl(mediastream) 获取的 Blob Url 返回 HTTP 404

我正在尝试将 MediaStream 对象放入 blob,但我遇到了一些问题。

这是我的UserMedia组件脚本的一部分:

这是我正在尝试测试的脚本:

将 blobUrl 设置为 video.src 我没有任何问题: video.src = blobUrl; <- WORKS

但是,如果我调用 urlBob url(比如这个:),blob:http%3A//localhost%3A8080/b1ffa5b7-c0cc-4acf-8890-f5d0f08de9cb我会获得 HTTP 状态 404。

我的实现肯定有问题。有什么建议么?

谢谢!

0 投票
0 回答
567 浏览

html - 获取 html5 视频内容为 base64

我有一个带有 src 属性的 html5 视频标签,指向一些带有 mp4 文件的网站。加载为 base64 字符串后是否可以获取该视频的内容?

UPD:我需要浏览器内的二进制视频数据。

谢谢。

0 投票
1 回答
24084 浏览

webrtc - 如何在 WebRTC 的 MediaStream 中添加Track

我正在使用 webrtc 在对等方之间进行通信。我不想向旧生成的流添加新曲目,因为我不想为用户提供在音频通信期间切换麦克风的功能。我正在使用的代码是,

让“pc”是发生音频通信的 peerConnection 对象,“newStream”是从 getUserMedia 函数获得的新生成的 MediaStream 与新选择的麦克风设备。

他们是否以任何方式使新添加的轨道开始到达另一个先前连接的对等点,而无需再次向他提供整个 SDP?

在这种情况下,当对等点之间已经建立连接时,在切换媒体设备(即麦克风)的这种情况下使用的优化方法是什么?

0 投票
2 回答
3897 浏览

html - 如何在html5中绘制音频流的波形?

我有来自网络摄像头的媒体流。我需要动态绘制音频的波形(从媒体流中提取)。如何使用 JS 在 HTML5 中做到这一点?

我检查了:

https://github.com/soundcloud/waveformjs

https://github.com/katspaugh/wavesurfer.js

它们似乎都适用于音频文件。如何为流做到这一点?

0 投票
3 回答
2339 浏览

javascript - 删除录制图标 MediaStreamRecorder.js 库?

我正在使用 MediaStreamRecorder.js 库通过 Javascript 进行音频捕获。几乎一切正常。我发现的唯一问题是,当我单击停止以停止录制时,红色的录制图标仍然在那里,在选项卡上。任何人都知道当您单击停止时我如何删除此图标?

jsFiddle 中的示例:https ://jsfiddle.net/davidsadan/wazb1jks

这是我单击停止时的打印结果:

在此处输入图像描述

ps:它只适用于https,对不起我的英语,我是巴西人......

0 投票
1 回答
4026 浏览

javascript - 以全分辨率捕获 HTML5 中的图像

可以使用 MediaStream API 在 javascript 中捕获图像。但为了做到这一点,首先需要实例化一个视频对象,然后将帧绘制到画布中以获取图像。但不幸的是,许多设备(例如手机)不允许您以设备的完整原始分辨率捕获视频。例如,在我的手机上,最大图像分辨率约为 4000x3000,但最大视频分辨率仅为 1920x1080。显然,捕获仅是可用分辨率 1/6 的图像是不可接受的。

那么如何在设备上访问相机的全分辨率呢?

0 投票
3 回答
9272 浏览

javascript - Saving desktopCapturer to video file in Electron

The desktopCapturer api example shows how to write a screen capture stream to a <video> element.

I tried to replace the gotStream function with the following:

This creates a text file with [object MediaStream] as the contents.

How can I record this stream and save to a file on disk?

0 投票
1 回答
192 浏览

node.js - 无法在控制台中看到 MediaStream 属性值

我对 WebRTC 和 Node.js 完全陌生 我正在尝试使用教程http://www.tutorialspoint.com/webrtc/webrtc_media_stream_apis.htm构建示例 webRTC 应用程序 除了我创建了自己的步骤之外,我遵循了完全相同的步骤Nodejs 服务器使用来自同一站点的 nodejs 教程。如 webrtc 教程中所述,我无法在控制台中看到 MediaStream 的属性值。就我而言,它完全是空白的。有什么我做错了吗。我的文件在http://127.0.0.1:8081/index.html上运行,我可以看到我的本地视频。