Using the watson-developer-cloud node SDK directly on the client?

Question

I have a client based on react and I bundle it with webpack 2. But the moment I import/require const SpeechToTextV1 = require('watson-developer-cloud/speech-to-text/v1'); I got some trouble. After I fixed it that it does not break the build, it still throws some warning like:

Module not found: Error: Can't resolve '../build/Release/validation' in '/Users/denbox/Desktop/schedulebot/web-interface/node_modules/websocket/lib'
 @ ./~/websocket/lib/Validation.js 9:21-59
 @ ./~/websocket/lib/WebSocketConnection.js
 @ ./~/websocket/lib/websocket.js
 @ ./~/websocket/index.js
 @ ./~/watson-developer-cloud/speech-to-text/recognize_stream.js
 @ ./~/watson-developer-cloud/speech-to-text/v1.js
 @ ./src/components/chat.jsx
 @ ./src/components/chat-page.js
 @ ./src/index.js
 @ multi (webpack)-dev-server/client?http://localhost:8080 ./src/index.js

Is it even possible to use the watson-developer-cloud node sdk for the speech-to-text service on the client or only directly on the nodejs server? Thank you.

I would recommend using https://www.npmjs.com/package/watson-speech, as it's intended for browsers. I know it works well with browserify, I'm going to see if I can put together a working webpack example also. — Nathan Friedly, Feb 08 '17 at 15:21

Nathan Friedly · Accepted Answer · 2017-02-08T18:32:17.627

The Watson Node.js SDK has growing compatibility for client-side usage, but it's not all the way there yet. However, for speech services, there is a separate SDK targeted at client-side usage: https://www.npmjs.com/package/watson-speech

I just added a Webpack example and confirmed that it works: https://github.com/watson-developer-cloud/speech-javascript-sdk/blob/master/examples/webpack.config.js

Update: I also went and added a Webpack example to the Node.js SDK - with the configuration there, it can build for the entire library, and actually works for a subset set of the modules as documented: https://github.com/watson-developer-cloud/node-sdk/tree/master/examples/webpack

Thank you for the example, also the sample app was quiet useful https://github.com/watson-developer-cloud/speech-to-text-nodejs. — Dennis Seidel, Feb 15 '17 at 14:25

score 1 · Answer 2 · answered Feb 06 '17 at 22:39

1

Only in Node,js. The mechanism for using Speech To Text from the browser is to use websockets, but to do that you need a token, which will require a server side request. Once you have the token you can use the websockets interface.

answered Feb 06 '17 at 22:39

chughts

4,210
2
14
27

score 1 · Answer 3 · answered Feb 15 '17 at 14:38

With the answers above found a solution for my problem and it might help others who want to get started with the API:

import axios from 'axios';
import recognizeMicrophone from 'watson-speech/speech-to-text/recognize-microphone';

axios.get(`${BACKEND_ROOT_URL}/watsoncloud/stt/token`)
        .then((res) => {
          console.log('res:', res.data);
          const stream = recognizeMicrophone({
            token: res.data.token,
            continuous: false, // false = automatically stop transcription the first time a pause is detected
          });
          stream.setEncoding('utf8');
          stream.on('error', (err) => {
            console.log(err);
          });
          stream.on('data', (msg) => {
            console.log('message:', msg);
          });
        })
        .catch((err) => {
          console.log(`The following gUM error occured: ${err}`);
        });

In the backend I create a proxy service that get's a token for the watson speech to text service so I don't have to save my credentials on the client:

const watson = require('watson-developer-cloud');
const express = require('express');
const cors = require('cors');

app.use(cors());

const stt = new watson.SpeechToTextV1({
      // if left undefined, username and password to fall back to the SPEECH_TO_TEXT_USERNAME and
      // SPEECH_TO_TEXT_PASSWORD environment properties, and then to VCAP_SERVICES (on Bluemix)
      username: process.env.STT_SERVICE_USER,
      password: process.env.STT_SERVICE_PW,
    });
    const authService = new watson.AuthorizationV1(stt.getCredentials());
    // Endpoint to retrieve an watson speech to text api token
    // Get token using your credentials
    app.get('/watsoncloud/stt/token', (req, res, next) => {
      // TODO check jwt at the auth service
      authService.getToken((err, token) => {
        if (err) {
          next(err);
        } else {
          res.send({ token });
        }
      });
    });

app.listen(port, (err) => {
  if (err) {
    console.log(`Error: ${err}`);
  }
});

Using the watson-developer-cloud node SDK directly on the client?

3 Answers3