本稿の前提として、Text Suggest APIの解説ページが全てです。かなり丁寧でわかりやすいです。
Text Suggest APIでできること
本家ドキュメントから一部引用させて頂きます。
Text Suggest APIはディープラーニングの技術を活用して生まれた、テキストの自動生成や入力補助を行うAPIです。
リクルートが持つサービスの多くは、ウェブサービスや雑誌などに原稿を掲載することで、利用者と企業とを結ぶメディアを展開しています。飲食店の料理情報や求人の募集要項、美容室の紹介などの多種多様な原稿が日々作られていくなかで、なんとか原稿を作る時間を短縮できないか、より多くの原稿を限られた時間内で書くことができないか、そういった要望から生まれたのがこのText Suggest APIです。決められた内容をもとに原稿を自動作成したり、原稿作成者のテキスト入力を補助する形で自動作成したテキストをサジェストすることで、そうした原稿作成の現場をサポートしています。
現段階(2017-05-03)では、現代文、和歌、Go言語のモデルが用意されていて、与えられたテキストの後に続く単語やフレーズを取得することができます。
APIKEYの取得
各API解説ページの一番下に、APIを使うためのAPIKEY発行ボタンがあります。利用規約を確認・同意した後、メールアドレス承認→APIKEY受信の流れで、APIKEYを取得します。
注意点
同じEmailアドレスで他のサービスのAPIKEYを取得した場合、そのEmailアドレスに承認情報が紐付けられます。退会申請をすると、紐付けられているAPIKEYすべてが利用できなくなりますので、再度APIKEYを発行する必要があります。
簡単な解説
全文
以下の通りです。
html
<input id="textsuggest__input" type="input" placeholder="ここにテキストを入力"/>
<button id="textsuggest__request" type="button">リクエスト</button>
<ul id="textsuggest__suggestion"></ul>
JavaScript
/*---------------------------------------*/
/* HTML(だけ)の読み込みが完了したら */
/*---------------------------------------*/
window.addEventListener('DOMContentLoaded',()=>{
//- イベントリスナー登録
document.getElementById('textsuggest__request').addEventListener('click',handler_request_suggestion);
});
/*---------------------------------------*/
/* 文章提案をリクエスト */
/*---------------------------------------*/
function handler_request_suggestion(ev){
/*---------------------------------------*/
/* テキスト取得 */
/*---------------------------------------*/
const text = document.getElementById('textsuggest__input').value;
/*---------------------------------------*/
/* リクエストデータ */
/*---------------------------------------*/
const endpoint = 'https://api.a3rt.recruit-tech.co.jp/text_suggest/v1/predict';
const params = {
apikey: '<取得したAPIKEY>',
previous_description: text,
style: 0,
separation: 0,
};
const query = Object.keys(params).map(key => key + '=' + params[key]).join('&');
/*---------------------------------------*/
/* リクエスト */
/*---------------------------------------*/
fetch(endpoint+'?'+query,{
method: 'get',
}).then(response => {
//- レスポンス取得
response.json().then(data => {
//- 提案取得
const suggestion = data.suggestion;
//- 前回の出力を一旦クリア
const suggestList = document.getElementById('textsuggest__suggestion');
suggestList.innerHTML = '';
//- 出力
suggestion.forEach(word => {
//- html生成
let output = document.createElement('li');
output.innerHTML = '<p>'+word+'</p>';
//- 追加
suggestList.appendChild(output);
})
});
});
}
解説
エンドポイントに対してリクエストできるパラメーターは、apikey,previous_description,style,separation,callbackの５つで、そのうちapikeyとprevious_description(基礎となる文章・言葉)が必須のパラメーターになっています。
styleパラメーターは生成される文章の種類を指定でき、0(現代文),1(和歌),2(Go言語)から選択できます。未指定時は0(現代文)が選択されます。
separationパラメーターは生成される文章の長さを指定でき、0(単語),1(句),2(文章)から選択できます。未指定時は2(文章)が選択されます。
リクエスト方法はGETですので、fetchを使う場合は、リクエストパラメーターをエンドポイントに結合してリクエスト用のURLを生成します。
# テキスト取得
const text = document.getElementById('textsuggest__input').value;
# リクエストURL生成
## エンドポイント
const endpoint = '<エンドポイント>';
## リクエストパラメーター設定
const params = {
apikey: '<取得したAPIKEY>',
previous_description: text,
style: 0,
separation: 0,
};
## リクエスト結合
const query = Object.keys(params).map(key => key + '=' + params[key]).join('&');
リクエストするパラメーターを設定したformdataインスタンスを生成したら、後は好きな方法でリクエストします。
# fetchを利用する場合、エンドポイントとクエリを結合して実行
fetch(endpoint+'?'+query,{
method: 'get',
}).then(response => {
//- レスポンス取得
response.json().then(data => {
//- 提案取得
const suggestion = data.suggestion;
//- 前回の出力を一旦クリア
const suggestList = document.getElementById('textsuggest__suggestion');
suggestList.innerHTML = '';
//- 出力
suggestion.forEach(word => {
//- html生成
let output = document.createElement('li');
output.innerHTML = '<p>'+word+'</p>';
//- 追加
suggestList.appendChild(output);
})
});
});
上記のような感じでしょうか。
所感
以上でText Suggest APIの解説(リクエスト編)は終了です。
実際に使用した感じだと、Text Suggest APIがどうというより、このAPIを利用してUIを考えるのが楽しいと感じました。
「ボタンを押してリクエスト」というよりは、入力毎にリクエストして常時提案する方が良いと思いますし、どうやって入力のサポートをできるかに注力したくなりました。
