降りつぶし.net～同期するWebアプリ・スマホアプリの開発・運用～

第3回　Webアプリ「降りつぶし.net」の構築

降りつぶし, Webアプリ, スマホアプリ, i降りつぶし, 降りつぶしroid, データベース, CMS, Geeklog, OAuth, Twitter, PHP, CSV

この記事を読むのに必要な時間：およそ 4 分

降りつぶし.netの構築

降りつぶし.netは，「⁠日本の鉄道駅」にいつ乗下車したのか，を管理するソリューションです。第2回は，その基盤となる，全国の鉄道駅データベースの構築について説明しました。第3回は，その上に構築されているWebアプリケーションを説明します。

図1　降りつぶし.net サイトトップ

図1　降りつぶし.net サイトトップ

Webアプリ構築にCMSを利用

Webアプリとしての降りつぶし.netに最低限求められる仕様は，『⁠複数のユーザが自らの乗下車記録を管理できる』ことです。そのためには，各ユーザを識別し，ユーザのみが自分の記録を入出力できるようにしなければなりません。また，駅データベースやスマホアプリの更新情報をアナウンスしたり，ユーザからデータベースの誤りについてのご指摘を承ったりするUIがあれば，ベターです。

そこで，何らかのCMSを利用し，記録の入出力や同期機能などは独自実装して，アナウンスにはブログ機能を，ユーザからの承りは掲示板機能を使うことにしました。

CMSとして「Geeklog」を採用

GeeklogはオープンソースCMSです。動作がまずまず軽量であり，細かな権限設定ができ，デザインや出力内容のカスタマイズも容易です。日本語化，および日本語での情報交換も活発です（Geeklog Japanese）。また，OAuth認証に対応しており，Twitterなどのユーザであれば，フォーム入力なしで，簡単に新規登録ができます。

筆者の会社では，このGeeklogを用いたカスタマイズを行った経験がいくつかあります（導入例：NPO法人寿クリーンセンター⁠）⁠。また第1回で触れたとおり，降りつぶしという趣味はニッチであり，ユーザ数はたかだか数千人と踏んでいましたので，パフォーマンスはさほどシビアではありません。これらを考慮し，とりわけOAuth認証による新規登録の容易さに惹かれ，Geeklogを採用することにしました。

Geeklogのカスタマイズ

Geeklogにはさまざまなカスタマイズ方法が提供されています。プラグインによる開発はもちろん，ヘッダやフッタの表示のみの流用，認証機能のみの流用など，PHPの開発力さえあれば，かなり複雑なWebアプリケーションでも平易に構築することができます。

実際に，記録入力トップページ“⁠http://oritsubushi.net/oritsubushi/index.php⁠”のコードを抜粋してみます。

リスト1　“⁠oritsubushi/index.php⁠”の概要

include_once 'oritsubushi.inc.php';

ORITSUBUSHI_checkFirst();

$HTML = COM_siteHeader()
	. COM_startBlock('記録の入力・編集 - 事業者選択')
	. ORITSUBUSHI_build()
	. COM_endBlock()
	. COM_siteFooter();
	
echo $HTML;

function ORITSUBUSHI_build()
{
	global $_DB, $_USER;

	$html = <<<HTML
<h4>事業者一覧</h4>
HTML
	;
	$date = date('Ymd');
	$set = array();
	$statistics = array(
		'total' => array('total' => 0, 'completion' => 0),
		'type' => array(),
		'each' => array()
	);
	//以下略

COM_xxxxという関数はGeeklogの共通処理関数で，自由に呼び出すことができます。一方，ORITSUBUSHI_xxxxという関数は，筆者が実装した関数です。

COM_siteHeader，COM_startBlock，COM_endBlock，COM_siteFooterの各関数は，それぞれ，ユーザの権限に応じた適切なヘッダ・サイドバー・フッタなどを生成しています。そして，ORITSUBUSHI_build関数で，好き勝手なコンテンツを生成しさえすれば，Geeklogの他のページとまったく同じ外観のページができあがる，という寸法です。

一方，これらのCOM_xxxx関数を呼び出さず適切なコンテントタイプと内容を出力することにより，整形されたHTMLではなく，JSONなどを返すことも可能となるわけです。

最初に呼び出しているORITSUBUSHI_checkFirst関数は，最初にインクルードした“⁠oritsubushi.inc.php⁠”内で，以下のとおりに定義されています。

リスト2　“⁠oritsubushi/oritsubushi.inc.php⁠”より抜粋

include_once 'lib-common.php';

function ORITSUBUSHI_checkUser()
{
	global $_USER;
	return isset($_USER['uid']) && $_USER['uid'] > 1;
}

function ORITSUBUSHI_checkFirst()
{
	if(ORITSUBUSHI_checkUser()) {
		return;
	} else {
		echo COM_refresh('/index.php');
		exit;
	}
}

スクリプトの冒頭でGeeklogの“⁠lib-common.php⁠”をインクルードするだけで，自動的に認証が行われます。グローバル変数$_USERには認証済のユーザ情報が連想配列で格納されており，$_USER['uid']はユーザIDです。Geeklogでは，この値はゲストユーザの場合1となり，デフォルトの管理者Adminの場合が2で，一般の登録ユーザは3以上となります。

降りつぶし.netでは，登録ユーザ全員に乗下車記録の入出力を認めているため，権限チェックなしで，ユーザIDが1より大きければ正規ユーザとみなせることになります。ORITSUBUSHI_checkFirst関数内では，ユーザIDが1より大きくない，すなわちゲストユーザの場合，ログインフォームを持つサイトトップへとリダイレクトさせ，乗下車記録ページヘのアクセスを拒むことになります。

これらにより，ORITSUBUSHI_build関数の内容の実装のみに集中できました。CMSの面目躍如です。

降りつぶし.net　乗下車記録ページの構成

降りつぶし.netが独自に実装した，呼び出し可能な各PHPスクリプトは，すべて“⁠oritsubushi⁠”ディレクトリ直下に置かれており，以下のような遷移関係にあります（管理者ログイン時のみ動作するメンテナンススクリプトを除く⁠）⁠。

図2　降りつぶし.net　独自スクリプト群

図2　降りつぶし.net　独自スクリプト群

記録入力トップページ“index.php”

図3　記録入力トップページ

図3　記録入力トップページ

鉄道事業者一覧です。各事業者名のリンクをクリックすると，その事業者のページが開きます。ただし，すべての事業者を表示してしまうと，コンテンツエリアが長くなりすぎてしまうため，事業者種別ごとにまとめて畳んでおき，事業者種別のクリックによって事業者一覧を展開するようにしました。

また，このページに限らず，記録入力の各ページのコンテンツトップには一括アップロード用フォームとボタンがあり，コンテンツボトムには一括ダウンロード用ボタンがあります。

降りつぶし, Webアプリ, スマホアプリ, i降りつぶし, 降りつぶしroid, データベース, CMS, Geeklog, OAuth, Twitter, PHP, CSV

著者プロフィール

よねざわいずみ

合資会社ダブルエスエフ代表社員。学習塾講師やら芸能ライターやら劇団主宰やらいろいろ経て現在はよろず請負プログラマ。最近の開発はPHP，JavaScript，Java，MTプラグインなど。お仕事随時募集中。

Twitter：@yonezawaizumi

鉄道旅行ブログ：http://feelfine.blog.izumichan.com/