Skip to content

Latest commit

 

History

History
95 lines (67 loc) · 6.66 KB

cat_ui.md

File metadata and controls

95 lines (67 loc) · 6.66 KB
Raw

Cat UI(プラットフォーム)

Cat UI(プラットフォーム)は、Web UI(およびAPI)を楽に量産するための仕組みです。
この仕組みを使うことで、APIやUIが容易に作ることを可能にします。

一般的には、APIを作ろうとすると、CGIやAPIサーバのプログラムが必要になります。やりたいこと自体は、コマンドをいくつか実行する程度の内容なことが良くあります。
そこで、APIに必要な機能のうち、スクリプト自体を除く、以下の機能を代行する仕組みをcats_dogsに組み込みました。

  • スクリプトをAPI経由で実行する仕組み(cat_mult_getexecが担当)
  • APIを呼び出すルール設定(Cat UI設定ファイル)
  • APIの入出力をWeb UIフォームに変換する仕組み(cat_tmplviewとcat_ui.jsが担当)

これが、Cat UIプラットフォームです。要は、cats_dogsでは、簡単なスクリプトと設定ファイルで、APIとWeb UIが実現できるわけです。

APIの仕様

スクリプトで簡易に実装することを実現する為に、APIの仕様を、以下のように単純な機能に限定しています。

  • 入力は、URLパラメータのみ
  • 出力は、plain/textとCSVフォーマット(RFC4180準拠)のみ

スクリプト作成の支援機能

シェルスクリプトによる、Cat UI用のスクリプト作成を容易にするため、cats_dogsには以下の支援のためのコマンドが含まれています。

動作概略

Cat UIプラットフォームは、cat_tmplview、cat_ui.js、cat_mult_getexecが連係することで実現していて、以下のような構造になっています。

Cat UIプラットフォーム

Cat UIが使われると、具体的には以下のような処理が行なわれます。

  1. アクセスされたURLに対応するテンプレートファイルを変換される。(cat_tmplviewの処理)
  2. {{cat_ui UI名}}のテンプレート処理で、指定したUI名のUI設定ファイル(UI名 + .ui)したがって、HTMLを生成する。(cat_tmplviewの処理)
  3. UI(HTML)にAPI呼び出し処理を設定する。(cat_ui.jsの処理)
  4. APIがAjax的に呼び出される。(cat_ui.jsの処理)
  5. APIのURLからAPI名を取り出す。(cat_multi_getexecの処理)
  6. API設定ファイル(API名 + .api)に従って、スクリプトを実行する。(cat_multi_getexecの処理)
  7. スクリプトの結果を、API設定ファイルに従って、応答する。(cat_multi_getexecの処理)

Cat UI設定ファイル群

Cat UIプラットフォームでは、以下の、3種類のファイル(1つはスクリプト)を用意することで、UIおよびAPIが追加できます。

UI設定ファイル(*.ui)

Web UIの入力パラメータとその表示用のラベルをしていするファイルです。 UI名にUI設定ファイルの拡張子(デフォルトはui)をつけたファイル名です。
ファイルの書式については、cat_tmplviewのUI設定ファイルの説明を参照してください。

API設定ファイル(*.api)

APIが実行するシェルスクリプトとその引数にわたす値を指定するファイルです。 UI名にAPI設定ファイルの拡張子(デフォルトはapi)をつけたファイル名です。
ファイルの書式については、cat_multi_getexecのAPI設定ファイルの説明を参照してください。

API用スクリプト(*.sh)

API設定ファイルで指定する、APIの実処理を担うスクリプトです。 スクリプトの呼び出しの仕様については、cat_multi_getexecのAPI設定ファイルの説明を参照してください。
スクリプトの作成をサポートするプログラム(cat_verify_type、cat_args2csv、cat_printcsv)を使うことで、入力のバリデーションやCSVの出力が簡単に行なえるようになっています。

構築フロー

Cat UIプラットフォーム構築の流れは以下のようになります。詳細は各プログラムの仕様を確認してください。

  1. Nginxがcat_multi_getexecを呼び出すようにする。
    1. cat_multi_getexecを動作させる。
    2. API専用のパス(/api等)を決めて、nginxにそのパスにcat_multi_getexec用のproxy設定を追加する。
    3. API専用パス以外のコンテンツが今まで通り表示できることを確認する
  2. Cat UI用のAPIを動作するようにする。
    1. APIごとにAPI設定ファイル(APIの入力出力設定をする)を追加する。
    2. APIの実処理を行なうスクリプトを用意する。
    3. APIが実行できるか確認する。https://<hostname>/api/csv?n=3 などでAPIが動くか確認する。
  3. Cat UI用のHTML検索フォームを作る
    1. APIごとのUI設定ファイルを用意する。
    2. {{cat_ui xxx}}を使ったページを作る。
    3. 検索フォームが表示できることを確認する。
  4. HTML検索フォームからAPIが実行できることを確認する
    1. 検索フォームが使えるか確認するだけ

関連プログラム

Cat UIプラットフォームに関連する主なプログラムは、以下の通りです。

  • 簡易UI作成を支援するプログラム群
    • cat_tmplview cat_uiテンプレート関数を使うことでWebUIを生成することができるので、簡易UIの量産が可能になります。
    • cat_ui.js APIのCSV出力をHTMLのtableとして出力する機能が特徴的です。
  • 簡易API作成を支援するプログラム
    • cat_multi_getexec テキストやCSVを出力するシェルスクリプトと簡易な設定ファイルを用意することで、APIが提供できるようになります。
    • cat_verify_type シェルスクリプトではチェックしにくいIPアドレスなどをチェックするプログラムです。スクリプトでの入力値のチェックが楽になります。
    • cat_args2csv、cat_printcsv シェルスクリプトで、RFC4180のCSVフォーマットの生成を支援します。