Tag

MediaRecorder

0 views collected around this technical thread.

Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Apr 28, 2024 · Frontend Development

Implementing WebRTC Media Capture, Recording, and Real‑Time Speech Recognition in Web Applications

This article provides a comprehensive guide on using WebRTC, getUserMedia, and MediaRecorder to capture camera and microphone streams, perform screen capture, visualize audio, handle device and network checks, convert media formats, and integrate real‑time speech‑to‑text services, while sharing practical pitfalls and solutions.

AudioVisualizationMediaRecorderVideoCapture
0 likes · 22 min read
Implementing WebRTC Media Capture, Recording, and Real‑Time Speech Recognition in Web Applications
360 Smart Cloud
360 Smart Cloud
Aug 31, 2022 · Frontend Development

WebRTC Basics: Accessing Media Devices, Streams, Screen Sharing, and Recording

This article introduces WebRTC fundamentals, explains how to enumerate audio/video devices, describes MediaStream and MediaStreamTrack concepts, demonstrates using getUserMedia for media capture with constraints, shows screen sharing via getDisplayMedia, and provides code examples for recording and downloading video streams using MediaRecorder.

MediaDevicesMediaRecorderScreenSharing
0 likes · 9 min read
WebRTC Basics: Accessing Media Devices, Streams, Screen Sharing, and Recording
ByteFE
ByteFE
Aug 23, 2021 · Frontend Development

Technical Exploration and Implementation of Cross‑Platform Web Screen Recording Using WebRTC, rrweb, and ffmpeg in Electron

This article presents a comprehensive technical analysis of cross‑platform web screen recording, covering strict business requirements, evaluation of rrweb, ffmpeg, and WebRTC solutions, detailed implementations for video and audio capture in Electron, handling of lock‑screen issues, WebM metadata fixes, memory‑usage constraints, and performance optimizations.

ElectronMediaRecorderScreen Recording
0 likes · 49 min read
Technical Exploration and Implementation of Cross‑Platform Web Screen Recording Using WebRTC, rrweb, and ffmpeg in Electron
ByteFE
ByteFE
Jan 12, 2021 · Frontend Development

Recording Canvas Animations to Video Using the Media Streams API

This article demonstrates how to capture a Canvas animation as a video using the Media Streams API and MediaRecorder, providing step‑by‑step code examples, integration with ffmpeg‑wasm for audio, and discusses use cases such as online teaching and resource‑efficient playback.

Media Streams APIMediaRecordercanvas
0 likes · 6 min read
Recording Canvas Animations to Video Using the Media Streams API