2016 年 8 月のアップデート
により追加される新機能「
スペースのスレッドにコメントを投稿する」を使ったTipsを紹介します。
追加される REST API の概要
固定リンクがコピーされました
この新機能のために追加されるREST APIは、リクエストボディでスペースIDとスレッドIDを指定することで、スレッドにコメントを投稿できるというものです。
投稿にはユーザーや組織/グループへのメンション、画像（ファイルキーによる指定）も含めることができます。
指定できるパラメーターの詳細等は、
REST API の説明ページを参照してください。
今回のシナリオのポイント
固定リンクがコピーされました
カンの鋭い方は機能名からピンと来たかもしれませんが、このREST APIでできるHTTPメソッドは現状POSTのみです。
そこで、今回はこのAPIで実現できる、スレッドへの一方通行的な活用例を考えてみました。
具体的には、アプリ内のボタンを押すとアプリのデータを取得そして集計してスレッドに投稿するというものです。
百聞は一見にしかずということで、次の完成イメージを確認してください。
まずはアプリ側です。
一覧画面のヘッダーメニュースペースにある「本日の出来高をスレッドに投稿する！」ボタンを押してみましょう。
（注：ダミーデータのため、実際のサイボウズへのお問い合わせ内容ではありません）
のちほど、スレッド側の画面を確認してみます。
最新投稿で、アプリのレコード件数を集計したデータが投稿されています。
スレッドとアプリ連携の準備として、必要な手順はこちらです。
- kintoneのポータル画面から、適当なスペースを作成します。
スペースのIDを控えておきます。
- スペースから適当なスレッドを作成します。
スレッドのIDを控えておきます。
- スペースからアプリを作成します。
今回はアプリストアの「サポートFAQ」を使いました。
- アプリにレコードを登録します。
スペースIDとスレッドIDは、ブラウザーでkintoneスレッドを閲覧した際のURLで確認できます。
URLがhttps://SUBDOMAIN.cybozu.com/k/#/space/4/thread/5の場合、スペースIDとスレッドIDは次のとおりです。
アプリ側の作業では、今回はレコードの件数をカウントするだけなので、フィールドを自由に設定してOKです。
また、今回のTipsでは、レコード件数の作成日時を見て本日分と今月分をカウントするため、できれば作成日時が2日間以上にまたがるようなレコードを複数登録しましょう。
ちなみに、今回は投稿ボタンを押した後の確認画面を
Cybozu CDNにあるSweetAlertを利用して実装したため、「アプリの設定」画面でCDNのURLを指定するという手順も必要です。
cybozu developer networkの以下の記事を参考にしてやってみましたので、カッコいい確認画面にしたい方は合わせて確認してください！
参考：
SweetAlert を使って、kintone でメッセージをスタイリッシュに表示させよう！
サンプルプログラムと解説
固定リンクがコピーされました
サンプルプログラム（JavaScript）
固定リンクがコピーされました
サンプルプログラムの概要は以下のとおりです。
- ボタン作成
- ボタンクリック時の処理を以下ステップ3 ~ 5に記述
- 今月作成したすべてのレコード情報をREST APIで取得
- 上記レコードからさらに本日作成分をJavaScriptでカウントして変数に代入
- 3, 4の内容をスレッドに投稿
プログラムの全体はこちらです。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
|
/*
* sample program
* Copyright (c) 2016 Cybozu
*
* Licensed under the MIT License
* https://opensource.org/license/mit/
*/
(function() {
'use strict';
kintone.events.on('app.record.index.show', (event) => {
if (document.getElementById('my_index_button') !== null) {
return;
}
// ボタンを作成
const myIndexButton = document.createElement('button');
myIndexButton.id = 'my_index_button';
myIndexButton.innerHTML = '本日の出来高をスレッドに投稿する！';
// ボタンクリック時の処理
myIndexButton.onclick = function() {
// SweetAlertでの確認画面
swal({
title: '投稿確認',
text: '出来高を投稿しますがよろしいですか？',
type: 'warning',
showCancelButton: true,
confirmButtonColor: '#DD6B55',
confirmButtonText: 'OK',
cancelButtonText: 'キャンセル',
closeOnConfirm: false,
closeOnCancel: false
},
(isConfirm) => {
if (isConfirm) {
const d = new Date();
const month = d.getUTCMonth() + 1;
const hour = d.getUTCHours() + 9;
const min = d.getUTCMinutes();
// 今月作成したすべてのレコード情報を取得
const params = {
app: 13565,
query: '作成日時 = THIS_MONTH()', // 今月分を指定
fields: ['$id', '作成日時'],
totalCount: true // 今月分件数をカウント
};
kintone.api(kintone.api.url('/k/v1/records', true), 'GET', params, (resp) => {
const monthCount = resp.totalCount;
// 本日分件数をカウント
const today = new Date();
const todayUTC = today.getUTCDate();
let todayCount = 0;
for (let i = 0; i < resp.records.length; i++) {
if (new Date(resp.records[i]['作成日時'].value).getUTCDate() === todayUTC) {
todayCount++;
}
}
// スレッドに投稿
const body = {
space: 524,
thread: 1044,
comment: {
text: '本日 ' + month + '月' + todayUTC + '日 ' + hour + '時' + min +
'分 時点のお問い合わせ件数実績をご報告します。\n本日の新規受付： ' + todayCount +
' 件\n今月の累計件数： ' + monthCount + ' 件 です。',
mentions: [
{
code: 'カスタマー本部_9tkO30',
type: 'ORGANIZATION'
}
]
}
};
kintone.api(kintone.api.url('/k/v1/space/thread/comment', true), 'POST', body, (res) => {
swal('投稿済み', 'スレッドに投稿されました', 'success');
}, (error) => {
});
});
} else {
swal('キャンセル済み', 'キャンセルされました', 'error');
}
});
};
kintone.app.getHeaderMenuSpaceElement().appendChild(myIndexButton);
});
})();
|
新 API を使用している箇所
固定リンクがコピーされました
ここで、今回の新機能の部分にクローズアップしてみます。
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
|
// スレッドに投稿
const body = {
space: 524,
thread: 1044,
comment: {
text: '本日 ' + month + '月' + todayUTC + '日 ' + hour + '時' + min +
'分 時点のお問い合わせ件数実績をご報告します。\n本日の新規受付： ' + todayCount +
' 件\n今月の累計件数： ' + monthCount + ' 件 です。',
mentions: [
{
code: 'カスタマー本部_9tkO30',
type: 'ORGANIZATION'
}
]
}
};
kintone.api(kintone.api.url('/k/v1/space/thread/comment', true), 'POST', body, (res) => {
swal('投稿済み', 'スレッドに投稿されました', 'success');
}, (error) => {
});
|
上のようにスペースIDとスレッドIDを指定してPOSTします。
メンションに、組織コードとタイプを指定します。
取得可能レコード件数について
39
40
41
42
43
44
45
46
|
// 今月作成したすべてのレコード情報を取得
const params = {
'app': 13565,
"query": "作成日時 = THIS_MONTH() limit 500", // 今月分を指定
"fields": ["$id", "作成日時"],
"totalCount": true // 今月分件数をカウント
};
kintone.api(kintone.api.url('/k/v1/records', true), 'GET', params, function(resp) {
|
REST APIのqueryパラメーターで、何も指定しない場合、取得できるレコード件数の上限は100件です。
limitオプションの指定で上限を拡大できますが、指定可能な最大値は500のため、このサンプルプログラムで取得できる上限は500件です。
REST APIの詳細は
複数のレコードを取得するを参照してください。
totalCount の使用
REST APIのリクエストパラメーター totalCountをtrueで指定することで、レコード件数を簡単にカウントできます。
こちらも詳細は
複数のレコードを取得するを参照してください。
本日作成件数の取得方法（例）
48
49
50
51
52
53
54
55
56
|
// 本日分件数をカウント
const today = new Date();
const todayUTC = today.getUTCDate();
let todayCount = 0;
for (let i = 0; i < resp.records.length; i++) {
if (new Date(resp.records[i]['作成日時'].value).getUTCDate() === todayUTC) {
todayCount++;
}
}
|
totalCountで今月作成件数はカウントできますが、今回はさらに本日分のカウントも取得したかったため、JavaScriptで上のようなfor文でのカウントアップにより取得しました。
新しく追加されたREST APIの活用方法を考えて紹介しました。
アプリとスレッドが連携することで、kintoneのコミュニケーションツールとしての使い方の幅がさらに広がりそうですね！
