speech-javascript-sdk | IBM Watson Speech to Text and Text to Speech services | Speech library

I am using following javascript to record audio and send it to a websocket server:

It seems that the WebSocket API in Safari 10.1 has a maximum amount of binary data that it can buffer and then the next message sent gets the error "WebSocket connection to ... failed: Failed to send WebSocket frame."

Safari then closes the connection with code 1006 (CLOSE_ABNORMAL).

WebSockets are supposed to report the bufferedAmount - but Safari always reports 0 until after the error occurs and the connection is closed.

I tried just doing 100ms a setTimeout between each message, and that seems to work in the case of small chunks of data, but it seems brittle and large chunks still get errors when I send my closing JSON message, even with a longer delay.

You can see the bug in action here - the "Play Sample" buttons work in Safari 10.03 but error in 10.1. (Code that handles the WebSocket connection.)

Any ideas on how to work around this? Or what the limit even is? I know that Safari is Open Source, but I'm not sure where to look.

Update: here's a simpler example:

I'm seeing the word transcriptions, either in the browser or in the console, but I'm not seeing the messages such as {'state': 'listening'}. More importantly, I'm not seeing the results such as {"results": [{"alternatives": [{"transcript": "name the mayflower "}],"final": true}],"result_index": 0}.

I read the RecognizeStream documentation and tried this code:

I'm working through the tutorial for IBM Watson Speech-to-Text, using WebSocket for real time transcription. I'm using Angular.

The first 25 lines of code are copied from the API reference. This code successfully connects and initiates a recognition request. Watson sends me a message { "state": "listening" }.

I wrote function onClose() that logs when the connection closes.

I made a button that runs the handler $scope.startSpeechRecognition. This uses getUserMedia() to stream audio from the microphone and websocket.send() to stream the data to Watson. This isn't working. Clicking this button closes the connection. I presume that I'm sending the wrong type of data and Watson is closing the connection?

I moved websocket.send(blob); from onOpen to my handler $scope.startSpeechRecognition. I changed websocket.send(blob); to websocket.send(mediaStream);. I might have this wrong: 'content-type': 'audio/l16;rate=22050'. How do I know what bit rate comes from the microphone?

Is there a tutorial for JavaScript? When I google "IBM Watson Speech-to-Text JavaScript tutorial" at the top is an 8000-line SDK. Is the SDK required or can I write a simple program to learn how the service works?

Here's my controller: