Web calling w/ Vapi + LMNT
Make a web call to your assistant from the browser
Quickstart
Here is a v0 demo for how Vapi can be integrated into a web app to create a voice assistant with an LMNT voice. This example uses the Vapi web SDK to configure a new assistant and start a call with it.
v0 demo for LMNT + Vapi
To try live and to edit, follow these steps:
Retrieve Vapi API key
Grab your public API key from the Vapi dashboard.
Make sure your LMNT API key is configured in the Vapi dashboard as well!
Fork the app
Sign into v0 and select Fork to create your own copy of the app.
Add Vapi API key as environment variable
In settings -> environment variables
, create a new environment variable called NEXT_PUBLIC_VAPI_API_KEY
with
your Vapi public API key as the value.
Understanding the code
Let’s examine the code in page.tsx
that configures LMNT.
Calls to the Vapi assistant are made with vapi.start(assistantOptions)
. When
defining assistantOptions
, LMNT is selected and configured through the voice
property. Try changing the voiceId
to start a call with a different voice!
LMNT voice ids can be found in the LMNT playground’s voice library.
Next Steps
Learn more about Vapi web calling
Read on for more information on Vapi’s browser-based capabilities.