🔄 fix: Improve audio MIME type detection and handling in Speech to Text hook (#6707)

This commit is contained in:
Marco Beretta 2025-04-04 17:56:47 +02:00 committed by GitHub
parent 93e679e173
commit 710fde6a6f
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -21,7 +21,7 @@ const useSpeechToTextExternal = (
const [isListening, setIsListening] = useState(false); const [isListening, setIsListening] = useState(false);
const [audioChunks, setAudioChunks] = useState<Blob[]>([]); const [audioChunks, setAudioChunks] = useState<Blob[]>([]);
const [isRequestBeingMade, setIsRequestBeingMade] = useState(false); const [isRequestBeingMade, setIsRequestBeingMade] = useState(false);
const [audioMimeType, setAudioMimeType] = useState<string>('audio/webm'); const [audioMimeType, setAudioMimeType] = useState<string>(() => getBestSupportedMimeType());
const [minDecibels] = useRecoilState(store.decibelValue); const [minDecibels] = useRecoilState(store.decibelValue);
const [autoSendText] = useRecoilState(store.autoSendText); const [autoSendText] = useRecoilState(store.autoSendText);
@ -49,7 +49,7 @@ const useSpeechToTextExternal = (
}, },
}); });
const getBestSupportedMimeType = () => { function getBestSupportedMimeType() {
const types = [ const types = [
'audio/webm', 'audio/webm',
'audio/webm;codecs=opus', 'audio/webm;codecs=opus',
@ -60,20 +60,22 @@ const useSpeechToTextExternal = (
]; ];
for (const type of types) { for (const type of types) {
if (MediaRecorder.isTypeSupported(type)) { if (typeof MediaRecorder !== 'undefined' && MediaRecorder.isTypeSupported(type)) {
return type; return type;
} }
} }
if (typeof navigator !== 'undefined') {
const ua = navigator.userAgent.toLowerCase(); const ua = navigator.userAgent.toLowerCase();
if (ua.indexOf('safari') !== -1 && ua.indexOf('chrome') === -1) { if (ua.indexOf('safari') !== -1 && ua.indexOf('chrome') === -1) {
return 'audio/mp4'; return 'audio/mp4';
} else if (ua.indexOf('firefox') !== -1) { } else if (ua.indexOf('firefox') !== -1) {
return 'audio/ogg'; return 'audio/ogg';
} else { }
}
return 'audio/webm'; return 'audio/webm';
} }
};
const getFileExtension = (mimeType: string) => { const getFileExtension = (mimeType: string) => {
if (mimeType.includes('mp4')) { if (mimeType.includes('mp4')) {
@ -177,7 +179,7 @@ const useSpeechToTextExternal = (
setAudioMimeType(bestMimeType); setAudioMimeType(bestMimeType);
mediaRecorderRef.current = new MediaRecorder(audioStream.current, { mediaRecorderRef.current = new MediaRecorder(audioStream.current, {
mimeType: bestMimeType, mimeType: audioMimeType,
}); });
mediaRecorderRef.current.addEventListener('dataavailable', (event: BlobEvent) => { mediaRecorderRef.current.addEventListener('dataavailable', (event: BlobEvent) => {
audioChunks.push(event.data); audioChunks.push(event.data);
@ -266,7 +268,6 @@ const useSpeechToTextExternal = (
return () => { return () => {
window.removeEventListener('keydown', handleKeyDown); window.removeEventListener('keydown', handleKeyDown);
}; };
}, [isListening]); }, [isListening]);
return { return {