kintoneのプラグインはzipファイルで配布されます。中身を意識せずにアップロードして使っている方も多いと思いますが、このzipは普通に解凍でき、中を読むことができます。
この記事では、プラグインのzipを解凍して、どんなファイルがどういう役割を持っているのかを確認します。プラグインを自作したい方が構造を掴む入口としても、導入するプラグインの中身を確認したい方にも使える内容です。
zipを解凍する
特別な手順はありません。右クリックから解凍するだけです。パスワードもかかっておらず、そのまま開けます。
解凍すると、こういったファイルが出てきます。
manifest.json
config.html
config.js
desktop.js
mobile.js
中身はJSON、HTML、JavaScriptだけです。コンパイルされたバイナリや独自形式のファイルは含まれていません。プラグインは特殊な仕組みで動いているわけではなく、Webの標準的な技術だけで構成されています。
manifest.json が目次になっている
構造を理解する起点は manifest.json です。これはプラグインの目次にあたるファイルで、プラグインの名前や説明、そして「どのファイルをどの画面で読み込むか」が書かれています。
{
"manifest_version": 1,
"version": "1.0.0",
"type": "APP",
"name": { "ja": "サンプルプラグイン", "en": "Sample Plugin" },
"description": { "ja": "説明文", "en": "Description" },
"icon": "image/icon.png",
"config": {
"html": "html/config.html",
"js": ["js/config.js"],
"css": ["css/51-modern-default.css", "css/config.css"]
},
"desktop": {
"js": ["js/desktop.js"]
},
"mobile": {
"js": ["js/mobile.js"]
}
}
kintoneはこのファイルを読んで、どのファイルをいつ読み込むかを判断します。
重要なのは、manifest.jsonに書かれていないファイルは、zipに入れても読み込まれないという点です。ファイルを追加したのに動かないときは、まずmanifest.jsonへの記載漏れを疑うことになります。
ファイルの役割は大きく2つに分かれる
manifest.jsonの構造からも分かるとおり、残りのファイルは役割で2つに分類できます。
設定画面側(config)
config.html と config.js が担当します。プラグインをアプリに追加したあと、歯車アイコンから開く設定画面です。どのフィールドを対象にするか、どういう条件で動かすかといった設定を、ここで選んで保存します。
レコード画面側(desktop / mobile)
desktop.js が担当します。レコードを開いたときに動く部分で、設定画面で保存された内容を読み込み、その通りに動作します。mobile.js はモバイル版で、作りは同じです。
つまりプラグインの構造は、設定画面で保存した内容を、レコード画面側が読んで使うという受け渡しに集約されます。
同じプラグインでもアプリごとに違う設定ができるのは、この構造によるものです。プラグイン本体は1つで、設定値だけがアプリごとに別々に保持されます。
中身が読めるのは仕様
プラグインの中身が読めてしまうことを不安に思うかもしれませんが、これは仕様です。ブラウザ上で動くJavaScriptである以上、コードを完全に隠すことはできません。
これは導入する側から見ると、むしろ利点になります。業務システムに組み込むファイルの中身を事前に確認できるからです。何をしているか分からないものを入れるより、読める状態のほうが判断しやすいと言えます。
プラグインを導入する立場であれば、一度解凍して中を見ておくことをおすすめします。すべてのコードを読む必要はありません。どんなファイルがあるか、manifest.jsonに何が書かれているかを確認するだけでも、そのプラグインが何をするものかの見当はつきます。
自作する場合の見通し
中身がJSON・HTML・JavaScriptだけということは、それらを書ければプラグインは作れるということです。
zipに固める工程だけは専用ツールが必要ですが、公式が提供しているコマンドを実行するだけです。中身を書く部分については、通常のWeb開発の知識で足ります。
構造さえ掴んでしまえば、あとは各ファイルの中身を埋めていく作業になります。まずは既存のプラグインを解凍して、manifest.jsonから読んでみるのが近道だと思います。