Voice Text Web API をPHPでシンプルに利用する。

最近ブラウザにおしゃべりさせるのに凝っていて、<code>Speech Synthesis API</code>を試していました。しかしながら手持ちのChromebookが日本語発音エンジンが非搭載なのに気付き、少々残念な思いをしておりました。

そこで外部APIを利用してみることを思いつき、ちょっと調べたところメガネレンズやコンタクトなどで有名なHOYA社が合成発話APIを無料で公開されていることを知りました。

## Voice Text Web API 

[Voice Text Web API ](https://cloud.voicetext.jp/webapi)

無料利用登録をするとAPIキーが発行されます。このAPIキーがベーシック認証のユーザー名となり（パスワードは空欄）様々なパラメータを指定することで合成音声をダウンロードすることが可能です。

[Voice TEXT - HOYA株式会社](http://voicetext.jp/)

製品情報ページで各音声とパラメーターによる変化を確認することが出来ます。

## 利用規約

このような利用規約になっています。

>無料版で作成した音声データの商用利用、二次利用及び配布する行為は禁止されております。
利用規約をご確認の上、本サービスをご利用ください。

二次配布は禁止なので一般に公開するWEBサイトやWEBアプリでは（無料では）利用出来ません。

ただしローカル環境では利用出来るので、個人で利用するちょっとしたアプリなどには自由に利用することが出来ます。

## APIの利用

様々な言語でAPIライブラリが公開されていますが、私には少々難しかったので、今回はそれらを利用せずシンプルに読み上げるコードを試してみました。

```php:voicetext.php

<?php
$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, "https://api.voicetext.jp/v1/tts");
curl_setopt($ch, CURLOPT_HEADER, false);
curl_setopt($ch, CURLOPT_FOLLOWLOCATION, true);
curl_setopt($ch,CURLOPT_RETURNTRANSFER,true);
$authorized = "APIキー:";
curl_setopt($ch,CURLOPT_HTTPAUTH,CURLAUTH_BASIC);
curl_setopt($ch,CURLOPT_USERPWD,$authorized);
$post_array = array("text" => $_POST['input_text'], "speaker" => "haruka", "emotion" => "happiness", "pitch" => "80", "emotion_level" => "4");
$postdata = "";
foreach ($post_array as $key => $val) {
    $postdata.= urlencode($key) . '=' . urlencode($val) . '&';
}
curl_setopt($ch, CURLOPT_POST, true);
curl_setopt($ch, CURLOPT_POSTFIELDS, $postdata);
$output = curl_exec($ch);
curl_close($ch);
$fp = fopen("voice.wav", "w");
fwrite($fp, $output);
fclose($fp);
?>

```

APIへの認証はベーシック認証（ユーザー名：パスワード）で行います。パラメータは直接`PHP`に記入しています。

読み上げるテキストだけはテキストエリアから`$_POST`を使用してパラメータに引き渡しています。

実行結果は`$fp`を利用して`wav`ファイルとして保存されます。

```html:index.php

<?php
include 'voicetext.php';
?>

<html lang="ja">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>VoiceTextWebAPI-PHP</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" type="text/css" />
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="style.css">

    </head>

<body>
	<h1 id="title" class="text-center h3">VoiceTextWebAPI-PHP</a></h1>

  <article>
<div id="content" class="well">
<p>
  <?php
   print('' .htmlspecialchars($_REQUEST['input_text'], ENT_QUOTES));
  ?>
</p>
<br>
</div>
<div id="box" >
  <form id="form" name="form" action="index.php" method="POST" />
  <input id="input_text" type="text"  class="form-control" placeholder="Text input" name="input_text" value="" />
  <br>
  <button type="submit"  class="btn btn-default"><i class="fa fa-volume-up"></i> Voice Speech</button>
  </form>
</div>

<audio id="voice" src="voice.wav"><audio>

	</article>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.js"></script>
<script src="main.js"></script>

</body>
</html>

```

`input`要素の`value`属性をボタンクリックによる`submit`で`PHP`に送信します。

```css:style.css

@import url(//fonts.googleapis.com/earlyaccess/notosansjapanese.css);

body {
  font-family: 'Noto Sans Japanese', serif;
}

article{
  margin: 20px;
}
#content{
  width:300px;;
  height: 60px;;
  border-radius: 4px;
  margin: 0 auto;
  margin-bottom: 20px;
  padding: 10px;
}
#box{
  width:300px;
  margin: 0 auto;
}


```

```js:main.js

$("document").ready(function() {
    $("button").click(function() {
        $("#input_text").value = text;
    });
    $("#voice").play();
});

```

`jQuery`を利用して`input`の`value`属性を取得します。

保存された`wav`ファイルはHTML5の`audio`要素として取得しておき、送信が終了した時点で再生します。

## まとめ

サンプルを公開できないのが残念ですが、感情のパラメータを変化させるとかなり自然な発話の合成音声が取得出来ます。

是非お試しください。

## 参考にさせて頂きました

[VoiceTextWebAPIなるものをPHPで動かしてみた](http://rdlabo.jp/php-246.php)