0

i was try this with repo of aws https://github.com/awsdocs/aws-doc-sdk-examples/tree/main/javascriptv3/example_code/cross-services/transcribe-streaming-app it is working correctly but when i used this code into my react app it gives me error Like

react_devtools_backend.js:2655 Error creating microphone stream: TypeError: microphone_stream__WEBPACK_IMPORTED_MODULE_0___default(...).default is not a constructor
    at createMicrophoneStream (transcribeClient.js:64:1)
    at Module.startRecording (transcribeClient.js:30:1)
    at startRecording (Dashboard.jsx:29:1)
    at HTMLUnknownElement.callCallback (react-dom.development.js:4164:1)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:4213:1)
    at invokeGuardedCallback (react-dom.development.js:4277:1)
    at invokeGuardedCallbackAndCatchFirstError (react-dom.development.js:4291:1)
    at executeDispatch (react-dom.development.js:9041:1)
    at processDispatchQueueItemsInOrder (react-dom.development.js:9073:1)
    at processDispatchQueue (react-dom.development.js:9086:1)
index.js:35 Uncaught ReferenceError: Buffer is not defined
    at fromArrayBuffer (index.js:35:1)
    at Object.bufferFrom [as default] (index.js:60:1)
    at ScriptProcessorNode.recorderProcess (microphone-stream.js:108:1)
fromArrayBuffer @ index.js:35
bufferFrom @ index.js:60
recorderProcess @ microphone-stream.js:108
Dashboard.jsx:34 hello ReferenceError: process is not defined
    at Readable.on (_stream_readable.js:763:1)
    at createReadableStreamAsyncIterator (async_iterator.js:182:1)
    at Readable.<computed> (_stream_readable.js:921:1)
    at getAudioStream (transcribeClient.js:114:1)
    at getAudioStream.next (<anonymous>)
    at Object.serializedIterator (EventStreamMarshaller.js:21:1)
    at serializedIterator.next (<anonymous>)
    at Object.pull (utils.js:21:1)
_stream_readable.js:490 Uncaught (in promise) ReferenceError: process is not defined
    at emitReadable (_stream_readable.js:490:1)
    at onEofChunk (_stream_readable.js:469:1)
    at readableAddChunk (_stream_readable.js:240:1)
    at Readable.push (_stream_readable.js:228:1)
    at MicrophoneStream.stop (microphone-stream.js:157:1)
    at Module.stopRecording (transcribeClient.js:36:1)
    at stopRecording (Dashboard.jsx:21:1)
    at startRecording (Dashboard.jsx:36:1)

i am expecting to get the transcription of that it is working with aws repo project which is in custom js with webpack but i am trying in react js

1 Answers1

0

From your main error:

"TypeError:microphone_stream__WEBPACK_IMPORTED_MODULE_0___default(...).default is not a constructor,"

I could see that this is a problem with the microphone-stream library. Most likely, this lib should collect stream to the buffer that wasn't imported in your index.js:

(index.js:35 Uncaught ReferenceError: Buffer is not defined)

Probably, you forgot to add something like:

import { Buffer } from 'buffer';
DSDmark
  • 1,045
  • 5
  • 11
  • 25