1
Help us understand the problem. What are the problem?

More than 3 years have passed since last update.

posted at

updated at

【Noby API】ノビィ取り扱い説明書 使い方編【CotoGoto】

こんにちは。この記事は【Noby API】ノビィ取り扱い説明書【CotoGoto】の続きの記事になります。

今回は使い方についてを説明していきます。

1. 認証キーの発行

認証キーの発行は以下の手順で行います。

1-1. API利用の場所

CotoGotoの下のリンクから開発者をクリックします。

FireShot Capture 039 - 会話からはじめるフリーランスのための自己管理サービス ・ CotoGoto(コトゴト) - www.cotogoto.ai.png
FireShot Capture 040 - 会話からはじめるフリーランスのための自己管理サービス ・ CotoGoto(コトゴト) - www.cotogoto.ai.png

1-2. ユーザ登録

アカウントとAPIキー取得からのページに遷移します。
FireShot Capture 041 - アカウントとAPIキー取得 - Noby API - webapi.cotogoto.ai.png

Line or Facebookで ユーザ登録を行います。
FireShot Capture 043 - Noby API ・ CotoGoto(コトゴト) - app.cotogoto.ai.png

1-3. 認証キーの発行

認証キーが発行されます。
FireShot Capture 044 - Noby API ・ CotoGoto(コトゴト) - app.cotogoto.ai.png

2. APIを動かしてみる

APIの動作確認はApiaryからも動作確認を行うことができます。
FireShot Capture 045 - NOBY API · Apiary - nobyapi.docs.apiary.io.png

3. JavaScriptでAPIを実装する

次にJavascriptでAPIを実装します。

3-1. HTMLのテンプレートを作成

HTMLのテンプレートを作成します。

index.html
<!DOCTYPE html>
<html lang="ja">
<title>ノビィと会話</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script>
</script>
</head>
<body>
<div>
  <label for="message">話す:</label><br>
  <textarea id="message"></textarea>
</div>
<input type="button" value="送信" onclick="send()">
<div id="reply"></div>
</body>
</html>

作るとこんな感じ。
3-1.png

3-2. Javascriptを追加

空のscriptタグにJavascriptを実装します。

index.html
<script>
 function send() {
    $.get('https://app.cotogoto.ai/webapi/noby.json',
      {
        appkey: 'YOUR_API_KEY'
        , text: $('#message').val()
      },
      function(data) {
        $('#reply').html(data.text)
      }
    );
  }
</script>

3-3. APIのパラメータを指定する

APIのパラメータをJavascriptに指定します。

index.html
<script>
 function send() {
    $.get('https://app.cotogoto.ai/webapi/noby.json',
      {
        appkey: 'YOUR_API_KEY'
        , text: $('#message').val()
        , persona: 3,
        , ending: のじゃ
      },
      function(data) {
        $('#reply').html(data.text)
      }
    );
  }
</script>

4. 最後に

実際に動かしてみると神さまと会話している感じになりますが、そちらは実際に動かして試してください。
まだまだ、コマンド機能というものもAPIの説明を次の記事でまとめています。

※ソースについてはGithubに上げてあります。

Register as a new user and use Qiita more conveniently

  1. You can follow users and tags
  2. you can stock useful information
  3. You can make editorial suggestions for articles
What you can do with signing up
1
Help us understand the problem. What are the problem?