Amazon Polly の読み上げテスト – プログラム作ってみた

Amazon AWS のドキュメントを参考に、ちょっとだけ修正して Amazon Polly の読み上げテストを作ってみた。
サンプルページはこちら。

以下がサンプルコード

<h2><a name = "polly" id = "polly">AWS Polly 読み上げテスト</a></h2>
<div id="textToSynth">
<textarea autofocus rows = "10" cols = "83" id = "textEntry" 
		style = "font-family: Arial,Arial, Helvetica, メイリオ">
Many a morning hath he there been seen,
With tears augmenting the fresh morning dew.
Adding to clouds more clouds with his deep sighs;
But all so soon as the all-cheering sun
Should in the furthest east begin to draw
The shady curtains from Aurora's bed,
Away from the light steals home my heavy son,
And private in his chamber pens himself,
Shuts up his windows, locks far daylight out
And makes himself an artificial night:
Black and portentous must this humour prove,
Unless good counsel may the cause remove.
</textarea>
<br />
<select name = "speaker" id = "speaker">
	<option value = "Nicole">オーストラリア英語 - Nicole</option>
	<option value = "Russell">オーストラリア英語 - Russell</option>
	<option value = "Emma">イギリス英語 - Emma</option>
	<option value = "Amy">イギリス英語 - Amy</option>
	<option value = "Brian">イギリス英語 - Brian</option>
	<option value = "Raveena">インド英語 - Raveena</option>
	<option value = "Aditi">インド英語 - Aditi</option>
	<option value = "Ivy">アメリカ英語 - Ivy</option>
	<option value = "Joanna">アメリカ英語 - Joanna</option>
	<option value = "Joey">アメリカ英語 - Joey</option>
	<option value = "Justin">アメリカ英語 - Justin</option>
	<option value = "Kendra">アメリカ英語 - Kendra</option>
	<option value = "Kimberly">アメリカ英語 - Kimberly</option>
	<option value = "Matthew">アメリカ英語 - Matthew</option>
	<option value = "Salli">アメリカ英語 - Salli</option>
	<option value = "Geraint">ウェールズ英語 - Geraint</option>
	<option value = "Hans">ドイツ語 - Hans</option>
	<option value = "Marlene">ドイツ語 - Marlene</option>
	<option value = "Vicki">ドイツ語 - Vicki</option>
	<option value = "Chantal">カナダフランス語 - Chantal</option>
	<option value = "Mathieu">フランス語 - Mathieu</option>
	<option value = "Celine">フランス語 - Celine</option>
	<option value = "Lea">フランス語 - Lea</option>
	<option value = "Mizuki">日本語 - Mizuki</option>
	<option value = "Takumi">日本語 - Takumi</option>
	<option value = "Zhiyu">中国語(マンダリン) - Zhiyu</option>
</select>
<button class="btn default" onClick="speakText()">音声合成</button>
<p id="result">文章を入力して、音声合成ボタンをクリック。</p>
</div>
<audio id="audioPlayback" controls>
	<script src="https://sdk.amazonaws.com/js/aws-sdk-2.476.0.min.js">
        </script>
	<source id="audioSource" type="audio/mp3" src="">
</audio>
<script>
	// Initialize the Amazon Cognito credentials provider
	AWS.config.region = 'YOUR_REGION'; 
	AWS.config.credentials = new AWS.CognitoIdentityCredentials(
		{IdentityPoolId: 'YOUR_CREDENTIALS'});
	
	// Function invoked by button click
	function speakText() {
		// Create the JSON parameters for getSynthesizeSpeechUrl
		var speechParams = {
			OutputFormat: "mp3",
			SampleRate: "22050",
			Text: "",
			TextType: "text",
			VoiceId: "Emma"
		};
		speechParams.Text =
			document.getElementById("textEntry").value;
		speechParams.VoiceId =
			document.getElementById("speaker").value;
		// Create the Polly service object and presigner object
		var polly = new AWS.Polly({apiVersion: '2016-06-10'});
		var signer = 
			new AWS.Polly.Presigner(speechParams, polly)

		// Create presigned URL of synthesized speech file
		signer.getSynthesizeSpeechUrl(speechParams,
			function(error, url) {
		if (error) {
			document.getElementById('result').innerHTML = error;
		} else {
			document.getElementById('audioSource').src = url;
			document.getElementById('audioPlayback').load();
			document.getElementById('result').innerHTML =
				"読み上げ準備完了";
		}
		});
	}
</script>
</div><!-- article -->