こんにちは、ジョイゾーでkintoneプラグインの開発エンジニアをやっている川嵜です。
「誰がレコードを見たのか、できれば記録しておきたい…」 「情報共有の徹底のために閲覧の記録を残してみたいけど、標準機能では難しい…」
kintoneを日々利用する中で、このように感じたことはありませんか？
レコードの編集履歴は残りますが、詳細画面を開いた際の閲覧履歴は記録されません。
今回は、そんな標準機能にはない部分をシンプルなコードで作っていきます。
外部サービス連携や複雑なライブラリを使用しなくとも、kintone REST APIなどを使うことで実現させることができます！
この記事では、kintoneのレコード詳細画面表示イベントを利用して、「誰がこのレコードを閲覧したか」を自動で記録する、閲覧履歴機能を作ってみたのでご紹介します！
弊社では初回開発無料の定額39万円でkintoneアプリを開発する定額型開発サービス「システム３９」を提供しております。kintoneの導入やアプリ開発でお困りの方は、お気軽にご相談ください。
＊Webでの打ち合わせも可能です。
ざっくりの仕組み
kintoneのレコード詳細画面表示イベントとkintone REST APIを用いて、以下のような流れで実現します。
- イベントの検知: ユーザーがレコード詳細画面を開いた瞬間（app.record.detail.showイベント発生）を検知する
- 情報の取得: イベント内で、現在ログインしているユーザー情報（誰が）をkintone JS APIから取得する
- レコードの更新: 取得したユーザー情報をkintone REST API（1件のレコードを更新する）を使って更新し、閲覧状況が分かるようにする
この一連の処理を行うことによって、詳細画面が表示されたタイミングで自動的に閲覧履歴を記録することができます。
事前の準備
今回は、kintoneアプリストアの「日報アプリ」をベースに、
レコードを閲覧したユーザー名をレコード内に記録するカスタマイズを行います。
- フォームに閲覧ユーザーを記録するための「ユーザー選択」フィールドを配置する
- フィールド名とフィールドコードを「閲覧ユーザー」に変更する
アプリの構成
実装内容の紹介！
さっそく、コードの紹介に移っていきますが、
先ほどの「仕組み解説」に加えて、実運用の際に困らないための処理もいくつか盛り込んでおきました。
- 「閲覧ユーザー」を編集不可にする
- レコードの作成者は「閲覧ユーザー」には追加しない
- 二重での登録をしないように制御する
コードの適用方法については、kintoneヘルプにて詳しく紹介されているので、
JavaScript/CSSの適用方法が分からないです。という方は、以下リンクをチェックしてみてください。
JavaScriptやCSSでアプリをカスタマイズする
(function() {
'use strict';
const editEvents = [
'app.record.create.show',
'app.record.edit.show',
'app.record.index.edit.show',
'mobile.app.record.create.show',
'mobile.app.record.edit.show'
];
const detailEvents = [
'app.record.detail.show',
'mobile.app.record.detail.show'
];
// 「閲覧ユーザー」フィールドを操作できないようにする
kintone.events.on(editEvents, function(event) {
const record = event.record;
if (record['閲覧ユーザー']) {
record['閲覧ユーザー'].disabled = true;
}
return event;
});
// レコード詳細画面が表示されたら、作成者以外を閲覧履歴として追加する
kintone.events.on(detailEvents, function(event) {
const record = event.record;
const loginUser = kintone.getLoginUser();
const visitors = record['閲覧ユーザー'].value || [];
// 作成者自身の閲覧は、履歴に残さない
if (record['作成者'].value.code === loginUser.code) {
return event;
}
// すでに閲覧ユーザーリストに入っているかチェック
const isIncluded = visitors.some(function(user) {
return user.code === loginUser.code;
});
if (!isIncluded) {
const appId = kintone.app.getId() || kintone.mobile.app.getId();
const recordId = kintone.app.record.getId() || kintone.mobile.app.record.getId();
const params = {
app: appId,
id: recordId,
record: {
'閲覧ユーザー': {
value: visitors.concat([{ code: loginUser.code }])
}
}
};
// レコードを更新する
kintone.api(kintone.api.url('/k/v1/record', true), 'PUT', params).then(function() {
console.log('閲覧履歴を更新しました。');
}).catch(function(error) {
console.error('閲覧履歴の更新に失敗しました。', error);
});
}
return event;
});
})();
動作の確認
コードは完成したので、実際の動きを見ていきます！
レコード追加画面などでは、以下のように「閲覧ユーザー」は編集不可の状態になっています。
では、実際に日報を書いていき保存後に、自分以外のユーザーがレコード詳細画面に遷移すると、、、
このように、ページを開いた瞬間に「閲覧ユーザー」に閲覧を行ったユーザーが追加されていきます。
これにより、閲覧状況が一目で分かるようになり、
「自分の書いた日報を誰が見てくれたのか」がリアルタイムに伝わるようになります！
おわりに
kintoneに閲覧履歴機能をつけるというカスタマイズをしてみました！
今回のような小さなカスタマイズでも、標準機能に「一工夫」加えるだけでさらに業務がしやすくなります。
ただ、こうしたカスタマイズは「便利だから」と闇雲に取り入れるのではなく、まずは標準機能やプラグインで代用できないかを検討することが大切です。
運用コストなどを考えて、「ここぞ」というポイントに絞って活用していき、
プラグインとカスタマイズを程よく組み合わせて、安全に業務が回る仕組みを作っていきましょう！
弊社では初回開発無料の定額39万円でkintoneアプリを開発する定額型開発サービス「システム３９」を提供しております。kintoneの導入やアプリ開発でお困りの方は、お気軽にご相談ください。
＊Webでの打ち合わせも可能です。
