google-cloud-text-to-speech

google-cloud-text-to-speech: React JS

A simple Google Cloud Text-to-Speech integration for ReactJS

New Features!

• Enter the text or state defined text gives voice audio of the entered text.
• Supports all voices and languages which avilables in cloud text to speech. (Link)

Tech

• ReactJs - The component integration and run on the web app.

Installation

npm install google-cloud-text-to-speech --save

Demo

Try it on CodeSandbox

Usage

import TextToSpeech from 'google-cloud-text-to-speech';

Example Code

import React from 'react';
import TextToSpeech from 'google-cloud-text-to-speech';

class App extends React.Component {

  constructor() {
    super();
    this.state = {
      text: 'Enter text to convert in to speech',
      voiceList: [
        { name: 'English (US) Male', value: 'en-US-Wavenet-A' },
        { name: 'English (US) Female', value: 'en-US-Wavenet-E' },
      ],
      defaultVoice: 'en-US-Wavenet-E',
      secretKey: '' // get your google cloud access key to text-to-speech
    }
  }

  render() {
    return (<div>
        <TextToSpeech
          text={this.state.text}
          voiceList={this.state.voiceList}
          defaultVoice={this.state.defaultVoice}
          secretKey={this.state.secretKey}
          showAudioControl={false}
          type="Page"
        >
      </TextToSpeech>
    </div>
  );
  }
}

export default App;

Input Parameters

Parameter	Type	Required	Description
text	String	Yes	This is the text that will get converted into Audio
voiceList	Array	No	If not provided then the feature takes up the default array provided
defaultVoice	String	No	If not provided then the feature takes up the default voice provided
secretkey	String	Yes	This is the google cloud key required to call the google cloud API
showAudioControl	boolean	No	Takes 'false' as default , if 'false' then shows only play/pause, if 'true' shows an audio player

Reference

• Google Cloud Text-to-Speech Documentation
• github.com/googleapis/nodejs-text-to-speech

License

MIT