Porcupine Wake Word
React Quick Start
- Chrome & Chromium-based browsers
- Picovoice Account and AccessKey
- Node.js 16+
- React 17.0+
Picovoice Account & AccessKey
Signup or login to Picovoice Console to get your
Make sure to keep your
Porcupine, you'll need a Porcupine keyword file (
.ppn) as well as a model file (
.pv). Place these files in the project's public directory or generate base64 representations of the files using the built-in script:
porcupineKeyword and a
porcupineModel object with either of the methods above:
Import and call the
usePorcupine Hook, and initialize
Porcupine with your
To detect for multiple keywords, call
init with an array of keywords:
The Hook will take care of microphone access and audio downsampling (
To start audio recording and processing:
To stop audio recording and processing:
Allocated resources are automatically freed on unmount, but can also be done explicitly:
Create custom keywords using the Picovoice Console .
Train and download a Porcupine keyword model (
.ppn) for the target platform
This model file can be used directly with
publicPath, but, if
base64 is preferable, convert the
.ppn file to a base64
Similar to the model file (
.pv), keyword files (
.ppn) are saved in IndexedDB to be used by Web Assembly.
publicPath must be set for each keyword to instantiate Porcupine.
If both are set, Porcupine will use the
label is required to identify the keyword once the detection occurs.
In order to use Porcupine with other languages, you need to use the corresponding model file (
.pv) for the desired language. The model files for all
supported languages are available on the Porcupine GitHub repository .
For the Porcupine React SDK, there is a React demo project available on the Porcupine GitHub repository .
Clone the Porcupine repository from GitHub:
- Install dependencies:
- Run the demo with the
startscript with a language code to start a local web server hosting the demo in the language of your choice (e.g.
ko-> Korean). To see a list of available languages, run start without a language code.
Open http://localhost:3000 to view it in the browser.
Enter your access key and press on
Init Porcupineto start recording for keyword detections.
- @picovoice/porcupine-react on the npm registry
- @picovoice/porcupine-web on the npm registry
- @picovoice/web-voice-processor on the npm registry