インプレス ビジネスメディア

第4回：Webアプリケーションを構築しよう！ (2/4)

TOP＞サーバ構築・運用＞ 作ってみよう！
XMLDB入門
eXistではじめよう！使って覚えるXMLデータベース入門

第４回：Webアプリケーションを構築しよう！
著者：ウルシステムズ  大塚 庸史、柏原 宏充   2007/8/6
前のページ  1  2   3  4  次のページ
作ってみよう！

   サンプルアプリケーションのアーキテクチャ概要は図1の通りです。大きな特徴として、これまでアプリケーションレイヤで行っていたほとんどの処理を、XQueryで記述していることがあげられます。
サンプルアプリケーションの概要
図1：サンプルアプリケーションの概要

   XQueryの中で出力用のHTMLドキュメントを作成することもできますが、今回はXQueryからの出力はシンプルなXMLのみとして、XMLの表示はすべてWebブラウザ側でAjaxを使って行うこととします。

   このため、今回実際にコーディングする部分は、XQueryとAjaxの画面の一部となります。

   次の表3は、作成するサンプルアプリケーションの構成と各ファイルの役割です。

ファイル/ディレクトリ名 説明
/usr/local/eXist/webapp/xquery/thinkit_exist アプリケーションのルートディレクトリです。
  index.html 表示画面のHTMLです。XQueryの呼び出し、結果XMLの画面表示を行います。
show_list.xql 製品一覧用XQueryです。
parts_tree.xql 製品構成部品用XQueryです。
scripts/xml2tree.js XMLからツリーを作成するためのJavaScriptです。
ext_js⁄* Ext JSが提供するJavaScript、CSS、イメージファイルなどです。

表3：サンプルアプリケーションの構成

   サンプルアプリケーションの構成ファイルは以下のURLからダウンロードできるので、各自アーカイバで解凍し、eXistがインストールされているディレクトリの/webapp/xquery配下に展開してください。標準では「/usr/local/eXist/webapp/xquery/」となります。またWindowsの場合は「c:\Program Files\eXist\webapp\xquery」になります。

サンプルアプリケーション
 ZIPファイル thinkit_exist.zip  （ZIPファイル/392KB）

   今回のサンプルでは「Ext JS」というAjaxライブラリを利用します。Ext JSはJack Slocumが中心となって開発が進められているものです。高い機能と美しい画面が特徴的です。今回は安定版の1.0.1aを利用しています。

 Ext JSのオフィシャルサイト
 http://extjs.com/

show_list.xqlの作成

   まず、製品一覧XMLをXMLDBから取得するためのXQueryを作成します。ここでは「第3回：eXistでXQueryを実行しよう！」で作成したXQueryを修正して使います。

   主な変更点はWhere条件を削除して全製品を表示するようにしたことと、HTTPレスポンス用のライブラリを利用していることの2点です。

xquery version "1.0";

declare namespace response="http://exist-db.org/xquery/response"; ← 1
response:set-header("Content-Type", "text/xml"), ← 2
<results>{
for $product in document("/db/inventory/products.xml")/products/product
return
<product>
    <id>{xs:string($product/@id)}</id>
    {$product/name, $product/price}
    </product>
}
</results>

   1では、eXistのXQuery拡張ライブラリを使っています。これはHTTPレスポンスを利用することができるライブラリで、namespaceを宣言して名前の衝突を避けることができます。

   2では、response:set-header関数を使用しています。この関数は、名前の通りHTTPレスポンスのヘッダを設定することができます。ここでは、Content-Typeに「text/xml」を設定します。

   Ajaxライブラリ側でContent-Typeでデータ形式を判断しているため、この設定が必要となります。
parts_tree.xqlの作成

   parts_tree.xqlは製品を構成している部品の階層構造を表示するためのXQueryです。製品一覧から製品IDを取得し、製品を構成する部品データをXMLDBから取得します。
製品構成部品XMLの検討

   それでは製品構成部品を表示する場合のXML構造について考えてみましょう。部品IDと部品名を持たせたツリー構造の表示を前提とすると、以下のようなXMLになります。

<product id="0001" name="製品１">
   <partss id="PA0001" name="部品１">
       <parts id="PAS002" name="部品２"/>
   </parts>
   <parts id="PA0003" name="部品３">
       <parts id="PAS001" name="部品パーツ１"/>
          <parts id="PAS002" name="部品パーツ２" />
          <parts id="PAS003" name="部品パーツ３" />
          <parts id="PAS004" name="部品パーツ４" />
          </parts>
       </parts>
       <parts id="PAS005" name="部品パーツ５"/>
   </parts>
</product>

   これに対してXMLDBに保存されている部品XMLは、以下のようなデータ構造になっています。

<parts_list>
<parts id="PA-001">
        <name>電動モーター</name>
        <consist_of>
            <parts id="PAS-A001"/>
            <parts id="PAS-A002"/>
            <parts id="PAS-A003"/>
            <parts id="PAS-A004"/>
        </consist_of>
    </parts>
    <parts id="PAS-A001">
        <name>軸受け</name>
        <consist_of>
            <parts id="PAS-A011"/>
            <parts id="PAS-A012"/>
         </consist_of>
</parts>
</parts_list>

   parts_list要素では、自分を構成しているpartsの情報をconsist_of要素の下に、部品IDとして持っています。部品を構成しているものについての情報を取得するためには、部品IDをキーとして階層構造を再帰的にたどっていく必要があります。
前のページ  1  2   3  4  次のページ

ウルシステムズ株式会社 大塚 庸史
 著者プロフィール
