{"id":26280085,"url":"https://github.com/kristofferstrube/blazor.mediastreamrecording","last_synced_at":"2025-07-12T03:38:20.301Z","repository":{"id":253710234,"uuid":"844286578","full_name":"KristofferStrube/Blazor.MediaStreamRecording","owner":"KristofferStrube","description":"A Blazor wrapper for the MediaStream Recording browser API.","archived":false,"fork":false,"pushed_at":"2024-11-14T19:38:18.000Z","size":9592,"stargazers_count":25,"open_issues_count":0,"forks_count":4,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-05-07T03:04:18.369Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"C#","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/KristofferStrube.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-08-18T23:42:38.000Z","updated_at":"2025-04-27T11:58:55.000Z","dependencies_parsed_at":"2024-11-14T20:27:23.799Z","dependency_job_id":"4b881780-67ae-423e-830b-5773891cdb2e","html_url":"https://github.com/KristofferStrube/Blazor.MediaStreamRecording","commit_stats":null,"previous_names":["kristofferstrube/blazor.mediastreamrecording"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/KristofferStrube%2FBlazor.MediaStreamRecording","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/KristofferStrube%2FBlazor.MediaStreamRecording/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/KristofferStrube%2FBlazor.MediaStreamRecording/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/KristofferStrube%2FBlazor.MediaStreamRecording/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/KristofferStrube","download_url":"https://codeload.github.com/KristofferStrube/Blazor.MediaStreamRecording/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":252804206,"owners_count":21806769,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-03-14T14:18:37.640Z","updated_at":"2025-05-07T03:04:27.589Z","avatar_url":"https://github.com/KristofferStrube.png","language":"C#","funding_links":[],"categories":[],"sub_categories":[],"readme":"[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](/LICENSE)\n[![GitHub issues](https://img.shields.io/github/issues/KristofferStrube/Blazor.MediaStreamRecording)](https://github.com/KristofferStrube/Blazor.MediaStreamRecording/issues)\n[![GitHub forks](https://img.shields.io/github/forks/KristofferStrube/Blazor.MediaStreamRecording)](https://github.com/KristofferStrube/Blazor.MediaStreamRecording/network/members)\n[![GitHub stars](https://img.shields.io/github/stars/KristofferStrube/Blazor.MediaStreamRecording)](https://github.com/KristofferStrube/Blazor.MediaStreamRecording/stargazers)\n[![NuGet Downloads (official NuGet)](https://img.shields.io/nuget/dt/KristofferStrube.Blazor.MediaStreamRecording?label=NuGet%20Downloads)](https://www.nuget.org/packages/KristofferStrube.Blazor.MediaStreamRecording/)\n\n# Blazor.MediaStreamRecording\nA Blazor wrapper for the [MediaStream Recording browser API.](https://www.w3.org/TR/mediastream-recording/)\n\nThis Web API makes it easy to record sound from a `MediaStream`.\nIt additionally makes it possible to query which encodings the current platform has available for recording.\nThis project implements a wrapper around the API for Blazor so that we can easily and safely record sound in the browser.\n\n# Demo\nThe sample project can be demoed at https://kristofferstrube.github.io/Blazor.MediaStreamRecording/\n\nOn each page, you can find the corresponding code for the example in the top right corner.\n\nOn the [API Coverage Status](https://kristofferstrube.github.io/Blazor.MediaStreamRecording/Status) page, you can see how much of the WebIDL specs this wrapper has covered.\n\n# Getting Started\n## Prerequisites\nYou need to install .NET 7.0 or newer to use the library.\n\n[Download .NET 7](https://dotnet.microsoft.com/download/dotnet/7.0)\n\n## Installation\nYou can install the package via NuGet with the Package Manager in your IDE or alternatively using the command line:\n```bash\ndotnet add package KristofferStrube.Blazor.MediaStreamRecording\n```\n\n# Usage\nThe package can be used in Blazor WebAssembly and Blazor Server projects.\n## Import\nYou need to reference the package in order to use it in your pages. This can be done in `_Import.razor` by adding the following.\n```razor\n@using KristofferStrube.Blazor.MediaStreamRecording\n```\n\n## Recording `MediaStream`\nThe primary purpose of the API is to record some `MediaStream`. You can get a `MediaStream` using the [Blazor.MediaCaptureStreams](https://github.com/KristofferStrube/Blazor.MediaCaptureStreams) library. After this you can use the following minimal sample for recording a `MediaStream`.\n\n```csharp\n// List to collect each recording part.\nList\u003cBlob\u003e blobsRecorded = new();\n\n// Create new MediaRecorder from some existing MediaStream.\nawait using MediaRecorder recorder = await MediaRecorder.CreateAsync(JSRuntime, mediaStream);\n\n// Add event listener for when each data part is available.\nawait using var dataAvailableEventListener =\n    await EventListener\u003cBlobEvent\u003e.CreateAsync(JSRuntime, async (BlobEvent e) =\u003e\n    {\n        Blob blob = await e.GetDataAsync();\n        blobsRecorded.Add(blob);\n    });\nawait recorder.AddOnDataAvailableEventListenerAsync(dataAvailableEventListener);\n\n// Starts Recording\nawait recorder.StartAsync();\n\n// Records for 5 seconds.\nawait Task.Delay(5000);\n\n// Stops recording\nawait recorder.StopAsync();\n\n// Combines and collects the total audio data.\nBlob combinedBlob = await Blob.CreateAsync(JSRuntime, [.. blobsRecorded]);\nbyte[] audioData = await combinedBlob.ArrayBufferAsync();\nawait combinedBlob.JSReference.DisposeAsync();\n\n// Dispose of blob parts created while recording.\nforeach (Blob blob in blobsRecorded)\n    await blob.JSReference.DisposeAsync();\n```\n\n\n# Related repositories\nThe library uses the following other packages to support its features:\n- https://github.com/KristofferStrube/Blazor.WebIDL (To make error handling JSInterop)\n- https://github.com/KristofferStrube/Blazor.DOM (To implement `MediaRecorder` which extends `EventTarget`)\n- https://github.com/KristofferStrube/Blazor.Window (For the `ErrorEvent` type that is also exposed via the `onError` event handler on `MediaRecorder`)\n- https://github.com/KristofferStrube/Blazor.MediaCaptureStreams (To enable the capturing of the `MediaStream`s that should be recorded)\n\n# Related articles\nThis repository was built with inspiration and help from the following series of articles:\n\n- [Typed exceptions for JSInterop in Blazor](https://kristoffer-strube.dk/post/typed-exceptions-for-jsinterop-in-blazor/)\n- [Blazor WASM 404 error and fix for GitHub Pages](https://blog.elmah.io/blazor-wasm-404-error-and-fix-for-github-pages/)\n- [How to fix Blazor WASM base path problems](https://blog.elmah.io/how-to-fix-blazor-wasm-base-path-problems/)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkristofferstrube%2Fblazor.mediastreamrecording","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fkristofferstrube%2Fblazor.mediastreamrecording","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkristofferstrube%2Fblazor.mediastreamrecording/lists"}