React Quick Start
- Chrome & Chromium-based browsers
- Picovoice Account and AccessKey
- Node.js 14+
- React 17+
Picovoice Account & AccessKey
Signup or Login to Picovoice Console to get your
Make sure to keep your
Rhino you'll need a
Rhino context file (
.rhn) as well as a
model file (
.pv). Place these files in the project's
public directory or generate a base64 representation of the file using the built-in script:
Pass the path to the file (relative to the public directory) or use the base64 string:
useRhino Hook that infers intent from spoken commands within
a given context:
To start detecting an inference, run the
process function initializes WebVoiceProcessor.
Rhino will then listen and process frames of microphone audio until it reaches a conclusion, then return the result via the
Once a conclusion is reached Rhino will enter a paused state. From the paused state Rhino call
process again to detect another inference.
Allocated resources are automatically freed on unmount, but can also be done explicitly:
Create custom contexts in the Picovoice Console using
the Rhino Grammar. Train and download a Rhino context file (
.rhn) for the target platform
Web (WASM). This model file can be used directly with
publicPath, but, if
base64 is preferable, convert the
.rhn file to a base64
Similar to the model file (
.pv), context files (
.rhn) are saved in IndexedDB to be used by Web Assembly. Either
publicPath must be set for the context to instantiate Rhino.
If both are set, Rhino will use the
In order to use Rhino with different languages you need to use the corresponding model file (
.pv) for the desired language.
The model files for all supported languages are available in the Rhino GitHub repository.
For the Rhino React SDK, there is a React demo project available on the Rhino GitHub repository.
Clone the Rhino repository from GitHub:
- Install dependencies and run:
- Open http://localhost:3000 to view it in the browser.