How to Retrieve Conversation Transcript After a Ca...
# support
k
Hi VAPI team, I’ve successfully integrated the VAPI SDK into an HTML/JS environment on Replit and can run real-time voice calls with an assistant that leverages a custom Knowledge Base. The call flow and event listeners (e.g., speech-start, call-end) are working well. Now I’d like to access and display the full conversation transcript after the call has ended. Could you please explain how to retrieve the transcript via your API or SDK once the call is finished? If there’s a recommended endpoint or approach, or any server-side configuration needed, I’d really appreciate the guidance. Thank you!
v
@kejan Hello! I'm glad to hear that you've successfully integrated the VAPI SDK and that your real-time voice calls are functioning smoothly. To access and display the full conversation transcript after the call has ended, you'll want to make use of the
message
event listener that you've already set up. Here's a general approach to retrieve the transcript: 1. **Collect Transcripts**: During the call, use the
message
event listener to collect transcript messages. You can identify these messages by checking if
msg.type
is equal to
"transcript"
. 2. **Store Transcripts**: Append each transcript message to an array or other storage mechanism in your client-side code. 3. **Display Transcripts**: After the call has ended (you can use the
call-end
event to detect this), you can then display the stored transcripts as needed in your application's UI. Here's a sample code snippet to illustrate the concept:
Copy code
javascript
let conversationTranscript = [];

vapi.on("message", (msg) => {
  if (msg.type === "transcript") {
    // Append the transcript message to the conversationTranscript array
    conversationTranscript.push(msg);
  }
});

// Later, after the call has ended, you can display the transcript
vapi.on('call-end', () => {
  // Display the conversation transcript in your application's UI
  displayTranscript(conversationTranscript);
});

function displayTranscript(transcriptArray) {
  // Implement this function to render the transcript in the UI
  // For example, you might iterate over the transcriptArray and append each message to a div element
}
Make sure to implement the
displayTranscript
function according to how you want the transcript to appear in your UI. If you need server-side storage or additional processing, you might consider sending the collected transcripts to your server at the end of the call for further use. If you have any more questions or need further assistance, please let me know!
You can continue this conversation by mentioning me in the message.
s
@kejan first you need to assign server url to your assistant and then select the end of cal report server event from the assistant advance section. now Vapi will send you transcript, and otther data at the end of call.
Do let me know if you require further help.
65 Views