logo

Context Provider

Vocale Provider

The VocaleProvider component serves as a crucial piece in the integration of Vocale with React applications. It is the one in charge of authenticating against the service and should be placed on the wrapper component of your app.

Usage

  • Import the VocaleProvider from the Vocale React library.
  • Wrap your application or the relevant portion of it with VocaleProvider, passing the necessary configuration props.
import React from 'react';
import { VocaleProvider } from '@vocale/react';

function App() {
  return (
    <VocaleProvider siteId="YOUR_SITE_ID">
      {/* Your application components */}
    </VocaleProvider>
  );
}

Props

  • Site Identifier (siteId) required:

    • Serves as a unique identifier for the site or application using the Vocale.js library.You can get your Site ID by registering in Vocale and setting up your site.
  • API Key (apiKey):

    • Required for authentication with the Vocale.ai service when using the library outside of the browser. In the case of React this would apply for on-device apps.
    • You can get it from the setup assistant under the Javascript information after you configure your site.
  • Service Base URL (serviceBaseUrl):

    • This setting determines the base URL of the Vocale.ai service endpoint.
    • Default Value: "https://vocale.ai/service"
    • Developers can modify this value if they have a custom deployment of Vocale.