{"_id":"@dongzeli95/opus-media-recorder","_rev":"2-5b82d88446228e163fc2784d03f56b12","name":"@dongzeli95/opus-media-recorder","dist-tags":{"latest":"0.9.1"},"versions":{"0.8.0":{"name":"@dongzeli95/opus-media-recorder","version":"0.8.0","author":{"name":"Bumsik Kim"},"license":"MIT","homepage":"https://github.com/kbumsik/opus-media-recorder","description":"MedialRecorer polyfill for Opus recording using WebAssembly","main":"OpusMediaRecorder.js","repository":{"type":"git","url":"https+git://github.com/kbumsik/opus-media-recorder"},"keywords":["MediaRecorder","MediaStream","Opus","Ogg","WebM","WebAssembly","WASM","PCM","Decoder","Stream","Audio","Microphone","Mic","Recorder","Recording","Wav","Wave"],"scripts":{"build":"make","build:production":"make PRODUCTION=1","webpack":"webpack-cli","serve":"webpack-dev-server","clean":"make clean"},"dependencies":{"detect-browser":"^4.1.0","event-target-shim":"^3.0.2"},"devDependencies":{"@babel/cli":"^7.2.3","@babel/core":"^7.2.2","@babel/preset-env":"^7.2.3","babel-loader":"^8.0.5","eslint":"^5.12.0","eslint-config-standard":"^11.0.0","eslint-loader":"^2.1.1","eslint-plugin-html":"^4.0.6","eslint-plugin-import":"^2.14.0","eslint-plugin-node":"^7.0.1","eslint-plugin-promise":"^4.0.1","eslint-plugin-standard":"^3.1.0","jsdoc":"^3.5.5","magic-string":"^0.25.2","webpack":"^4.28.4","webpack-cli":"^3.2.1","webpack-dev-server":"^3.1.14","wrapper-webpack-plugin":"^2.1.0"},"_id":"@dongzeli95/opus-media-recorder@0.8.0","gitHead":"033d10dfc7783557086c66413f7b4b0705779ea9","_nodeVersion":"20.5.0","_npmVersion":"10.5.2","dist":{"integrity":"sha512-kQbcezeBXOGyHlm6AhLmG+/FP2ZLnp/22zdhVYRUUYgrSogfagBTt2O3XFPNgrCljLJrHg2uFKylOms8FU3hug==","shasum":"c07b15248a6574893e73533ecdc3a27fbf52cfda","tarball":"https://registry.npmjs.org/@dongzeli95/opus-media-recorder/-/opus-media-recorder-0.8.0.tgz","fileCount":3,"unpackedSize":20409,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIAH1lroqVyQ7ffpg4jghZIexP0BxWGXV1CCpUU7soouXAiAlKOvs5Ir5WPLKUbIutgbUVtqg+0rLBikxZziq3vN8HA=="}]},"_npmUser":{"name":"dongzeli95","email":"dongzeli95@gmail.com"},"directories":{},"maintainers":[{"name":"dongzeli95","email":"dongzeli95@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/opus-media-recorder_0.8.0_1713645263252_0.040967238714419985"},"_hasShrinkwrap":false},"0.9.0":{"name":"@dongzeli95/opus-media-recorder","version":"0.9.0","author":{"name":"Bumsik Kim"},"license":"MIT","homepage":"https://github.com/kbumsik/opus-media-recorder","description":"MedialRecorer polyfill for Opus recording using WebAssembly","main":"OpusMediaRecorder.js","repository":{"type":"git","url":"https+git://github.com/kbumsik/opus-media-recorder"},"keywords":["MediaRecorder","MediaStream","Opus","Ogg","WebM","WebAssembly","WASM","PCM","Decoder","Stream","Audio","Microphone","Mic","Recorder","Recording","Wav","Wave"],"scripts":{"build":"make","build:production":"make PRODUCTION=1","webpack":"webpack-cli","serve":"webpack-dev-server","clean":"make clean"},"dependencies":{"detect-browser":"^4.1.0","event-target-shim":"^3.0.2"},"devDependencies":{"@babel/cli":"^7.2.3","@babel/core":"^7.2.2","@babel/preset-env":"^7.2.3","babel-loader":"^8.0.5","eslint":"^5.12.0","eslint-config-standard":"^11.0.0","eslint-loader":"^2.1.1","eslint-plugin-html":"^4.0.6","eslint-plugin-import":"^2.14.0","eslint-plugin-node":"^7.0.1","eslint-plugin-promise":"^4.0.1","eslint-plugin-standard":"^3.1.0","jsdoc":"^3.5.5","magic-string":"^0.25.2","webpack":"^4.28.4","webpack-cli":"^3.2.1","webpack-dev-server":"^3.1.14","wrapper-webpack-plugin":"^2.1.0"},"_id":"@dongzeli95/opus-media-recorder@0.9.0","gitHead":"033d10dfc7783557086c66413f7b4b0705779ea9","_nodeVersion":"20.5.0","_npmVersion":"10.5.2","dist":{"integrity":"sha512-dzVyAlKd5b0IYad+B9lmoAH4dyk3htxoN5tQEObP8UjadyK+jSGaym8LnmLlfivfFI+sSc3stTsoiFrfz32hOg==","shasum":"563bb3503ab36171f8dd42ac6b5af95267709266","tarball":"https://registry.npmjs.org/@dongzeli95/opus-media-recorder/-/opus-media-recorder-0.9.0.tgz","fileCount":15,"unpackedSize":1121288,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCaNTWxjrfZo+GShoHzU0w+t8vgAKRrzblVO9D1VdzNfgIgMpn4OZjIPjHgXzz8UwTSIgxVzjcuDcFf6+06Fyx7cII="}]},"_npmUser":{"name":"dongzeli95","email":"dongzeli95@gmail.com"},"directories":{},"maintainers":[{"name":"dongzeli95","email":"dongzeli95@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/opus-media-recorder_0.9.0_1713646880188_0.7737000892895785"},"_hasShrinkwrap":false},"0.9.1":{"name":"@dongzeli95/opus-media-recorder","version":"0.9.1","author":{"name":"Bumsik Kim"},"license":"MIT","homepage":"https://github.com/kbumsik/opus-media-recorder","description":"MedialRecorer polyfill for Opus recording using WebAssembly","main":"OpusMediaRecorder.js","repository":{"type":"git","url":"https+git://github.com/kbumsik/opus-media-recorder"},"keywords":["MediaRecorder","MediaStream","Opus","Ogg","WebM","WebAssembly","WASM","PCM","Decoder","Stream","Audio","Microphone","Mic","Recorder","Recording","Wav","Wave"],"scripts":{"build":"make","build:production":"make PRODUCTION=1","webpack":"webpack-cli","serve":"webpack-dev-server","clean":"make clean"},"dependencies":{"detect-browser":"^4.1.0","event-target-shim":"^3.0.2"},"devDependencies":{"@babel/cli":"^7.2.3","@babel/core":"^7.2.2","@babel/preset-env":"^7.2.3","babel-loader":"^8.0.5","eslint":"^5.12.0","eslint-config-standard":"^11.0.0","eslint-loader":"^2.1.1","eslint-plugin-html":"^4.0.6","eslint-plugin-import":"^2.14.0","eslint-plugin-node":"^7.0.1","eslint-plugin-promise":"^4.0.1","eslint-plugin-standard":"^3.1.0","jsdoc":"^3.5.5","magic-string":"^0.25.2","webpack":"^4.28.4","webpack-cli":"^3.2.1","webpack-dev-server":"^3.1.14","wrapper-webpack-plugin":"^2.1.0"},"_id":"@dongzeli95/opus-media-recorder@0.9.1","gitHead":"a984e710e7b106ca4fc6324cb28d496605cd0af6","_nodeVersion":"20.5.0","_npmVersion":"10.5.2","dist":{"integrity":"sha512-nSmzYo5XeK/WC2FxWAnMY+bh9OeHJUm8Apgg/xMXdlRidRBc5oLN5r3obDz5R8sq+wlQtXlcIkGs9p1WpQOKZQ==","shasum":"753e30d6bf7b98cdcea4c2fe0995d3230f95b644","tarball":"https://registry.npmjs.org/@dongzeli95/opus-media-recorder/-/opus-media-recorder-0.9.1.tgz","fileCount":15,"unpackedSize":1121288,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHtMTB76GUErMQTBXpC17gW4jRaRj5zQG6hKOsCI4YiKAiBv18O5lafsKhGM41VSqA2JKDDG16JfbvESs3ANb+n6IQ=="}]},"_npmUser":{"name":"dongzeli95","email":"dongzeli95@gmail.com"},"directories":{},"maintainers":[{"name":"dongzeli95","email":"dongzeli95@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/opus-media-recorder_0.9.1_1713648462614_0.05840678373783992"},"_hasShrinkwrap":false}},"time":{"created":"2024-04-20T20:34:23.154Z","0.8.0":"2024-04-20T20:34:23.403Z","modified":"2024-04-20T21:27:43.019Z","0.9.0":"2024-04-20T21:01:20.389Z","0.9.1":"2024-04-20T21:27:42.837Z"},"maintainers":[{"name":"dongzeli95","email":"dongzeli95@gmail.com"}],"description":"MedialRecorer polyfill for Opus recording using WebAssembly","homepage":"https://github.com/kbumsik/opus-media-recorder","keywords":["MediaRecorder","MediaStream","Opus","Ogg","WebM","WebAssembly","WASM","PCM","Decoder","Stream","Audio","Microphone","Mic","Recorder","Recording","Wav","Wave"],"repository":{"type":"git","url":"https+git://github.com/kbumsik/opus-media-recorder"},"author":{"name":"Bumsik Kim"},"license":"MIT","readme":"# opus-media-recorder\n\n* [Try it!](https://kbumsik.io/opus-media-recorder/)\n* [JS Fiddle example](https://jsfiddle.net/kbumsik/v3wpnxao/)\n\n`opus-media-recorder` is a [MediaRecorder API](https://w3c.github.io/mediacapture-record/#mediarecorder-api) polyfill written in ES6 and WebAssembly. It aims for cross-browser Opus codec support with various audio formats such as Ogg and WebM. `opus-media-recorder` can be used as a polyfill, or it can replace the built-in MediaRecorder since `opus-media-recorder` supports more MIME types.\n\n`opus-media-recorder` uses WebAssembly compiled from popular libraries (e.g libopus, libogg, libwebm, and speexdsp) to ensure good performance and standards-compliance.\n\n- [Why opus-media-recorder?](#why-opus-media-recorder)\n- [How to use](#how-to-use)\n  - [Thing to know](#thing-to-know)\n  - [JavaScript](#javascript)\n    - [Examples](#examples)\n    - [Installation](#installation)\n    - [Working with a bundler](#working-with-a-bundler)\n    - [Simple JavaScript example (webpack)](#simple-javascript-example-webpack)\n  - [HTML `<script>` tag](#html-script-tag)\n  - [Use opus-media-recorder only when a browser doesn't support it](#use-opus-media-recorder-only-when-a-browser-doesnt-support-it)\n- [Browser support](#browser-support)\n- [MIME Type support](#mime-type-support)\n- [Limitations](#limitations)\n- [How to build](#how-to-build)\n- [Changelog](#changelog)\n\n## Why opus-media-recorder?\n\n|              | opus-media-recorder | Chrome | Firefox | iOS | Edge |\n|--------------|:-------------------:|:------:|:-------:|:---:|:----:|\n| `audio/ogg`  |          O          |    X   |    O    |  X  |   X  |\n| `audio/webm` |          O          |    O   |    X    |  X  |   X  |\n| `audio/wav`  |          O          |    X   |    X    |  X  |   X  |\n\n\\* Both `audio/ogg` and `audio/webm` refer containers for Opus audio codec.\n\nCurrently the MediaRecorder API suffers from the two problems:\n\n1. Not all browsers support MediaRecorder.\n2. Even the browsers that provides MediaRecorder don't support the same format.\n\n`opus-media-recorder` tackles these problems by supporting all major modern browsers (Chrome, Firefox, iOS, and Edge) and by providing various formats.\n\nBy taking advantages of WebAssembly and Web Workers, `opus-media-recorder` tries to have minimum performace penalties of running encoders in a browser.\n\n## How to use\n\nopus-media-recorder is compatible with the [Mediastream Recording API](https://developer.mozilla.org/en-US/docs/Web/API/MediaRecorder) standard.\n\n### Thing to know\n\n* The page must be served over HTTPS in order to record.\n* Being able to record does *not always* mean you can play it in a browser:\n  * macOS/iOS Safari cannot play Opus natively yet.\n  * Old Edge requires [an extension](https://wpdev.uservoice.com/forums/257854-microsoft-edge-developer/suggestions/6513488-ogg-vorbis-and-opus-audio-formats-support-firefox) to play Opus natively.\n  * You can get an Opus decorder to play it. There are Opus decoders available, such as [Chris Rudmin's Opus decoder](https://github.com/chris-rudmin/opus-recorder).\n  * Otherwise, users can download as a recording file and play it using apps like [VLC](https://www.videolan.org/vlc/index.html).\n* When `mimeType` is not specified a default encoder is loaded depending on OS:\n  * Chrome: `audio/webm`\n  * Firefox: `audio/ogg`\n  * Edge: `audio/webm`\n  * iOS/macOS Safari: `audio/wave` - because they cannot play Opus at all.\n\n### JavaScript\n\nFor standard usages of `MediaRecorder`, see the [MDN reference](https://developer.mozilla.org/en-US/docs/Web/API/MediaRecorder) and other online resources. Our [testing website](docs) and [example section](example) may be useful as well.\n\n#### Examples\n\n* [Webpack](example/webpack)\n* [create-react-app](example/create-react-app)\n* [Rollup](example/rollup)\n* [Browserify](example/browserify)\n\n#### Installation\n\n```bash\nnpm install --save-dev opus-media-recorder\n```\n\n#### Working with a bundler\n\nBecause `opus-media-recorder` needs to load a dedicated web worker and `.wasm` binaries, special configurations are necessary. In general:\n\n```javascript\nimport OpusMediaRecorder from 'opus-media-recorder';\n// Choose desired format like audio/webm. Default is audio/ogg\nconst options = { mimeType: 'audio/ogg' }\n// Web worker and .wasm configuration. Note: This is NOT a part of W3C standard.\nconst workerOptions = {\n  encoderWorkerFactory: function () {\n    // UMD should be used if you don't use a web worker bundler for this.\n    return new Worker('.../path/to/opus-media-recorder/encoderWorker.umd.js')\n  },\n  OggOpusEncoderWasmPath: '.../path/to/opus-media-recorder/OggOpusEncoder.wasm',\n  WebMOpusEncoderWasmPath: '.../path/to/opus-media-recorder/WebMOpusEncoder.wasm'\n};\n\nwindow.MediaRecorder = OpusMediaRecorder;\nrecorder = new MediaRecorder(stream, options, workerOptions);\n```\n\n#### Simple JavaScript example (webpack)\n\n```javascript\nimport MediaRecorder from 'opus-media-recorder';\n// Use worker-loader\nimport EncoderWorker from 'worker-loader!opus-media-recorder/encoderWorker.js';\n// You should use file-loader in webpack.config.js.\n// See webpack example link in the above section for more detail.\nimport OggOpusWasm from 'opus-media-recorder/OggOpusEncoder.wasm';\nimport WebMOpusWasm from 'opus-media-recorder/WebMOpusEncoder.wasm';\n\n// Non-standard options\nconst workerOptions = {\n  encoderWorkerFactory: _ => new EncoderWorker(),\n  OggOpusEncoderWasmPath: OggOpusWasm,\n  WebMOpusEncoderWasmPath: WebMOpusWasm\n};\n\nlet recorder;\n\nfunction startRecording () {\n  navigator.mediaDevices.getUserMedia({ audio: true }).then(stream => {\n    let options = { mimeType: 'audio/ogg' };\n    // Start recording\n    recorder = new MediaRecorder(stream, options, workerOptions);\n    recorder.start();\n    // Set record to <audio> when recording will be finished\n    recorder.addEventListener('dataavailable', (e) => {\n      audioElement.src = URL.createObjectURL(e.data);\n    });\n  });\n}\n\n// Recording should be started in user-initiated event like buttons\nrecordButton.addEventListener('click', startRecording);\n\n// Stop recording\nstopButton.addEventListener('click', () => {\n  recorder.stop();\n  // Remove “recording” icon from browser tab\n  recorder.stream.getTracks().forEach(i => i.stop());\n})\n```\n\n### HTML `<script>` tag\n\nThe `OpusMediaRecorder` object is available in the global namespace using [UMD](https://github.com/umdjs/umd).\n\n```html\n<!-- load OpusMediaRecorder.umd.js. OpusMediaRecorder will be loaded. -->\n<script src=\"https://cdn.jsdelivr.net/npm/opus-media-recorder@latest/OpusMediaRecorder.umd.js\"></script>\n<!-- load encoderWorker.umd.js. This should be after OpusMediaRecorder. -->\n<!-- This script tag will create OpusMediaRecorder.encoderWorker. -->\n<script src=\"https://cdn.jsdelivr.net/npm/opus-media-recorder@latest/encoderWorker.umd.js\"></script>\n\n<script>\n...\n// If you already load encoderWorker.js using <script> tag,\n// you don't need to define encoderWorkerFactory.\nconst workerOptions = {\n  OggOpusEncoderWasmPath: 'https://cdn.jsdelivr.net/npm/opus-media-recorder@latest/OggOpusEncoder.wasm',\n  WebMOpusEncoderWasmPath: 'https://cdn.jsdelivr.net/npm/opus-media-recorder@latest/WebMOpusEncoder.wasm'\n};\n\n// Replace MediaRecorder\nwindow.MediaRecorder = OpusMediaRecorder;\nlet recorder = new MediaRecorder(stream, {}, workerOptions);\n...\n</script>\n```\n\n### Use opus-media-recorder only when a browser doesn't support it\n\n```javascript\n// Check if MediaRecorder available.\nif (!window.MediaRecorder) {\n  window.MediaRecorder = OpusMediaRecorder;\n}\n// Check if a target format (e.g. audio/ogg) is supported.\nelse if (!window.MediaRecorder.isTypeSupported('audio/ogg;codecs=opus')) {\n  window.MediaRecorder = OpusMediaRecorder;\n}\n```\n\n## Browser support\n\nSupported:\n\n* Chrome >= 58\n* Firefox >= 53\n* Microsoft Edge >= 41\n* Safari (macOS and iOS) >= 11\n\nBrowsers with issues:\n\n* iOS 11.2 only: Not working due to a regression in WebAssembly: https://bugs.webkit.org/show_bug.cgi?id=181781\n\n## MIME Type support\n\n* `audio/webm`\n* `audio/webm; codecs=opus`\n* `audio/ogg`\n* `audio/ogg; codecs=opus`\n* `audio/wav` or `audio/wave`\n\n## Limitations\n\n* Does not support Video recording.\n* `opus-media-recorder` throws generic Error objects instead of native DOMException.\n* Because `audio/wav` is not designed for streaming, when `mimeType` is `audio/wav`, each `dataavailabe` events produces a complete and separated `.wav` file that cannot be concatenated together unlike Ogg and WebM. Therefore, it is recommended not to use `timeslice` option when calling `start()`, unless you know what the implication is.\n* There is no [`SecurityError`](https://w3c.github.io/mediacapture-record/#exception-summary) case implemented. (WIP)\n\n## How to build\n\n1. To build from the source, you need [Emscripten](https://github.com/kripken/emscripten), [yarn](https://yarnpkg.com), Python 2.7 or higher, and basic C program build systems such as [GNU Make](https://www.gnu.org/software/make/).\n\n2. `yarn install` to install JavaScript dependencies.\n\n3. `yarn run build` to build. `yarn run build:production` to build files for distribution.\n\n4. `yarn run serve` to run a test web server locally. Default URL is `https://localhost:9000` (It has to be HTTPS). You might have to change `DEV_SERVER_URL` and `DEV_SERVER_PORT` to change the address of the local test server.\n\n5. `yarn run clean` to clean up build files.\n\n## Changelog\n\nSee [CHANGELOG.md](CHANGELOG.md).\n","readmeFilename":"README.md"}