Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
kintone devCamp 2018-朝MESH!コーヒー片手に センサー×kintone...
Search
kintone papers
August 02, 2018
Technology
1.3k
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
kintone devCamp 2018-朝MESH!コーヒー片手に センサー×kintoneを使いこなそう!
kintone papers
August 02, 2018
More Decks by kintone papers
See All by kintone papers
kintone-Introduction-20200917
kintonepapers
0
230
kintoneCafeFukuoka-20200124
kintonepapers
0
43
kintonecafe-kochi-vol11
kintonepapers
0
260
kintonecafeHimi-vol1
kintonepapers
2
76
CoderDojo Meetup Cybozu キッズ向け活動 LT
kintonepapers
0
150
Majikachi-meetup-tokyo06-kintone
kintonepapers
0
950
kintone-cafe-mie-vol2
kintonepapers
0
99
kintone-cafe-kagoshima-vol9
kintonepapers
0
96
kintonecafe-Hamamatsu-v16
kintonepapers
0
270
Other Decks in Technology
See All in Technology
事業成長とAI活用を止めないデータ基盤アーキテクチャの設計思想
hiracky16
0
700
”AIを使う” から ”AIに任せる” へ ─ 開発プロセスを再設計してAIを組織標準にするまで
cyberagentdevelopers
PRO
2
150
2年前に削除したPHPクラスが、 ある日突然決済をエラーにした
ykagano
1
820
AIエージェントがあれば技術書なんてすぐ書けるでしょ→無理でした
watany
4
390
Oracle Base Database Service 技術詳細
oracle4engineer
PRO
15
110k
文字起こし基盤の信頼性
abnoumaru
0
130
変更し続けられるシステムをどう保つか — AI時代のSSoTという設計原則
kawauso
1
1.2k
設計レビューとAIハーネスで向き合う AIが生み出した新しいボトルネックの対処法 / Design Reviews and AI Harnesses Against New Bottlenecks Created by AI
nstock
5
480
20260720_クラウド女子会×PyLadiesTokyoコラボ Amazon Bedrock ハンズオン用資料
yuuka51
2
120
数値で見る Microsoft MVP 〜Spec Kit と GitHub Copilot Agent で作るデータ可視化ダッシュボード〜
yutakaosada
0
140
10年目を迎えた「ABEMA」がどのように AI 活用を推進して、AI 駆動開発にシフトしているのか / How ABEMA, entering its 10th year, is promoting the use of AI and shifting toward AI-driven development
miyukki
1
380
AIツールを導入しても生産性はあがらない? カオナビが直面した 3つの壁と乗り越え方。/ Overcoming 3 Barriers to AI-Driven Productivity at kaonavi
kaonavi
0
270
Featured
See All Featured
HTML-Aware ERB: The Path to Reactive Rendering @ RubyCon 2026, Rimini, Italy
marcoroth
3
360
Agile Leadership in an Agile Organization
kimpetersen
PRO
0
190
SEO Brein meetup: CTRL+C is not how to scale international SEO
lindahogenes
1
2.8k
Product Roadmaps are Hard
iamctodd
55
12k
HDC tutorial
michielstock
2
750
4 Signs Your Business is Dying
shpigford
187
22k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
287
14k
Building Better People: How to give real-time feedback that sticks.
wjessup
370
20k
Leo the Paperboy
mayatellez
8
1.9k
Marketing to machines
jonoalderson
1
5.6k
Winning Ecommerce Organic Search in an AI Era - #searchnstuff2025
aleyda
1
2.1k
Avoiding the “Bad Training, Faster” Trap in the Age of AI
tmiket
0
200
Transcript
kintone devCamp 2018 朝MESH!コーヒー片手に センサー×kintoneを使いこなそう! 1
目次 事前準備 4 ハンズオンの概要 5 完成イメージ 5 温度・湿度をkintoneに記録しよう 5 MESHボタンで来場者の人数を集計しよう
6 MESH SDKでkintoneカスタムタグを用意する 7 MESH SDKの設定 7 MESHアプリでカスタムタグの読み込み 13 温度・湿度をkintoneに記録しよう 18 完成イメージ 18 kintoneアプリの作成 19 アプリテンプレートの読み込み 19 アプリの新規作成 20 APIトークンを生成する 22 MESH SDKでの設定 24 MESH アプリでのレシピ作成 28 MESHの動作ログを確認する 35 動作確認 36 試してみる 36 kintoneの絞り込みとグラフ機能を使ってみる 38 絞り込み 38 グラフ 38 MESHボタンで来場者の人数を集計しよう 40 完成イメージ 40 kintoneアプリの作成 41 アプリテンプレートの読み込み 41 アプリの新規作成 42 APIトークンを生成する 44 MESH SDKでの設定 46 MESH アプリでのレシピ作成 50 MESHの動作ログを確認する 56 動作確認 58 試してみる 58 kintoneの絞り込みとグラフ機能を使ってみる 59 絞り込み 59 グラフ 59 「kintone」タグの中身 61 2
関連情報 73 MESH 73 kintone 73 3
事前準備 - 外部のWiFi に接続可能なPC - MESHアプリを動作させる端末 MESHアプリを動作させるためには以下のいずれかの端末が必要です。 - iOS 9.0以降、Bluetooth
4.0 (Bluetooth Low Energy)を搭載 - Android 5.0以降、Bluetooth 4.0 (Bluetooth Low Energy)を搭載 - Windows 10 Creators Update(1703)以降 Bluetooth 4.0 (内蔵Bluetoothのみ) ※64bit版のみ ※Sモードは除く - kintone 開発者環境 - 無償で利用できる開発者向けの環境です。 - お申込みにはcybozu developer networkのメンバー登録が必要です。 - お申込みから発行に30分程度かかります。 - ハンズオン開始までにお申込み・発行が済んでいない方は、 こちら からkintoneのお試し環境(30日間有効)をお申込みください。 - MESH SDKの利用登録 - 無償で利用できるMESHの開発者向けの環境です。 - MESHアカウントの登録が必要です。 - http://meshprj.com/sdk - - ハンズオンで利用するファイルを下記URLからダウンロードしてください - http://bit.ly/devCamp2018_paper 以下は主催側で用意します - MESH タグ 4
ハンズオンの概要 本日は、2種類のタグを使ったハンズオンを行います。 • 紫色のタグ:温度・湿度タグ • 緑色のタグ:ボタンタグ 1. 講師の解説に合わせて、温度・湿度タグで設定・動作確認 →皆様で一緒に進めていきます。 2.
ボタンタグの設定・動作確認 →基本的には1と同じやり方になりますので、各自で進めてみてください。 質問や困ったことがあったら、その場で手をあげてください。 周りのスタッフがサポートいたします! 後半は講師もサポートに回りますので、不明点はお気軽にご質問ください。 5
完成イメージ 温度・湿度をkintoneに記録しよう MESHの「温度・湿度タグ」で室内の温度と湿度を計測し、kintoneに記録します。 MESHボタンで来場者の人数を集計しよう MESHの「ボタンタグ」を使って人数をカウントし、kintoneに記録します。 6
MESH SDKでkintoneカスタムタグを用意する 最初に、今回のハンズオンでMESHとkintoneを接続するために、MESH SDKを使って kintoneカスタムタグをつくります。MESH SDKにはインポート機能があるので、あらかじ め作成されたカスタムタグをそのまま読み込むことができます。プログラミングの知識がな くても大丈夫ですので、安心して取り組んでください。 MESH SDKの設定
MESHのSDKでkintoneに接続するカスタムタグをつくります。ここではPCを使って作業を 行います。 MESH SDKサイト( https://meshprj.com/sdk/ )にアクセスし、「MESH SDKを使う」をク リックします。 7
ログイン画面が表示されるので、MESHアカウントでログインします。MESHアカウントが ない場合は、以下の「Create New Account」からアカウント作成をお願いします。 ログインすると以下のような画面が表示されます。この画面でMESHのSDKで作成したカス タムタグを管理することができます。新しくカスタムタグをつくるには「Create New Tag 」をクリックします。 8
今回は、あらかじめ用意したカスタムタグをインポートして使いますので、カスタムタグの 作成画面に遷移したら、「Import」をクリックします。 テキストエディタ等で「kintone_MESH_customTag.json」を選び、すべてコピーします。 (ファイルはこちらにあります。 http://bit.ly/devCamp2018-mesh2 ) 9
MESH SDKのインポート画面で、コピーしたjsonテキストをすべてペーストしたら、「 Load JSON」をクリックします。 10
正しく読み込まれると以下のようになります。今回のハンズオンで使用する2つのファンク ションが設定されています。ファンクションの設定値は後で修正しますので、ここでは何も 11
変更せずにそのまま「Save」を押して保存してください。保存したら右上の「×」をクリッ クしてカスタムタグの編集画面を閉じます。 カスタムタグの一覧に表示されます。これで、MESH SDKでの作業は完了です。 12
MESHアプリでカスタムタグの読み込み MESH SDKで作成したカスタムタグをMESHアプリで読み込みます。ここからは、MESHア プリを使いますので、MESHアプリがインストールされた端末を使ってください。 13
MESHアプリを起動します。 MESHアプリを起動すると、以下のような画面(タブレット版/スマートフォン版)が表示 されます。画面の内容に従ってチュートリアルを進めてください。 後でMESHタグとのペアリングを行いますので、ここではチュートリアルはスキップしてく ださい。 14
チュートリアルをスキップすると、MESHのキャンバス画面が表示されます。ここで、先ほ どMESH SDKでつくったkintoneとつなぐカスタムタグをロードするために、MESHアプリ からMESHアカウントでログインします。右上のメニューを開き、「アカウント」または「 SDK」をタップしてください。(アプリのバージョンによって表記が異なります。) ※既にログイン済みの場合はこの手順はスキップしてください。 15
MESHアカウントでログインすると、タグリストに「カスタム」が現れます。タブレットで は画面右側、スマートフォンでは画面下のタグメニューをスクロールしていってください。 「カスタム」の「+追加」をタップしてください。 カスタムタグの一覧に、先ほどMESH SDKでつくった「kintone」が表示されているので、 それを選択します。 16
「追加」をタップします。 17
カスタムタグの一覧に追加されました。 ここまでで事前準備は終了です。 それでは次にMESHタグを使ってつなげていきましょう。ここからは、温度・湿度タグ ま たは ボタンタグを使用する人にわかれます。それぞれのパートを確認しながら進めてくだ さい。 18
温度・湿度をkintoneに記録しよう 完成イメージ MESHの「温度・湿度タグ」で室内の温度と湿度を計測し、kintoneに記録します。 MESH 温度・湿度(Temperature & Humidity)タグは、温度や湿度が変化した時の通知など、周りの 温湿度の変化をスイッチとして使えます。また、温度と湿度の値を取得することもできるた め、タイマータグと組み合わせて定期的に温度と湿度を計測することもできます。 kintone
kintoneでは、グラフ作成やユーザーへの通知が簡単にできるので ◦ 温度・湿度の変化をグラフで可視化 ◦ 温度が一定の値を超えたら、指定したユーザーへ通知 といったことが実現できます。 19
kintoneアプリの作成 今回は、kintoneアプリのテンプレートをご用意しました。 各自のkintone環境にアプリテンプレートを読み込んで、そのテンプレートを使ってアプリ を作成します。 アプリテンプレートの読み込み kintoneのポータル画面を開き、 から kintoneシステム管理 をクリックします。 アプリテンプレートの読み込みを行います。
20
ダウンロードしたハンズオン用ファイルの中から、「アプリテンプレート(温度).zip」を 選択してください。 アプリテンプレートの一覧に、追加したテンプレート が表示されればOKです。 アプリの新規作成 ポータル画面に戻り、+ ボタンからアプリを追加します。 21
アプリストアで「テンプレートから作成」をクリックし、先ほど追加したテンプレートの 「アプリを作成」ボタンをクリックします。 アプリが追加されました! 22
APIトークンを生成する MESHからkintoneへデータを渡す際の認証に利用する、APIトークンを用意します。 先ほど追加したアプリを開き、歯車アイコンから設定画面を開きます。 設定 タブの APIトークン をクリックします。 「生成する」 ボタンをクリックし、表示されたAPIトークンをテキストエディタ等にコピー しておいてください。※のちほど、MESHの設定で利用します。
23
APIトークンのアクセス権を設定します。 デフォルトではレコードを閲覧する権限しかチェックが入っていません。 今回はMESHからkintoneのレコードを追加するため、アクセス権の「レコード追加」に チェックを入れて保存します。 設定が終わったら「アプリを更新」もお忘れなく! 最後に、アプリを開いた状態でサブドメインとアプリIDを確認し、メモしておいてくださ い。 こちらもMESH側の設定で利用します。 URLが「https:// subdomain
.cybozu.com/k/ 7 /」の場合 サブドメイン :subdomain アプリID :7 24
MESH SDKでの設定 続いて、kintoneと接続するために必要な設定をしていきます。 MESH SDK( http://meshprj.com/sdk )にアクセスして、カスタムタグの管理画面に遷移し ます。先ほど作成した「kintone」の「Edit」をクリックします。 25
カスタムタグの編集画面が開きます。Functionのメニューを開いていくと、プロパティや ソースコードを指定することができます。「温度・湿度の情報を送信」の設定メニューを開 いていきます。 26
「Property」を開いたら、先ほどkintoneアプリの設定中にメモをしておいたkintoneアプリ のドメイン名、アプリID、APIトークンを設定します。 27
設定したら、「Save」をクリックしてください。 28
MESH アプリでのレシピ作成 次にMESHアプリの方でボタンタグをつないで進めていきます。まず、MESHタグの電源を オンにします。手元にMESHタグを用意してください。MESHタグの各部名称は以下の通り です。※ボタンタグのイメージで説明しますが、温度・湿度でも同じです。 MESHタグの「アイコン」部分を2秒押し続けると電源のオン/オフができます。また、一度 押すと電源状態の確認、2連続で押すとBluetooth接続状態の確認ができます。 電源の入れ方は以下のページでも動画で紹介しているので、わからない場合は参照してくだ さい。 https://support.meshprj.com/hc/ja/articles/212602937
(参考)各ステータスと操作の関係は以下の通りです。 MESHタグの状態 電源オン 電源オフ バッテリー切れ 操 作 2秒長押し 電源オン→電源オフ 電源オフ→電源オン — シングルクリック バッテリー残量確認 — — ダブルクリック 無線接続状態確認 — — 10秒長押し リセット・再起動 リセット・再起動 — 29
次にMESHタグをペアリングします。タグリストの一番上にある「+追加」をタップしま す。 30
電源が入ったMESHタグをペアリングするタブレット/スマートフォンに近づけます。 ペアリングされると、以下のようにタグ一覧に追加されます。ここまででMESHタグのペア リングは完了です。 31
つぎに、MESH SDKで修正したカスタムタグの修正内容を反映させます。カスタムタグの 「kintone」をタップし、「タグ情報」の「アップデートを確認する」をタップすること で、MESH SDKで修正した内容を反映させることができます。 32
アップデートをタップすると、MESH SDKの修正内容が反映されます。 ここからレシピをつくっていきます。「タイマー」「温度・湿度」「kintone」の3つドラッ グ&ドロップでキャンバスに配置します。そのあとに、それぞれのタグの設定を変更してい きます。 「タイマー」の設定内容です。「一定の間隔で」を使います。間隔は確認がしやすいように 30秒程度が良いでしょう。実際に使用する場合にはご自由に設定してください。 33
「温度・湿度」の設定内容です。「温度を確認する」を使います。温度の設定を「-10 - 50 」に設定します。この温度の範囲内に次の処理にすすむことを意味します。特定の温度範囲 になった場合のみデータを送りたい場合は、この温度範囲を変更します。 34
「kintone」の設定内容です。「温度・湿度の情報を送信」を選択します。ドメイン名、ア プリIDとAPIトークンはMESH SDKで設定したデフォルト値が反映されています。もし、異 なるものに設定したい場合はこの画面から変更することが可能です。 すべて設定が完了したら、以下のように「タイマー」「温度・湿度」「kintone」をつなぎ ます。これでレシピは完成です。 35
MESHの動作ログを確認する MESHのカスタムタグのログを確認するには、メニューのログをタップします。 36
以下のようにログ画面でログを確認することができます。 動作確認 試してみる MESHの温度・湿度タグを使って、実際に試してみましょう! 1. 現在の気温と湿度を確認する MESHタグを机の上に置き、計測されるまで30秒ほど待つと、 kintoneに現在の気温・湿度が登録されます。 37
※kintoneの画面を更新して確認してください。 2. MESHタグを手で握って、温度・湿度を疑似的に上げる 室温を変化させることはできないので、MESHタグを握って疑似的に温度・湿度を あげてみましょう。 温度と湿度に変化があることを確認できましたか? 38
kintoneの絞り込みとグラフ機能を使ってみる 絞り込み 一覧で表示されているデータは、条件による絞り込みやソートを行うことができます。 絞り込みの条件やソートの変更を行うには、 をクリックします。 グラフ グラフは、一覧名の右に表示されているアイコンから開くことができます。 39
グラフの設定を変えるには、 をクリックします。 様々な種類のグラフを作ることができますので、ぜひ試してみてください。 40
MESHボタンで来場者の人数を集計しよう 完成イメージ MESHの「ボタンタグ」を使って人数をカウントし、kintoneに記録します。 MESH 緑色のボタン(Button)タグは、ボタンスイッチとして使えます。ボタン(Button)タグが1回押 されたら、長押しされたら、2連続で押されたら何かが起こる、 そんなシンプルなアイデア をカタチにできます。 kintone kintoneでは、グラフ作成やユーザーへの通知が簡単にできるので
◦ 人数を集計 ◦ グラフで時間ごとの推移を確認 といったことが実現できます。 41
kintoneアプリの作成 今回は、kintoneアプリのテンプレートをご用意しました。 各自のkintone環境にアプリテンプレートを読み込んで、そのテンプレートを使ってアプリ を作成します。 アプリテンプレートの読み込み kintoneのポータル画面を開き、 から kintoneシステム管理 をクリックします。 アプリテンプレートの読み込みを行います。
42
ダウンロードしたハンズオン用ファイルの中から、「アプリテンプレート(カウント).zip 」を選択してください。 アプリテンプレートの一覧に、追加したテンプレート が表示されればOKです。 アプリの新規作成 ポータル画面に戻り、+ ボタンからアプリを追加します。 43
アプリストアで「テンプレートから作成」をクリックし、先ほど追加したテンプレートの 「アプリを作成」ボタンをクリックします。 アプリが追加されました! 44
APIトークンを生成する MESHからkintoneへデータを渡す際の認証に利用する、APIトークンを用意します。 先ほど追加したアプリを開き、歯車アイコンから設定画面を開きます。 設定 タブの APIトークン をクリックします。 「生成する」 ボタンをクリックし、表示されたAPIトークンをコピーしておいてください。 ※のちほど、MESHの設定で利用します。
45
APIトークンのアクセス権を設定します。 デフォルトではレコードを閲覧する権限しかチェックが入っていません。 今回はMESHからkintoneのレコードを追加するため、アクセス権の「レコード追加」に チェックを入れて保存します。 設定が終わったら「アプリを更新」もお忘れなく! 最後に、アプリを開いた状態でサブドメインとアプリIDを確認し、メモしておいてくださ い。 こちらもMESH側の設定で利用します。 URLが「https:// subdomain
.cybozu.com/k/ 7 /」の場合 サブドメイン :subdomain アプリID :7 46
MESH SDKでの設定 続いて、kintoneと接続するために必要な設定をしていきます。 MESH SDK( http://meshprj.com/sdk )にアクセスして、カスタムタグの管理画面に遷移し ます。先ほど作成した「kintone」の「Edit」をクリックします。 47
カスタムタグの編集画面が開きます。Functionのメニューを開いていくと、プロパティや ソースコードを指定することができます。「来場者カウントにレコードを登録」の設定メ ニューを開いていきます。 48
「Property」を開いたら、先ほどkintoneアプリの設定中にメモをしておいたkintoneアプリ のドメイン名、アプリID、APIトークンを設定します。 49
設定したら、「Save」をクリックしてください。 50
MESH アプリでのレシピ作成 次にMESHアプリの方でボタンタグをつないで進めていきます。まず、MESHタグの電源を オンにします。手元にMESHタグを用意してください。MESHタグの各部名称は以下の通り です。 MESHタグの「アイコン」部分を2秒押し続けると電源のオン/オフができます。また、一度 押すと電源状態の確認、2連続で押すとBluetooth接続状態の確認ができます。 電源の入れ方は以下のページでも動画で紹介しているので、わからない場合は参照してくだ さい。 https://support.meshprj.com/hc/ja/articles/212602937
(参考)各ステータスと操作の関係は以下の通りです。 MESHタグの状態 電源オン 電源オフ バッテリー切れ 操 作 2秒長押し 電源オン→電源オフ 電源オフ→電源オン — シングルクリック バッテリー残量確認 — — ダブルクリック 無線接続状態確認 — — 10秒長押し リセット・再起動 リセット・再起動 — 次にMESHタグをペアリングします。タグリストの一番上にある「+追加」をタップしま す。 51
電源が入ったMESHタグをペアリングするタブレット/スマートフォンに近づけます。 52
ペアリングされると、以下のようにタグ一覧に追加されます。ここまででMESHタグのペア リングは完了です。 つぎに、MESH SDKで修正したカスタムタグの修正内容を反映させます。カスタムタグの 「kintone」をタップし、「タグ情報」の「アップデートを確認する」をタップすること で、MESH SDKで修正した内容を反映させることができます。 53
アップデートをタップすると、MESH SDKの修正内容が反映されます。 54
ここからレシピをつくっていきます。「ボタン」を2つ、「kintone」を1つドラッグ&ド ロップでキャンバスに配置します。そのあとに、それぞれのタグの設定を変更していきま す。 1つ目の「ボタン」の設定内容です。このレシピでは1回押されたらカウントをプラスし、 長押しされたらカウントをマイナスするため、1つ目のボタンは「1回押されたら」に設定 します。 55
2つ目のボタンは「長押しされたら」に設定します。 「kintone」の設定内容です。「来場者カウントにレコードを登録」を選択します。ドメイ ン名、アプリIDとAPIトークンはMESH SDKで設定したデフォルト値が反映されています。 もし、異なるものに設定したい場合はこの画面から変更することが可能です。 56
すべて設定が完了したらレシピを以下のように「ボタン」2つと「kintone」をつなげます。 MESHの動作ログを確認する MESHのカスタムタグのログを確認するには、メニューのログをタップします。 57
以下のようにログ画面でログを確認することができます。 58
動作確認 試してみる MESHのボタンタグを使って、実際に試してみましょう! 1. ボタンを1回押す kintone に人数カウント ”1” としてレコードが登録されます。 ※kintoneの画面を更新して確認してください。
2. ボタンを長押しする kintone に人数カウント ”-1” としてレコードが登録されます。 間違えてカウントしてしまった時には、このように長押しでカウント数を 調整できるようにしました! 59
kintoneの絞り込みとグラフ機能を使ってみる 絞り込み 一覧で表示されているデータは、条件による絞り込みやソートを行うことができます。 絞り込みの条件やソートの変更を行うには、 をクリックします。 グラフ グラフは、一覧名の右に表示されているアイコンから開くことができます。 60
グラフの設定を変えるには、 をクリックします。 様々な種類のグラフを作ることができますので、ぜひ試してみてください。 61
MESH SDKの説明 「kintone」タグをつくったMESH SDKについて説明します。より効果的にMESH SDKを活 用したり、オリジナルのMESH SDKを作ってみたい方におすすめの情報です。 カスタムタグの構造について カスタムタグには、ファンクションや入出力のコネクター、設定を保持できるプロパティな どのパーツから成り立っており、それぞれSDKで設定できるようになっています。
MESHアプリ上のカスタムタグ MESHタグはタグ共通の要素と, 機能毎の要素で構成されます。タグは1つ以上の機能を持ち ます。タグと機能は、それぞれ以下のような属性値を持ち、それぞれSDKで設定することが できます。 62
SDK上のカスタムタグ編集画面 それぞれの属性値をSDKで設定することができます。 機能毎にコネクターや設定の数と実行するコードを定義することができます。機能の数も任 意に増やすことができます。それぞれ設定できる項目を見ていきましょう 63
コネクター(Connector) Connectorセクションでは、コネクターの定義が行えます。入力コネクターと出力コネク ターのそれぞれの数とコネクター名を定義することができます。Input Connector、Output Connectorの横にあるそれぞれの[+]ボタンをクリックすることで、コネクター数をそれぞれ 増やすことができます。 設定(Property) Propertyセクションでは、設定を定義することができます。表示名、型、初期値を定義で き、設定の数も増やすことが可能です。 64
コード(Code) Codeセクションでは、JavaSscriptを使ってCodeを記述することができます。 65
MESHタグのコードは Initialize, Receive, Execute, Result の4つのメソッドを中心に以下 のように構成されています。 66
4つのメソッドの概要は以下の通りです。 Initialize 機能の初期化時に呼ばれます。内部変数の確保やスケジューラーの設定といった、 初期化処理が必要な場合に実装します。 Receive 入力コネクターからメッセージを受け取った際に呼ばれます。入力コネクターが複 数あり、どれから受け取ったか区別したい場合に実装します。入力コネクターが一 つの場合にはReceiveに記述する必要はありません。 Execute 機能実行時に呼ばれます。メインの処理はこのメソッドに記述します。
Result Executeメソッドが完了し、出力コネクターから次のタグにメッセージを送信する際 に呼ばれます。出力コネクターが複数あり、どのコネクターからメッセージを出力 するかを選びたい場合に実装します。デフォルトでは全ての出力コネクターから出 力されます。 67
これらの4つのメソッドに加えて以下の5つの仕組みがあります。 コネクター制御 タグの機能の入力コネクターや出力コネクターを複数使う場合に、コネクター制御 によって処理を振り分けルことができます。 入力コネクターが複数ある場合、どのコネクターから入力されたのかを区別して処 理を変えることができます。どの入力コネクターがメッセージを受け取ったのか は、「Receive」メソッド内で参照可能な定数 「index」 に格納されています。サン プルコードは以下の通りです。
[Receive] 1 2 3 if ( index == 0 ) { //1番目のコネクタから入力 log( "message from #0" ); } タグの機能実行完了後、デフォルトでは全ての出力コネクターからメッセージが出 力されますが、出力するコネクタを選択することもできます。設定は、「Result」 メソッド内で戻り値に「indexes」としてコネクターID配列を指定します。サンプル コードは以下の通りです。 68
[Result] 1 2 3 4 return { indexes : [0,
1], //1番目, 2番目のコネクタから出力 resultType : "continue" } 処理制御 各メソッドの戻り値で、次のメソッドを呼ぶかどうかを制御することができます。 例えば次のメソッドを実行する場合には、resultTypeにcontinueを指定します。 [Receive / Execute / Result] 1 return {resultType : “continue”} resultTypeの値には以下の3つのパターンがあります。 resultType 処理制御 continue 次のメソッドを呼びます。 resultTypeが明示的に指定されなかった場合には、デフォルト値と してcontinueが指定されたとみなされます。 stop 次のメソッドを呼ばずに処理を停止します。 処理が止まってしまうので、あまり利用することはないかもしれま せん。 pause 次のメソッドを呼ばずに待機します。 Web APIなどの非同期処理の応答を待つなど、特定の条件が満たさ れることを待つ場合に利用します。 定数・変数 タグの機能内のメソッドから共通にアクセスできる定数・変数が用意されています。定数・ 変数には下記の種類があります。 69
定 数 properties タグの機能の設定パラメータです。ユーザが設定した値をソース コードから参照することができます。 index 入力コネクターが複数ある場合、何番目のコネクターで受け取っ たかを示す値です。これは、Receiveメソッドでのみアクセス可 能です。 変
数 runtimeValues 同一機能内のメソッド間で共有できる変数です。主に機能の状態 変数としての利用を想定しています。 変数の初期化はInitializeメソッド内で行います。 messageValue s タグ間でデータをやり取りするための変数です。タグの出力コネ クターから他のタグの入力コネクターに送られるメッセージの データを参照・更新できます。 それぞれ参照する方法は以下のようになります。 定数:propertiesを参照する方法 [Initialize / Receive / Execute / Result] 1 var count = properties.myProp; 定数:indexを参照する方法 [Receive] 1 2 3 if ( index == 0 ) { //1番目のコネクタから入力 log( "message from #0" ); } 変数:runtimeValuesを参照する方法 runtimeValuesの初期化は”Initialize”メソッド内で行います。以下のように戻り値に runtimeValuesオブジェクトとして指定します。 [Initialize] 1 2 3 return { runtimeValues : { count : 0 } //"count"という変数を定義して初期化する } runtimeValuesへのアクセスは、各メソッド内でruntimeValuesオブジェクトを参照・更新し て行います。ただし、更新を行った場合は、メソッドの戻り値として、runtimeValuesオブ ジェクトを必ず指定してください。忘れると、更新が反映されません。 [Execute] 70
1 2 3 4 5 6 7 8 9 10
11 12 13 runtimeValues.count++; if ( runtimeValues.count == properties.Limit ) { runtimeValues.count = 0; return { resultType : "continue", //処理を継続 runtimeValues : runtimeValues //runtimeValuesとして返す }; } else { return { resultType : "pause", //処理を停止 runtimeValues : runtimeValues //runtimeValuesとして返す } } 変数:messageValuesを参照する方法 messageValuesへのアクセスは、各メソッド内でmessageValuesオブジェクトを参照・更 新して行います。ただし、更新を行った場合は、メソッドの戻り値として、 messageValuesオブジェクトを必ず指定してください。指定を忘れると、更新が反映され ません。 メッセージ送信側のソースコード例 [Receive / Execute / Result] 1 2 3 4 5 6 7 var msgVal = {}; msgVal.date = new Date(); //メッセージに情報(e.g. 実行日時)を追加 return { messageValues : msgVal, //messageValuesとして返す resultType : "continue" } メッセージ受信側のソースコード例 1 var date = messageValues.date; 71
タスクスケジューラー タスクスケジューラを設定するとタグの機能をタイマー実行させることができます。 Initializeメソッドの戻り値にtaskConfigオブジェクトを指定することで設定できます。10秒 間隔でタグの機能を実行する場合は、以下のようなコードになります。 [Initialize] 1 2 3 4 5
6 7 return { resultType : "pause", taskConfig : { mode : "interval", seconds : 10 } } taskConfigの設定パターンは以下の種類があります。 設定パターン 例 一定間隔で実行 taskConfig : { //10秒ごとに実行 mode : "interval", seconds : 10 } 毎日、指定した時間に実 行 taskConfig : { //毎日12時29分に実行 mode : "every_day", hours : 12, minutes : 29 } 72
指定した日時に実行 taskConfig : { //2015年7月31日 17時27分00秒に実 行 mode : "date",
year : 2015, month : 7, day : 31, hours : 17, minutes : 27, seconds : 00 } ライブラリ SDKではカスタムタグ開発で共通利用可能な関数があります。以下の2つの関数が用意され ています。 Ajax 非同期HTTP通信を可能にします。Ajaxは非同期通信のため、応答を待ちたい場 合はメソッドの戻り値に resultType: “pause”を指定してください。 ロ グ 出 力 開発時のデバッグ用途として、メソッド内で実行ログを出力することができま す。出力したログはMESHアプリのログダイアログで確認できます。 以下のように記述することでログが出力できます。 log("出力したい文字列"); Ajaxで利用可能なパラメータは以下の通りです。jQueryのajaxメソッドに準拠しています。 パラメータ 説明 url アクセスしたいURL data URLに送信したいデータオブジェクト type HTTP通信の種類 {GET / POST} contentType サーバにデータを送信する際に用いるcontent-typeヘッダの値 dataType サーバから返されるデータの型 {xml / html / script / json / jsonp / text} timeout タイムアウト時間(ミリ秒) 73
beforeSend リクエスト送信前にコールバックされるイベントハンドラ success 通信が成功した場合にコールバックされるイベントハンドラ error 通信が失敗した場合にコールバックされるイベントハンドラ 困ったときは、MESH公式サイトの情報や、Qiitaなどの開発者コミュニティでも様々なカス タムタグの作品例が紹介されています。それらの情報をうまく活用しながら開発を進めてい きましょう。身の回りにMESHのSDKを活用している人やJavaScriptに詳しい人がいたら聞 いてみたりしても良いですね。
関連情報 MESH MESH SDKリファレンス https://meshprj.com/sdk/doc/ja/ MESHサポートページ https://support.meshprj.com/hc/ja 参考リンク Qiitaコミュニティ https://qiita.com/search?q=MESH+SDK kintone 技術情報(cybozu developer network) https://developer.cybozu.io/ MESHを使ってドアの開閉をkintoneに通知しよう https://developer.cybozu.io/hc/ja/articles/213430966 MESHボタンで来場者の人数を集計しよう https://developer.cybozu.io/hc/ja/articles/115005313923 【MESHを使って】小一時間でkintone呼び出しボタンが出来ちゃった。 https://kintone-blog.cybozu.co.jp/tips/000281.html 74