GuidesAPI ReferenceSDKsIntegrationsWhat's New?
Guides

Processing data from audio file

Suggest Edits

You can process audio from an audio file using the attachAudioSourceElement method on the AudioStream.

All audio requests in the browser must be made by user-interaction so we included a basic HTML application to help get this running.

📘

Authentication

Your Symbl API Credentials, that is, your App ID and App Secret are required for authentication. Learn how to get them in the Authentication section.

🚧

Import Web SDK

View the Importing section for the various ways to import the Web SDK.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Symbl Web SDK example</title>
  <script src="https://sdk.symbl.ai/js/beta/symbl-web-sdk/latest/symbl.min.js"></script>
  <script>
    const { Symbl, LINEAR16AudioStream } = window;

    const start = async () => {

      try {

          // We recommend to remove appId and appSecret authentication for production applications.
          // See authentication section for more details
          const symbl = new Symbl({
              appId: '<your App ID>',
              appSecret: '<your App Secret>',
              // accessToken: '<your Access Toknen>'
          });

          // Create your audio element
          const myAudioElement = new Audio();
          myAudioElement.type = "audio/mp3";
          myAudioElement.src = "https://symbltestdata.s3.us-east-2.amazonaws.com/newPhonecall.mp3";

          // Attach audio element to AudioStream
          const audioStream = new LINEAR16AudioStream();
          await audioStream.attachAudioSourceElement(myAudioElement);

          // Create connection and start processing audio
          const connection = await symbl.createConnection("abc123" + btoa(Math.random(0)), audioStream);

          await connection.startProcessing();

          // Play the element once audio is ready to be processed.
          connection.on("processing_started", () => {
            myAudioElement.play();
          });

          // Retrieve real-time transcription from the conversation
          connection.on("speech_recognition", (speechData) => {
            const { punctuated } = speechData;
            const name = speechData.user ? speechData.user.name : "User";
            console.log(`${name}: `, punctuated.transcript);
          });
          
          // This is just a helper method meant for testing purposes.
          // Waits 60 seconds before continuing to the next API call.
          await Symbl.wait(60000);
          
          // Stops processing audio, but keeps the WebSocket connection open.
          await connection.stopProcessing();
          
          // Closes the WebSocket connection.
          connection.disconnect();
      } catch(e) {
          // Handle errors here.
      }
    }
  </script>
</head>

<body>

<div>
  <p>Start</p>
  <div>
    <button onclick="javascript: start()">Start Processing Audio Element</button>
  </div>
</div>

</body>

</html>

Updated 8 months ago