ウルシステムズ株式会社  大塚 庸史
ウルシステムズ株式会社シニアコンサルタント。2003年より現職。以前よりスクリプト言語には大きな興味を寄せていたが、最近、JavaScript、Flexの柔らかさに開眼しつつある。XQueryは今年「来る」と確信しつつ日々奔走中。
ウルシステムズ株式会社 柏原 宏充
 著者プロフィール
ウルシステムズ株式会社  柏原 宏充
ウルシステムズ株式会社シニアコンサルタント。Web系開発の世界でRDBMSと触れあっていたところ、様々なことがあってXMLDBの世界へ。技術を文字にして伝え、文字を実装にして証明することを武器に、今日もお客様の課題解決に取り組んでいる。
INDEX
第4回：Webアプリケーションを構築しよう！
  eXistを使ってのWebアプリケーション構築
作ってみよう！
  関数の作成と再帰呼び出し
  製品一覧：グリッド表示
eXistではじめよう！使って覚えるXMLデータベース入門
第1回 今、XMLデータベースを始める理由
第2回 eXistをインストールしよう！
第3回 eXistでXQueryを実行しよう！
第4回 Webアプリケーションを構築しよう！

人気記事トップ10

外部から「WSL1/2」のサーバーにネットワークアクセスをしてみよう AI搭載のスマートグラス「Even G2」が国内発売ほか 日本初開催の「KubeCon＋CloudNativeCon Japan 2025」、ボランティア視点で運営の裏側をちょっとのぞいてみた話 新たな自動化で熱視線！ AIエージェントの「推論能力」を支える2つのコンポーネントとは？ オープンソースの電子書籍管理ソフト「Calibre 8.15」リリース メガネ型オーディオが特別セール実施中、Metaが新モデル群を公開ほか 「Rocky Linux 10.1」リリース IoTに生成AIを掛け合わせる「AI-driven IoT」で現場のIoTデータ活用を加速 米Red Hat、「Red Hat Enterprise Linux 9.7」を発表 AI時代のエンジニアに求められるものとは？「生き残る」ためのキャリア戦略
AI搭載のスマートグラス「Even G2」が国内発売ほか 外部から「WSL1/2」のサーバーにネットワークアクセスをしてみよう 新たな自動化で熱視線！ AIエージェントの「推論能力」を支える2つのコンポーネントとは？ Linux Foundation Education、無料オンラインコース「Linuxカーネル開発 初心者向けガイド」の提供を開始 【ビジョンなき導入の末路】データが暴く日本企業の課題と次の一手 【序論】なぜ今、監視は「再発見」されるのか 「AIを導く」のはオープンソース ー実証に基づいた明確な解を示したレポート「ソブリンAIの現状」を公開 Linuxカーネル「Linux 6.18」リリース メガネ型オーディオが特別セール実施中、Metaが新モデル群を公開ほか 日本初開催の「KubeCon＋CloudNativeCon Japan 2025」、ボランティア視点で運営の裏側をちょっとのぞいてみた話
AI搭載のスマートグラス「Even G2」が国内発売ほか 外部から「WSL1/2」のサーバーにネットワークアクセスをしてみよう 新たな自動化で熱視線！ AIエージェントの「推論能力」を支える2つのコンポーネントとは？ Linux Foundation Education、無料オンラインコース「Linuxカーネル開発 初心者向けガイド」の提供を開始 【ビジョンなき導入の末路】データが暴く日本企業の課題と次の一手 アイレット、KDDIの属人化問題を生成AIアシスタントの精度を高め解消へ 世界中の「欲しい」を10秒で叶える ─株式会社SAZOが描く越境ECの新時代 「Terraform」でコードをモジュール化して、環境を分離することで適切に管理しよう IoTに生成AIを掛け合わせる「AI-driven IoT」で現場のIoTデータ活用を加速 【序論】なぜ今、監視は「再発見」されるのか
人気記事ランキングをもっと見る

新着記事

位置情報の基本中の基本となる「点」の情報の扱い方を学ぼう 12月5日 6:30 Kubernetesコミュニティのグループ構成と活動領域の見つけ方 12月5日 6:30 AIには別の顔を見せるWebサイト: エージェントを狙う間接プロンプトインジェクション 12月4日 6:30 【CNDW2025】なぜCloudNative DevSecOpsを推進するのか？ 米軍の事例が示す「速度と安全性」の必然 12月4日 6:00 【序論】なぜ今、監視は「再発見」されるのか 12月3日 6:30

企画広告も役立つ情報バッチリ！ Sponsored

新たな自動化で熱視線！ AIエージェントの「推論能力」を支える2つのコンポーネントとは？ 11月28日 6:30 IoTに生成AIを掛け合わせる「AI-driven IoT」で現場のIoTデータ活用を加速 11月26日 6:30 アイレット、KDDIの属人化問題を生成AIアシスタントの精度を高め解消へ 11月21日 6:30 「Grafana Cloud」の先進的ユーザーであるグリーが10年をかけて到達した「オブザーバービリティ」とは 5月15日 6:30 Grafana Labs CTOのTom Wilkie氏インタビュー。スクラップアンドビルドから産まれた「トラブルシューティングの民主化」とは 4月21日 6:30 API管理をより簡単にする「Kong Konnect」が解決する課題とその主要機能 3月5日 5:30 目指すはプロセス連結によるサイロ化の打破! ガバナンス強化にも寄与する自動化プラットフォームとは 1月15日 6:30 AIで激変する「DevOpsの未来」と「IT組織のリーダーが備えるべきこと」とは 2024年11月26日 8:53 仕様書からテストケースを自動生成! Autify Genesisが変えるソフトウェアテストの未来 2024年11月21日 8:04 LLMを自由に切り替え! Kongが提案するAIゲートウェイ活用法 2024年11月15日 6:12