frail-apricot•6d ago

how to add workflow as assistant in a nextjs application, please help

Do I just need to copy the workflow id and use in env variables or anything else

1 Reply

Sahil•3d ago

Hi there, Thank you for your message. Our team is currently out of the office. We operate Monday through Friday, from 9:00 AM to 8:00 PM Pacific Standard Time (PST). We’ll get back to you as soon as possible during our normal business hours. If your message is urgent, please mark it accordingly or include “URGENT” in the subject line, and we’ll do our best to respond promptly. Warm regards,
Vapi
Customer Support Team Hi abhinav_kr, To add a Vapi workflow to act as an assistant in your Next.js application, you can try to follow these general steps: 1. Set Up Vapi Account and API: Make sure you have a Vapi account and have generated your API key from the Vapi Dashboard. 2. Create a Workflow: Use the Vapi Dashboard to create the desired workflow. For a basic setup, you can follow the Workflows Quickstart Guide. 3. Integrate with Next.js: - Install necessary packages to perform HTTP requests (e.g., axios or fetch). - Use the created API key to connect your Next.js app with the Vapi API. 4. Implement Workflow Requests: In your application, make HTTP requests to the Vapi API endpoints to trigger workflows. Here's a basic example using fetch:

   const fetchWorkflow = async (input) => {
     const response = await fetch('https://api.vapi.ai/workflow', {
       method: 'POST',
       headers: {
         'Authorization': `Bearer YOUR_API_KEY`,
         'Content-Type': 'application/json',
       },
       body: JSON.stringify({
         input,
         workflowId: 'your-workflow-id',
       }),
     });
   
     const data = await response.json();
     return data;
   };

   const fetchWorkflow = async (input) => {
     const response = await fetch('https://api.vapi.ai/workflow', {
       method: 'POST',
       headers: {
         'Authorization': `Bearer YOUR_API_KEY`,
         'Content-Type': 'application/json',
       },
       body: JSON.stringify({
         input,
         workflowId: 'your-workflow-id',
       }),
     });
   
     const data = await response.json();
     return data;
   };

5. Handle Responses: Process the responses from Vapi to display information or take actions based on the workflow's output in your app. 6. Testing: Ensure to test with various scenarios to confirm that the integration behaves as expected. By following the steps above, you can bridge your workflow and Next.js application effectively. For detailed setup and variable handling, refer to Vapi's documentation. Let us know if you need further help.

how to add workflow as assistant in a nextjs application, please help

Did you find this page helpful?