kintoneからChatworkへタスクを登録する

こんにちは。
Three Hands Worksの小林です。
前回に続き、今回は実際にkintone側からChatwork APIを呼び出しタスクを登録するところまでやってみましょう。

今回のポイント

いろいろと難しい事は置いておいて、ざっくり利用方法の基本をやってみたいと思います。
これができれば、後は応用になるので工夫次第でより便利なアプリが作れます。

  1. APIトークンの取得
  2. エンドポイントの確認
  3. API呼び出し処理の実装
  4. kintoneアプリの用意

では実際にやってみましょう。

 

APIトークンの取得

前回説明したとおり、Chatwork APIはAPIトークンを使って認証を行ないます。
そのために、利用するユーザーごとにAPIトークンを発行しておく必要があります。
すでに取得は済んでいると思いますので、クリップボードにコピーしておいてください。
まだ取得していない方は、以下の記事を参考にAPIトークンの取得を行ってください。

Chatwork APIの使い方

 

エンドポイントの確認

エンドポイントについても前回説明しましたね。
簡単に言うとAPIを呼び出すためのURIのことです。
今回は「チャットに新しいタスクを追加」するためのエンドポイントを利用します。
ドキュメントは以下を利用してください。

チャットに新しいタスクを追加
前回は自分のチャット一覧を取得するエンドポイントを使用しました。
今回のエンドポイントは前回と異なり、パラメータがあることに気付いたでしょうか?

  • body       タスクの内容
  • limit        タスクの期限
  • to_ids     担当者のアカウントID

以上の3つです。
これらは実際にChatwork上でタスクを追加する時にも必要なパラメータですので、馴染みもあるかと思いますから細かい説明はしません。
ただ、注意点としてweb APIを利用する時にはデータのあり方が変わりますので、それについて補足させていただきます。
一つ目のタスクの内容については文字列ですので特筆すべき点はありません。
二つ目のタスクの期限はUNIX timeで入力するようにドキュメントにありますのでこれに従う必要があります。
時間をUNIX timeフォーマットで表現するにはいろいろ方法があるかと思いますが、今回はMoment.jsを利用してみました。

Moment.js ~面倒なJavascriptの日付処理を簡単にしてくれるライブラリ~

以下を参考に呼び出せばOKです。

三つ目の担当者のアカウントIDですが、これはChatworkでTOをする時などに見たことがありますね。

[To:xxxxxx]

このxxxxxxにあたる数字のことです。
これをタスクの担当者分カンマで区切って並べればOKです。

 

API呼び出し処理の実装

さあ、いよいよkintoneアプリ側に登録するJavascriptのコードを用意します。
処理自体は説明の都合上、今回とてもシンプルにしています。
以下を御覧ください。

それぞれの処理内容についてはコード内のコメントを参考にしてください。
kintone.proxy()の利用方法は以下のCybozuさんのデベロッパー向けサイトを参考にしていますので、こちらも併せて御覧ください。

kintoneマッシュアップのための豆知識(curlコマンドとkintone.proxy()の対応)

またソース内の’xxxxxx’で表示されている部分については、適宜自身が利用しているChatworkを参考に書きなおしてください。
今回はkintoneからChatwork APIを呼び出すことを目的としているので、Room IDなどは固定でソース内にベタ書きにしています。
本来はAPIを利用してチャット一覧を取得しRoom IDを設定したり、チャットのメンバー一覧を取得しto_idsを設定すると良いかと思います。

 

kintoneアプリの用意

いよいよkintone側に呼び出し用のアプリを作成します。
今回はシンプルにタスクの内容を持つ文字列とタスク追加ボタンを配置するスペースのみを持ったアプリを用意します。
まずはフォームの編集から見てみましょう。
フォーム編集画面
続いてそれぞれの項目詳細を見ます。
文字列の設定です。
必須項目の設定とフィールドコードの設定がポイントです。
文字列詳細画面
スペースは要素IDのみです。
プログラムからアクセスするのに使うので、同じように入力してください。
スペース設定画面
最後に作成したJavascriptの登録を行ないます。
アプリ編集画面
登録するのはmoment.jsと作成したjsファイルです。
jsファイルはアップロードして追加をしますが、moment.jsはCybozu CDNとして用意されていますので、URLを指定して追加をしましょう。
Cybozu CDNについては以下のリンクを参照してください。
moment.js以外にもカスタマイズに利用できるライブラリが揃っています。

Cybozu CDN

 
Javascript登録画面
他に一般設定や一覧の追加などアプリ作成の設定が全て終了したら、設定完了をクリックしてアプリの作成を完了しましょう。
これを忘れるとせっかく設定した内容が保存されず消えてしまいますので気を付けましょう。
※カスタマイズをしていると設定が反映されないといった事が起きますが、たいていはこの「設定完了」忘れだったりしますのでとても重要です。
設定完了

 

動作確認

最後までお付き合いいただき有難うございます。
では実際にkintoneアプリからChatworkにタスクを追加してみましょう。
まずはアプリからレコードを作成します。
レコード登録
保存したらタスク追加ボタンをクリックします。
タスク追加実行
成功するとアラートが表示されます。
成功
Chatworkを開いて実際にタスクが追加されているか確認をしましょう。
タスク追加確認
これでkintoneアプリとChatworkとの連携ができました。
Chatwork APIには他にもいろいろなエンドポイントが用意されています。
より快適なアプリを目指してカスタマイズを試してみましょう。