I have added a code which is showing captions of my mic. I want to capture the voice of the person in call and show the captions in my page in real time.
`function sipInitialize(){
JsSIP.debug.enable('JsSIP:*');
var socket = new JsSIP.WebSocketInterface(websocket_proxy_url);
var configuration = {
sockets : [ socket ],
uri : sip_identity,
password : "5789",
register : true,
};
ua = new JsSIP.UA(configuration);
ua.start();
navigator.mediaDevices.getUserMedia({ audio: true })
ua.on('connected', function(e) {
console.log('connected...' + e)
createSipSession()
});
ua.on('trackAdded', function(track) {
if (track.kind === 'audio') {
track.on('started', function() {
var recognition = new window.webkitSpeechRecognition();
recognition.continuous = true;
recognition.interimResults = true;
// Update the text of the #transcript paragraph element
$('#transcript').text("Listening...");
recognition.onresult = function(event) {
var transcript = event.results[event.results.length - 1][0].transcript;
console.log('Transcript:', transcript);
// Update the text of the #transcript paragraph element
$('#transcript').text(transcript);
socket.emit('transcription', transcript);
};
recognition.onend = function() {
console.log('Speech recognition ended');
// Update the text of the #transcript paragraph element
$('#transcript').text("Speech recognition ended.");
};
recognition.onerror = function(event) {
console.error('Speech recognition error:', event.error);
// Update the text of the #transcript paragraph element
$('#transcript').text("Speech recognition error.");
};
var mediaStream = new MediaStream([track.mediaStreamTrack]);
recognition.start();
recognition.stream = mediaStream;
})
}
});`
I am expecting that I have to capture the voice of a person who is in call (may be VoIP or cellular)and get their Transcription in my page using JavaScript inbuilt speech recognition library