mediadevices
provides access to media input devices like cameras, microphones, and screen capture. It can also be used to encode your video/audio stream to various codec selections. mediadevices
abstracts away the complexities of interacting with things like hardware and codecs allowing you to focus on building appilcations, interacting only with an amazingly simple, easy, and elegant API!
go get -u github.com/pion/mediadevices
The following snippet shows how to capture a camera stream and store a frame as a jpeg image:
package main
import (
"image/jpeg"
"os"
"github.com/pion/mediadevices"
"github.com/pion/mediadevices/pkg/prop"
// This is required to register camera adapter
_ "github.com/pion/mediadevices/pkg/driver/camera"
// Note: If you don't have a camera or your adapters are not supported,
// you can always swap your adapters with our dummy adapters below.
// _ "github.com/pion/mediadevices/pkg/driver/videotest"
)
func main() {
stream, _ := mediadevices.GetUserMedia(mediadevices.MediaStreamConstraints{
Video: func(constraint *mediadevices.MediaTrackConstraints) {
// Query for ideal resolutions
constraint.Width = prop.Int(600)
constraint.Height = prop.Int(400)
},
})
// Since track can represent audio as well, we need to cast it to
// *mediadevices.VideoTrack to get video specific functionalities
track := stream.GetVideoTracks()[0]
videoTrack := track.(*mediadevices.VideoTrack)
defer videoTrack.Close()
// Create a new video reader to get the decoded frames. Release is used
// to return the buffer to hold frame back to the source so that the buffer
// can be reused for the next frames.
videoReader := videoTrack.NewReader(false)
frame, release, _ := videoReader.Read()
defer release()
// Since frame is the standard image.Image, it's compatible with Go standard
// library. For example, capturing the first frame and store it as a jpeg image.
output, _ := os.Create("frame.jpg")
jpeg.Encode(output, frame, nil)
}
Input | Linux | Mac | Windows |
---|---|---|---|
Camera |
|
|
|
Microphone |
|
|
|
Screen |
|
|
|
By default, there's no media input registered. This decision was made to allow you to play only what you need. Therefore, you need to import the associated packages for the media inputs. For example, if you want to use a camera, you need to import the camera package as a side effect:
import (
...
_ "github.com/pion/mediadevices/pkg/driver/camera"
)
In order to encode your video/audio, mediadevices
needs to know what codecs that you want to use and their parameters. To do this, you need to import the associated packages for the codecs, and add them to the codec selector that you'll pass to GetUserMedia
:
package main
import (
"github.com/pion/mediadevices"
"github.com/pion/mediadevices/pkg/codec/x264" // This is required to use H264 video encoder
_ "github.com/pion/mediadevices/pkg/driver/camera" // This is required to register camera adapter
)
func main() {
// configure codec specific parameters
x264Params, _ := x264.NewParams()
x264Params.Preset = x264.PresetMedium
x264Params.BitRate = 1_000_000 // 1mbps
codecSelector := mediadevices.NewCodecSelector(
mediadevices.WithVideoEncoders(&x264Params),
)
mediaStream, _ := mediadevices.GetUserMedia(mediadevices.MediaStreamConstraints{
Video: func(c *mediadevices.MediaTrackConstraints) {},
Codec: codecSelector, // let GetUsermedia know available codecs
})
}
Since mediadevices
doesn't implement the video/audio codecs, it needs to call the codec libraries from the system through cgo. Therefore, you're required to install the codec libraries before you can use them in mediadevices
. In the next section, it shows a list of available codecs, where the packages are defined (documentation linked), and installation instructions.
Note: we do not provide recommendations on choosing one codec or another as it is very complex and can be subjective.
A free software library and application for encoding video streams into the H.264/MPEG-4 AVC compression format.
brew install x264
apt install libx264-dev
A framework to enable H264 hardware encoding for Raspberry Pi or boards that use VideoCore GPUs.
A codec library which supports H.264 encoding and decoding. It is suitable for use in real time applications.
A free software video codec library from Google and the Alliance for Open Media that implements VP8/VP9 video coding formats.
brew install libvpx
apt install libvpx-dev
An open source API that allows applications such as VLC media player or GStreamer to use hardware video acceleration capabilities (currently support VP8/VP9).
apt install libva-dev
A totally open, royalty-free, highly versatile audio codec.
brew install opus
apt install libopus-dev
Result as of Nov 4, 2020 with Go 1.14 on a Raspberry pi 3, mediadevices
can produce video, encode, send across network, and decode at 720p, 30 fps with < 500 ms latency.
The test was taken by capturing a camera stream, decoding the raw frames, encoding the video stream with mmal, and sending the stream through Webrtc.
mediadevices
provides an automated driver discovery through GetUserMedia
and GetDisplayMedia
. The driver discover algorithm works something like:
So, when mediadevices
returns failed to find the best driver that fits the constraints
error, one of the following conditions might have occured:
import _ github.com/pion/mediadevices/pkg/driver/camera
export PION_LOG_DEBUG=all
to see what was too strict and tune that.RegisterDriverAdapter
Since mediadevices
uses cgo to access video/audio codecs, it needs to find these libraries from the system. To accomplish this, pkg-config is used for library discovery.
If you see the following error message at compile time:
# pkg-config --cflags -- vpx
Package vpx was not found in the pkg-config search path.
Perhaps you should add the directory containing `vpx.pc'
to the PKG_CONFIG_PATH environment variable
No package 'vpx' found
pkg-config: exit status 1
There are 2 common problems:
.pc
files for this codec (reference). In this case, you need to find where the codec library's .pc
is stored, and let pkg-config knows with: export PKG_CONFIG_PATH=/path/to/directory
.Pion has an active community on the Slack.
Follow the Pion Twitter for project updates and important WebRTC news.
We are always looking to support your projects. Please reach out if you have something to build!If you need commercial support or don't want to use public methods you can contact us at team@pion.ly
Check out the contributing wiki to join the group of amazing people making this project possible:
MIT License - see LICENSE for full text
判断函数有两个 switch 和 if 语句 MediaDevices.getUserMedia() 方法提示用户允许使用媒体输入,该媒体输入会生成一个 MediaStream,其中包含包含所请求的媒体类型的轨道。 例如,该流可以包括视频轨道(由硬件或虚拟视频源(如摄像机、视频录制设备、屏幕共享服务等)生成)、音轨(类似地,由物理或虚拟音频源(如麦克风、A/D 转换器等)生成)以及可能的其他轨道类
转载:https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices enumerateDevices() 获取有关系统上可用的媒体输入和输出设备的一系列信息。 getSupportedConstraints() 返回符合MediaTrackSupportedConstraints指示MediaStreamTrack接口支持哪些可约束属性
HTML5如何通过navigator.mediaDevices.getUserMedia调用手机摄像头 发布时间:2021-05-23 15:03:11 来源:亿速云 阅读:76 作者:小新 这篇文章主要介绍了HTML5如何通过navigator.mediaDevices.getUserMedia调用手机摄像头,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小
RecordRTC的视频录制及播放 recordRTC是前端的一个视频录制的工具,用于音频+视频+屏幕+画布(2D+3D动画)录制的WebRTC JavaScript库。 最近做了一个通过webRTC实现在线视频功能的网页,在自己的电脑上用localhost打开两个网页是没问题的,但是设置了一个简单的HTTP请求的NodeJS服务器之后,在局域网中用ip地址访问就不行了,浏览器会弹出 naviga
MediaDevices 接口提供访问连接媒体输入的设备,如照相机和麦克风,以及屏幕共享等。它可以使你取得任何硬件资源的媒体数据。 属性 从父类EventTarget中继承的属性. 事件 devicechange 返回 devicechange 事件类型的事件处理程序。 也可通过 ondevicechange 访问 方法 从其父项继承方法 EventTarget. MediaDevices.enu
MediaDevices.getUserMedia` undefined 的问题 字数:196,预计阅读时间:1min 通过 MediaDevices.getUserMedia() 获取用户多媒体权限时,需要注意其只工作于以下三种环境: localhost 域 开启了 HTTPS 的域 使用 file:/// 协议打开的本地文件 其他情况下,比如在一个 HTTP 站点上,navigator.med
navigator.mediaDevices.getUserMedia 应项目要求,需要实现移动端app嵌入H5页面完成实人认证的功能。打开getUserMedia文档,链接如下: https://developer.mozilla.org/zh-CN/docs/Web/API/MediaDevices/getUserMedia 看上去很简单,最终却写的怀疑人生。 API环境 问题一:(为什么不管
问题 最近在开发中,有一个功能需要实现录制屏幕的功能,我这边使用了recordrtc库,在过程中本地开发都没有问题,部署到线上环境时出现 navigator.mediaDevices为undefined,查找了不少文章和官方文章才得以解决 原因和解决方案 由于浏览器的安全策略导致了这个问题,目前经尝试,在以下几种情况中 navigator.mediaDevices 可以正常使用 1. 地址为lo
使用浏览器调用电脑得 摄像头功能 这次公司得项目需求,让我完成一个功能,当有电脑摄像头时,就使用,如果没有那么就使用屏幕得录像功能 首先是语法: 可以参考一下MDN 申明,以下代码凡是用到this.变量得地方,均是再 data中定义过得 调用电脑摄像头有方法 MediaDevices.getUserMedia() //拿到 摄像头 媒体流 async getUserMedia() {
参考:https://www.cnblogs.com/Wayou/p/js_audio_recorder.html 转载:https://developer.mozilla.org/zh-CN/docs/Web/API/MediaRecorder MediaRecorder 是 MediaStream Recording API 提供的用来进行媒体轻松录制的接口, 他需要通过调用 MediaRec
qrcode.js var video = document.createElement('video'); video.height = window.innerHeight; video.width = window.innerWidth; var canvasElement = document.getElementById('canvas'); var canvas = canvasEle
问题产生 最近在开发过程中,有一个具体需要要使用摄像头内嵌到h5页面中实现拍照效果,相当于变相通过还H5调原生拍照、摄像等效果。 在这个过程中发现在开发环境时,各种访问媒体设备都没有问题,但是当部署到服务器上,手机和电脑浏览器都无法调起摄像头,比较郁闷,阅读了很多文章和原生文档后才知道原因并解决。 问题分析解决 这是由于浏览器的安全策略导致的,目前本人翻阅到的文档,有下面三种情况是可以调起设备的,
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
interface MediaTrackConstraintSet { // 画面比例 aspectRatio?: ConstrainDouble; // 设备ID,可以从enumerateDevices中获取 deviceId?: ConstrainDOMString; // 摄像头前后置模式,一般适用于手机 facingMode?: Constr