WARNING: This repository is no longer maintained ⚠️

This repository will not be updated. The repository will be kept available in read-only mode.

Text to Speech Code Pattern

Sample React app for playing around with the Watson Text to Speech service

✨ Demo: https://text-to-speech-code-pattern.ng.bluemix.net/ ✨

Flow

1. User supplies some text as input to the application (running locally, in the IBM Cloud or in IBM Cloud Pak for Data).
2. The application sends the text to the Watson Text to Speech service.
3. As the data is processed, the Text to Speech service returns audio information to the HTML5 audio element for playback.

Steps

1. Provision Watson Text to Speech
2. Deploy the server
3. Use the web app

1. Provision Watson Text to Speech

The instructions will depend on whether you are provisioning services using IBM Cloud Pak for Data or on IBM Cloud.

Click to expand one:

IBM Cloud Pak for Data

Install and provision

The service is not available by default. An administrator must install it on the IBM Cloud Pak for Data platform, and you must be given access to the service. To determine whether the service is installed, click the Services icon () and check whether the service is enabled.

Gather credentials

1. For production use, create a user to use for authentication. From the main navigation menu (☰), select Administer > Manage users and then + New user.
2. From the main navigation menu (☰), select My instances.
3. On the Provisioned instances tab, find your service instance, and then hover over the last column to find and click the ellipses icon. Choose View details.
4. Copy the URL to use as the TEXT_TO_SPEECH_URL when you configure credentials.
5. Optionally, copy the Bearer token to use in development testing only. It is not recommended to use the bearer token except during testing and development because that token does not expire.
6. Use the Menu and select Users and + Add user to grant your user access to this service instance. This is the TEXT_TO_SPEECH_USERNAME (and TEXT_TO_SPEECH_PASSWORD) you will use when you configure credentials to allow the Node.js server to authenticate.

IBM Cloud

Create the service instance

• If you do not have an IBM Cloud account, register for a free trial account here.
• Click here to create a Text to Speech instance.
  • Select a region.
  • Select a pricing plan (Lite is free).
  • Set your Service name or use the generated one.
  • Click Create.
• Gather credentials
  • Copy the API Key and URL to use when you configure and deploy the server.

If you need to find the service later, use the main navigation menu (☰) and select Resource list to find the service under Services. Click on the service name to get back to the Manage view (where you can collect the API Key and URL).

2. Deploy the server

Click on one of the options below for instructions on deploying the Node.js server.

3. Use the web app

• Select an input Voice model.

• Use the demo Text to synthesize or enter your own text into that text box.

• Press the Synthesize button to create audio from that text and hear it in the selected voice.

• The audio plays automatically. You can also use the Synthesized audio controls to pause, play, etc.

Developing and testing

See DEVELOPING.md and TESTING.md for more details about developing and testing this app.

License

This code pattern is licensed under the Apache License, Version 2. Separate third-party code objects invoked within this code pattern are licensed by their respective providers pursuant to their own separate licenses. Contributions are subject to the Developer Certificate of Origin, Version 1.1 and the Apache License, Version 2.

Apache License FAQ