diff --git a/src/hooks/VoiceRecorder/WebAudioUtils.ts b/src/hooks/VoiceRecorder/WebAudioUtils.ts index a297b57b9..8f23c4f26 100644 --- a/src/hooks/VoiceRecorder/WebAudioUtils.ts +++ b/src/hooks/VoiceRecorder/WebAudioUtils.ts @@ -1,4 +1,5 @@ // Thanks to https://codesandbox.io/s/media-recorder-api-downsampling-16k-mp3-encode-using-lame-js-forked-n1pblw +import { VOICE_RECORDER_AUDIO_SAMPLE_RATE } from '../../utils/consts'; import { WavHeader, Mp3Encoder } from '../../_externals/lamejs/lame.all'; function encodeMp3(arrayBuffer: ArrayBuffer): WavHeader { @@ -39,7 +40,7 @@ function encodeMp3(arrayBuffer: ArrayBuffer): WavHeader { function downsampleToWav(file: File, callback: (buffer: ArrayBuffer) => void): void { // Browser compatibility // https://caniuse.com/?search=AudioContext - const audioCtx = new AudioContext(); + const audioCtx = new AudioContext({ sampleRate: VOICE_RECORDER_AUDIO_SAMPLE_RATE }); const fileReader = new FileReader(); fileReader.onload = function (ev) { // Decode audio diff --git a/src/hooks/VoiceRecorder/index.tsx b/src/hooks/VoiceRecorder/index.tsx index 357a87b21..6baed4353 100644 --- a/src/hooks/VoiceRecorder/index.tsx +++ b/src/hooks/VoiceRecorder/index.tsx @@ -6,7 +6,7 @@ import { BROWSER_SUPPORT_MIME_TYPE_LIST, VOICE_MESSAGE_FILE_NAME, VOICE_MESSAGE_MIME_TYPE, - VOICE_RECORDER_AUDIO_BITS, + VOICE_RECORDER_AUDIO_BIT_RATE, } from '../../utils/consts'; import useSendbirdStateContext from '../useSendbirdStateContext'; @@ -91,7 +91,7 @@ export const VoiceRecorderProvider = (props: VoiceRecorderProps): React.ReactEle setIsRecordable(true); const mediaRecorder = new MediaRecorder(stream, { mimeType: browserSupportMimeType, - audioBitsPerSecond: VOICE_RECORDER_AUDIO_BITS, + audioBitsPerSecond: VOICE_RECORDER_AUDIO_BIT_RATE, }); mediaRecorder.ondataavailable = (e) => { // when recording stops logger.info('VoiceRecorder: Succeeded getting an available data.', e.data); diff --git a/src/utils/consts.ts b/src/utils/consts.ts index 200a8e1e3..cddfcff64 100644 --- a/src/utils/consts.ts +++ b/src/utils/consts.ts @@ -4,7 +4,8 @@ export const SCROLL_BUFFER = 10; export const VOICE_RECORDER_CLICK_BUFFER_TIME = 250; export const VOICE_RECORDER_DEFAULT_MIN = 1000; // 1 seconds export const VOICE_RECORDER_DEFAULT_MAX = 600000; // 10 minutes -export const VOICE_RECORDER_AUDIO_BITS = 128000; +export const VOICE_RECORDER_AUDIO_BIT_RATE = 12000; +export const VOICE_RECORDER_AUDIO_SAMPLE_RATE = 11025; export const BROWSER_SUPPORT_MIME_TYPE_LIST = ['audio/webm', 'audio/mp4', 'audio/mpeg', 'audio/ogg']; // voice message play