4-5-応. web アプリケーションに関する知識

OSS モデルカリキュラムの学習ガイダンス

4-5-応. Web アプリケーションに関する知識

1. 科目の概要

スクリプト言語や Java 言語を利用して、Ruby on Rails やその他 Web フレームワークを

活用して、マークアップ言語およびスクリプト言語を用いたＷｅｂサービスを提供するア

プリケーションを開発する際に必要とされるスキルを学習する。応用編では Web アプリケ

ーション開発の具体的な手法を学ぶ。

2. 習得ポイント

本科目の学習により習得することが期待されるポイントは以下の通り。

習得ポイント説明シラバスの対応コマ

4-5-応-1. DNS/レジストラWebアプリケーションのサービスを特定する仕組みの1つであるDNS(Domain Name System)と、ドメインの管理方法、ドメインを登録する業者であるレジストラの存在やその登録方法について解説する。

1

4-5-応-2. Webアプリのセキュリティ(XSS/SQLインジェクション)

クロスサイトスクリプティング攻撃(XSS)やSQLインジェクション攻撃などWebアプリケーションを開発するうえで知っておくべき基本的なセキュリティ問題とその対策について解説する。

8

4-5-応-3. アプリのテストFirefoxの拡張機能として用意され、Webアプリケーションのデバッグツールとして効果の高いFirebugや、Webアプリケーション開発でテストの自動化を実現するSeleniumなどのツールを紹介する。

6

4-5-応-4. ログ解析/トラブルシューティングWebアプリケーションのサーバ側におけるデバッグ手法に役立つログ解析について触れ、ログ解析に利用できるOSSのツールを紹介する。また関連するトラブルシューティング技法を説明する。

8

4-5-応-5. WebサーバのチューニングWebアプリケーションの性能を向上させる施策の1つとして、Webサーバの設定調整や、拡張モジュールの利用など、Webサーバのチューニング技法について解説する。

7

4-5-応-6. AJAX, JSON, Yui / Jquery

Web2.0アプリケーションの代表的な表現手法であるAJAX (AsynchronousJavaScript And XML)、JavaScriptでデータをやり取りするシンプルな表現のJSON (JavaScript Object Notation)を紹介し、さらに、Yui /JQueryといったライブラリの利用方法を取り上げる。

9

4-5-応-7. RIA, HTML5次世代のWebアプリケーションにおいて、とくにクライアントサイドでの活用が期待されるRIA (Rich Internet Application)や、表現力を高めたHTMLのバージョン5など、次世代クライアントの動向を示す。

9

4-5-応-8. Webサービス(マッシュアップ)存在するWebアプリケーションの一部を利用して新しいアプリケーションを簡単に構築できるような枠組みとしてAPIを公開しているWebサービスの考え方と、それらを効果的に活用したマッシュアップについて説明する。

9

4-5-応-9. REST, SOAP

HTTPを用いてアクセスした結果XMLによりデータを取得するREST(Representational State Transfer)の仕組みと、同様にWebサービスで利用されるプロトコルであるSOAP (Simple Object Access Protocol)について解説する。

9

【学習ガイダンスの使い方】

1. 「習得ポイント」により、当該科目で習得することが期待される概念･知識の全体像を把握する。2. 「シラバス」、「IT 知識体系との対応関係」、「OSS モデルカリキュラム固有知識」をもとに、必要に応じて、

従来の IT 教育プログラム等との相違を把握した上で、具体的な講義計画を考案する。3. 習得ポイント毎の「学習の要点」と「解説」を参考にして、講義で使用する教材等を準備する。


3. IT 知識体系との対応関係

「4-5-応. Web アプリケーションに関する知識」と IT 知識体系との対応関係は以下の通り。科目名 1 2 3 4 5 6 7 8 9 10 11 12

4-5-応. Webアプリケーション開発に関する知識

Webアプリケーションの登録 MVCモデル Javaサーブレット基

礎JSPページによる開発

Ruby on Railsによる開発

テスト駆動型Rails開発

Railsによる高度な開発セキュリティと対策 Web2.0の世界 Webアプリケーション開発演習

科目名 1 2 3 4 5 6 7 8 9 10 11 12 13

1

IT-IAS1.基礎的な問題

IT-IAS2.情報セキュリティの仕組み(対策)

IT-IAS3.運用上の問題

IT-IAS4.ポリシー

IT-IAS5.攻撃 IT-IAS6.情報セキュリティ分野

IT-IAS7.フォレンジック(情報証拠)

IT-IAS8.情報の状態

IT-IAS9.情報セキュリティサービス

IT-IAS10.脅威分析モデル

IT-IAS11.脆弱性

2

IT-SP1.プロフェッショナルとしてのコミュニケーション

IT-SP2.コンピュータの歴史

IT-SP3.コンピュータを取り巻く社会環境

IT-SP4.チームワーク

IT-SP5.知的財産権

IT-SP6.コンピュータの法的問題

IT-SP7.組織の中のIT

IT-SP8.プロフェッショナルとしての倫理的な問題と責任

IT-SP9.プライバシーと個人の自由

3

IT-IM1.情報管理の概念と基礎

IT-IM2.データベース問合わせ言語

IT-IM3.データアーキテクチャ

IT-IM4.データモデリングとデータベース設計

IT-IM5.データと情報の管理

IT-IM6.データベースの応用分野

4

IT-WS1.Web技術 IT-WS2.情報アーキテクチャ

IT-WS3.デジタルメディア

IT-WS4.Web開発 IT-WS5.脆弱性 IT-WS6.ソーシャルソフトウェア

5

IT-PF1.基本データ構造

IT-PF2.プログラミングの基本的構成要素

IT-PF3.オブジェクト指向プログラミング

IT-PF4.アルゴリズムと問題解決

IT-PF5.イベント駆動プログラミング

IT-PF6.再帰

6

IT-IPT1.システム間通信

IT-IPT2.データ割り当てと交換

IT-IPT3.統合的コーディング

IT-IPT4.スクリプティング手法

IT-IPT5.ソフトウェアセキュリティの実現

IT-IPT6.種々の問題

IT-IPT7.プログラミング言語の概要

7

CE-SWE0.歴史と概要

CE-SWE1.ソフトウェアプロセス

CE-SWE2.ソフトウェアの要求と仕様

CE-SWE3.ソフトウェアの設計

CE-SWE4.ソフトウェアのテストと検証

CE-SWE5.ソフトウェアの保守

CE-SWE6.ソフトウェア開発・保守ツールと環境

CE-SWE7.ソフトウェアプロジェクト管理

CE-SWE8.言語翻訳

CE-SWE9.ソフトウェアのフォールトトレランス

CE-SWE10.ソフトウェアの構成管理

CE-SWE11.ソフトェアの標準化

8

IT-SIA1.要求仕様

IT-SIA2.調達/手配

IT-SIA3.インテグレーション

IT-SIA4.プロジェクト管理

IT-SIA5.テストと品質保証

IT-SIA6.組織の特性

IT-SIA7.アーキテクチャ

9

IT-NET1.ネットワークの基礎

IT-NET2.ルーティングとスイッチング

IT-NET3.物理層 IT-NET4.セキュリティ

IT-NET5.アプリケーション分野

IT-NET6.ネットワーク管理

CE-NWK0.歴史と概要

CE-NWK1. 通信ネットワークのアーキテクチャ

CE-NWK2.通信ネットワークのプロトコル

CE-NWK3.LANとWAN

CE-NWK4.クライアントサーバコンピューティング

CE-NWK5.データのセキュリティと整合性

CE-NWK6.ワイヤレスコンピューティングとモバイルコンピューティング

CE-NWK7.データ通信

CE-NWK8.組込み機器向けネットワーク

CE-NWK9.通信技術とネットワーク概要

CE-NWK10.性能評価

CE-NWK11.ネットワーク管理

CE-NWK12.圧縮と伸張

CE-NWK13.クラスタシステム

CE-NWK14.インターネットアプリケーション

CE-NWK15.次世代インターネット

CE-NWK16.放送

11

IT-PT1.オペレーティングシステム

IT-PT2.アーキテクチャと機構

IT-PT3.コンピュータインフラストラクチャ

IT-PT4.デプロイメントソフトウェア

IT-PT5.ファームウェア

IT-PT6.ハードウェア

12

CE-OPS0.歴史と概要

CE-OPS1.並行性 CE-OPS2.スケジューリングとディスパッチ

CE-OPS3.メモリ管理

CE-OPS4.セキュリティと保護

CE-OPS5.ファイル管理

CE-OPS6.リアルタイムOS

CE-OPS7.OSの概要

CE-OPS8.設計の原則

CE-OPS9.デバイス管理

CE-OPS10.システム性能評価

13

CE-CAO0.歴史と概要

CE-CAO1.コンピュータアーキテクチャの基礎

CE-CAO2.メモリシステムの構成とアーキテクチャ

CE-CAO3.インタフェースと通信

CE-CAO4.デバイスサブシステム

CE-CAO5.CPUアーキテクチャ

CE-CAO6.性能・コスト評価

CE-CAO7.分散・並列処理

CE-CAO8.コンピュータによる計算

CE-CAO9.性能向上

14

IT-ITF1.ITの一般的なテーマ

IT-ITF2.組織の問題

IT-ITF3.ITの歴史

IT-ITF4.IT分野(学科)とそれに関連のある分野(学科)

IT-ITF5.応用領域

IT-ITF6.IT分野における数学と統計学の活用

CE-ESY0.歴史と概要

CE-ESY1.低電力コンピューティング

CE-ESY2.高信頼性システムの設計

CE-ESY3.組込み用アーキテクチャ

CE-ESY4.開発環境

CE-ESY5.ライフサイクル

CE-ESY6.要件分析

CE-ESY7.仕様定義

CE-ESY8.構造設計

CE-ESY9.テスト CE-ESY10.プロジェクト管理

CE-ESY11.並行設計(ハードウェア、ソフトウェア

CE-ESY12.実装

CE-ESY13.リアルタイムシステム設計

CE-ESY14.組込みマイクロコントローラ

CE-ESY15.組込みプログラム

CE-ESY16.設計手法

CE-ESY17.ツールによるサポート

CE-ESY18.ネットワーク型組込みシステム

CE-ESY19.インタフェースシステムと混合信号システム

CE-ESY20.センサ技術

CE-ESY21.デバイスドライバ

CE-ESY22.メンテナンス

CE-ESY23.専門システム

CE-ESY24.信頼性とフォールトトレランス

複数領域にまたがるもの

IT-PT プラットフォーム技術

CE-OPS オペレーティングシステム

CE-CAO コンピュータのアーキテクチャと構成

IT-ITF IT基礎

コンピュー

タハー

ド

ウェ

アと

アー

キテク

チャ

IT-IPT 技術を統合するためのプログラミング

15

10CE-NWK テレコミュニケーション

IT-PF プログラミング基礎

CE-SWE ソフトウェア工学

IT-SIA システムインテグレーションとアーキテクチャ

IT-NET ネットワーク

CE-ESY 組込みシステム

IT-IAS 情報保証と情報セキュリティ

IT-SP 社会的な観点とプロフェッショナルとしての課題

応用技術

IT-IM 情報管理

IT-WS Webシステムとその技術

分野

組織関連事項と情

報システム

ソフトウェ

アの方法と技術

システム基盤

<IT 知識体系上の関連部分>


4. OSS モデルカリキュラム固有の知識

OSS モデルカリキュラム固有の知識として、OSS を活用した Web アプリケーション開

発の演習がある。開発フレームワークとして Ruby on Rails を取り上げる。科目名第1回第2回第3回第4回第5回第6回第7回第8回第9回第10～12回

（1）サービスの特定方法

（1） MVCモデル

（1） Javaサーブレットとは

（1） JSPの概要

（1） Ruby onRailsの特長

（1） TDD (TestDrivenDevelopment)

（1） Ruby onRailsプラグインの基礎

（1） Webアプリケーションに対する攻撃

（1） Web2.0 演習

（2）ドメインの管理方法

（2）モデル（2）サーブレットの環境設定

（2） JSPとサーブレット

（2） Railsによる開発

（2）テスト駆動開発の手順

（2） Ruby onRailsプラグイン開発

（2）ログの解析

（2）言語によるラベリング

（3）ビュー（3）サーブレットの様々な機能

（3） JSPの設定方法

（3） Railsの持つフレームワーク

（3） Ruby onRailsにおけるテスト駆動開

（3） Ruby onRailsによるAjaxアプリケー

（3）ログ解析の方法

（3） Webサービスの活用

（4）コントローラ

（4）アプリケーションのテスト方法

（4）その他のトレンド

4-5-応 Webアプリケーション開発に関する知識

（網掛け部分は IT 知識体系で学習できる知識を示し、それ以外は OSS モデルカリキュラム固有の知識を示している）

4 - 5 -応-1

スキル区分 OSS モデルカリキュラムの科目レベル

セキュリティ分野 4-5 Web アプリケーションに関する知識応用

習得ポイント 4-5-応-1. DNS/レジストラ

対応する

コースウェア

第 1 回 Web アプリケーションの登録

4-5-応-1. DNS/レジストラ

Web アプリケーションのサービスを特定する仕組みの 1 つである DNS (Domain Name System)と、ド

メインの管理方法、ドメインを登録する業者であるレジストラの存在やその登録方法について解説す

る。

【学習の要点】

* DNS (Domain Name System)は、インターネットに接続されているサーバの IP アドレスとホスト名

を対応づけるために使用され、ICANN (The Internet Corporation for Assigned Names and

Numbers)という非営利団体によって、全世界的に管理されている。ドメインを取得するには、

ICANN から認定を受けたレジストラというドメイン名の登録業者を利用する。

* ドメインによってインターネット上で任意の Web サーバにアクセスすることができるが、ドメインと

サーバの対応は必ずしも一対一である必要はない。

* 一台のWebサーバで、複数ドメインのサービスを提供するためにVirtualHost という機能が利用

される。

* 耐障害性のため、Web サーバを二重化し、障害発生時に動的にドメイン名の引継ぎを行う運用

方法がある。

図 4-5-応-1. DNS 名前解決の流れ

クライアントイントラDNSサーバ

ルートDNSサーバ

「co.jp」ドメインDNSサーバ

「jp」ドメインDNSサーバ

「xxx.yyy.co.jp」ドメインDNSサーバ

「www.example.co.jp」を問い合わせ？

1. 「jp」を通知

2. 「co.jp」を通知

3. 「.example.co.jp」を通知

4. 「www.example.co.jp」ドメインを通知

IPアドレスを取得

4 - 5 -応-2

【解説】

1) DNS（Domain Name System）とは

DNSとは、インターネット上に接続されているサーバのIPアドレスとホスト名を対応させるシステムで

ある。インターネット上に接続されているサーバはすべてユニークな IP アドレスをもっており、ユー

ザがサーバにアクセスする場合はサーバの IPアドレスを知る必要がある。ただ IPアドレスは数値の

羅列でしかなく人間には覚えることが困難であるため、サーバはホスト名を公開している場合が多

い。DNSを使うと、ユーザはホスト名から IP アドレスを取得、または IP アドレスからホスト名の取得を

することができ、無作為な数値である IP アドレスを覚える必要がなくなる。

2) DNS の仕組み

インターネット上の IP アドレスとホスト名の組み合わせは膨大にあり、これらの情報を一ヶ所で集中

管理することはおそらく非現実的である。このため、DNSはDNSサーバ同士が協調して動作する分

散データシステムとして構成されており、ドメインごとに提供されるDNSサーバが相互に情報を交換

し合うことで名前解決を行っている。

3) レジストラ

レジストラとは、ドメイン名の登録申請を受ける業者である。ドメイン名は ICANN という団体に管理さ

れており、レジストラは申請されたドメイン名を地域インターネットドメインレジストリに登録を行う。

* ICANN

ICANN（The Internet Corporation for Assigned Names and Numbers）は、インターネット上のドメ

イン名および IP アドレスを管理する非営利団体である。

4) VirtualHost

VirtualHost とは Apache の特徴的な機能で、１つまたは複数の IP アドレスと一台のサーバで複数

のドメインサービスを提供する事ができる。Virtual Host には IP ベースの方式と NAME ベースの方

式があり、どちらにもメリットとデメリットがあるので状況に合わせ使い分ける必要がある。いずれに

せよ物理的な理由、消費電力の制約などの理由でサーバを複数台設置できない場合などに有効

な機能である。

5) DNS ラウンドロビン

Web システムでは、Web サーバを多重化して運用することが多々ある。この際に一つのドメイン名

に複数の IP アドレスを割り当てる DNS ラウンドロビンという負荷分散技術を使用する場合がある。

DNS ラウンドロビンでは登録されている IP アドレスを順次返すため、１つのサーバに負荷を集中す

ることを防ぐことができる。ただ、DNS ラウンドロビンは均等な負荷分散ができない、負荷分散先の

サーバの障害が検知できないなどの欠点もあり、近年では他の負荷分散方式が用いられる。

4 - 5 -応-3



習得ポイント 4-5-応-2. Web アプリのセキュリティ(XSS/SQL インジェクション)

対応する

コースウェア

第 8 回セキュリティと対策

4-5-応-2. Web アプリのセキュリティ(XSS/SQL インジェクション)

クロスサイトスクリプティング攻撃(XSS)や SQLインジェクション攻撃などWeb アプリケーションを開発

するうえで知っておくべき基本的なセキュリティ問題とその対策について解説する。


* Web アプリケーションの利用が進むにつれ、プログラムの脆弱性を悪用した個人情報の流出が

問題となっている。脆弱性を狙った攻撃の中でもクロスサイトスクリプティング、SQL インジェク

ションが大半を占める。

* XSS とは、掲示板サイトなどでユーザが入力した情報を表示するさいに、HTML タグや

JavaScript を埋め込まれることで、そのサイトを閲覧したユーザのブラウザでスクリプトが実行さ

れてしまう脆弱性のことである。

* SQL インジェクションとは、ユーザが入力した情報を適切に処理せず、SQL を組み立てて実行

してしまうことで、データベースを不正に操作できてしまう脆弱性のことである。

図 4-5-応-2. XSS の攻撃の流れ

Webアプリケーション

悪意があるユーザユーザ

入力フォーム

1.悪意があるスクリプトを入力

2.悪意があるスクリプトを保存

3.悪意があるスクリプトがユーザを攻撃

4 - 5 -応-4

【解説】

1) Web システムのセキュリティ

Webシステムへの攻撃はWebアプリケーションのセキュリティホールを狙ったものが多く、ファイアウ

ォールやウィルス対策では守ることも感知することもできない。Web システムのセキュリティホールを

狙った攻撃に対応するには、アプリケーション側で攻撃を防ぐように設計・実装を行わなければい

けないため、開発者はどのような攻撃があるかを理解する必要がある。

特にWeb システムへの攻撃の大半を占めるのはXSS と SQL インジェクションであり、この 2つの攻

撃に対する理解が、安全なWeb アプリケーションを開発する上で極めて重要である。

2) XSS（Cross Site Scripting）

XSS とは、動的に Web ページを生成する Web アプリケーションを対象とした攻撃であり、ユーザが

入力した内容をページに表示する掲示板のようなWeb アプリケーションが攻撃対象となる。

悪意があるスクリプトを入力内容に埋め込むことで、サーバを運用するサービス提供者やページを

参照するユーザを攻撃する。

* 被害

XSS の被害で一般に広く知られている事例として、Cookie の盗聴が挙げられる。Cookie にパス

ワードなどの機密情報を含む場合はもちろん、セッション管理のためのセッション ID が盗聴され

た場合も同様な被害が発生する可能性がある。

* 対策

XSS の対策としては、サニタイジングが有効である。

サニタイジングとは、Web の入力フォームから入力されたデータから HTML タグ、JavaScript、

SQL などの攻撃の可能性がある文字列を検出し、エスケープ処理などで無害化する操作を指

す。

3) SQL インジェクション

SQL インジェクションとは、データベースと連携した Web アプリケーションを対象とした攻撃であり、

ユーザの入力内容を使ってSQLを発行する処理が行われているWebアプリケーションが攻撃対象

となる。攻撃者は SQL の断片を入力に埋め込むことで、不正なデータ改ざん、機密情報の盗聴な

どの攻撃を行う。

* 被害

機密情報を扱うデータベースに対する攻撃である SQL インジェクションの被害は大きい。

カード情報、個人情報の流出など、運用側の管理責任を問われる事が多々あるので、確実に

対策したい攻撃である。

* 対策

SQL インジェクションの対策としては、入力内容に含まれる SQL 特殊文字のエスケープ処理を

適切に行う、OR マッパーの導入により SQL の記述をなくすなどがある。

4 - 5 -応-5



習得ポイント 4-5-応-3. アプリのテスト

対応する

コースウェア

第 6 回テスト駆動型 Rails 開発

4-5-応-3. アプリのテスト

Firefox の拡張機能として用意され、Web アプリケーションのデバッグツールとして効果の高い

Firebugや、Webアプリケーション開発でテストの自動化を実現するSeleniumなどのツールを紹介す

る。


* Web アプリケーションのモジュール単位でのテストに Unit テストが取り入れられている。

* Firebug を利用することで、ブラウザにロードされた HTML や CSS の編集、JavaScript のデバッ

グ、ダウンロード時間の測定などが可能。

* Selenium はブラウザベースの自動回帰テストツールで、Java で実装されておりマルチプラットフ

ォーム、マルチブラウザに対応している。

図 4-5-応-3. Firebug の機能

function test() {var a = 0;var b = 5;

：：

}Webコンテンツ

<html><head>

：<head><body>

：</body>

</html>

1. JavaScriptのデバッグ 2. HTMLのDOM解析

ブレークポイント

3. コンソール出力機能

エラー出力（console.error()）

情報出力(console.info())

警告出力(console.warn())

4.その他多くの機能を搭載し、開発を支援

Firebug

Firebugで解析

4 - 5 -応-6

【解説】

1) テストの重要性

ソフトウェアにおいて品質は非常に重要な要素であり、Webアプリケーションも例外ではない。ソフト

ウェアのテストは開発工程、品質の観点、テスト技法による分類などさまざまな観点から行うべきで

あるが、昨今の開発期間や予算が削減されている Web アプリケーション開発現場において、すべ

てのテスト工程を人海戦術にて対応するのは難しい。

テスト自動化ツールを用い、ある程度テスト工程を自動化するのが一般的である。

2) Unit テスト

通常 Web アプリケーションは複数のモジュールから構成されており、結合時にはプログラム以外に

も、ハードウェア、ネットワーク、データベースなど様々な要因で不具合が発生する可能性がある。

結合時の不具合の原因を特定しやすくするためにも、プログラムの不具合はできる限り結合前に対

応しておくのが理想である。

Unit テストはモジュールの機能を関数などのプログラムレベルで行うテストであり、結合テスト前に

各モジュールの信頼性を確保する事を目標としている。

* Unit テストツール

Java 言語に対する JUnit など、代表的なプログラム言語には Unit テストツールが存在し、テスト

コード作成や自動テスト実行などを支援する。

* テスト駆動開発

テスト駆動開発とは開発手法の一つである。この中では実装よりもテストコードの作成を先に行

う事を推奨している。

3) Firebug

Firebug は代表的なブラウザの Firefox のアドオンで、参照している Web ページの CSS、HTML、

XML、DOM、JavaScript などの修正、デバッグなどを行う事ができる。

通常困難なJavaScriptのデバッグも、他のプログラム言語の開発環境のようにブレークポイントの設

定やステップオーバー、コンソール出力などの機能を利用することができる。

その他、通信の統計情報の表示、AJAX通信のモニタリングなどのさまざまなWebアプリケーション

開発支援機能が搭載されており、昨今のWeb アプリケーション開発現場にて多く利用されている。

4) Selenium

Webアプリケーションの結合テストはWebブラウザを使って目視で行われ、非常にコストがかかる作

業である。また、プログラム改修時も影響範囲を考えると全体の回帰テストを行うのが理想であるが、

コスト的にテスト箇所を限定する事が多く、それが原因でデグレードが発生する事が多々ある。

Selenium はコストがかかるブラウザベースのテストを支援、自動化するツールである。

Selenium を利用すると、テストケースを作成しておくことで回帰テストを自動化する事ができる。また、

Selenium はマルチプラットフォーム、マルチブラウザに対応しており、Web アプリケーションの必須

条件であるクロスブラウザ対応に関するテストも自動化する事が可能である。

4 - 5 -応-7



習得ポイント 4-5-応-4. ログ解析/トラブルシューティング

対応する

コースウェア

第 8 回セキュリティと対策

4-5-応-4. ログ解析/トラブルシューティング

Web アプリケーションのサーバ側におけるデバッグ手法に役立つログ解析について触れ、ログ解析

に利用できる OSS のツールを紹介する。また関連するトラブルシューティング技法を説明する。


* Web アプリケーションの利用状況（平均アクセス数、ピーク時アクセス数）などを把握するためア

クセスログの解析が行われている。アクセスログ解析ツールとして、Webalizer や Analog、Google

Analytics などが使われる。

* また、アクセスログの解析は、ページ毎の閲覧数の比較や、ページ遷移の傾向などユーザの行

動を追跡し、サービスを向上させるためにも利用される。

* サーバで発生した問題を調べるために、ApacheやMySQLなどのエラーログを調査する。監視

ツールとしては、MRTG、Nagios、ZABBIX などがある。

* top コマンドで、vmstat コマンドなどで、CPU 負荷や、メモリ使用状況、ディスク I/O などを確認

する。

図 4-5-応-4. 統合監視ツールによるシステム監視

SNMP監視

ネットワーク監視

リソース監視

統合監視ツール

監視対象

サーバ

ネットワーク機器

管理者

設定

通知

4 - 5 -応-8

【解説】

1) アクセスログ解析

平均アクセス数、ピーク時アクセス数などの Web サイトの利用状況を把握する事は、Web サイトの

運用において重要である。これらの情報は、システムのボトルネックとなっている部分を特定するた

めの材料となる事はもちろん、ページ毎の閲覧数の比較やページ遷移の傾向などを解析すること

により、サービス向上を検討する際に参考になる。

ただ、Apache などの Web サーバが出力するログファイルを目視で解析するのは困難であるため、

アクセスログ解析時は情報を視覚化するツールを用いるのが一般的である。

* Webalizer、Analog

もっとも利用されているWebサーバであるApacheのログファイルを解析し、サイトの訪問者数や

ページ数などを視覚化するツールである。

* Google Analytics

Google Analytics は Google 社が提供する Web 解析ソリューションであり、さまざまな視点から

Web のトラフィックを解析するツールが提供されている。上記の２つとは異なり Web ページに特

殊なタグを埋め込む事でアクセスを集計する。

2) トラブルシューティング

年中無休のショッピングサイトや大企業の業務システムなどWebシステムは高い可用性が求められ

る。ただ、システムが大規模になるにつれてマシン構成が複雑化され、ネットワーク障害、マシンダ

ウン、などさまざまな要因でシステムに障害が発生する可能性が高まる傾向にある。

高可用性を実現するために、下記の運用ノウハウの理解が必要である。

* エラーログ

インストール設定を元にデータベースやWebサーバのログ出力場所を把握し、障害発生時にロ

グを速やかに調査できるようにする。

* コマンド

プロセスの CPU 占有率や使用メモリ量などを表示する top コマンド、ディスク I/O やメモリ空き

容量や CPU 動作状況などシステム情報を表示する vmstat コマンドを活用し、システム稼働状

況を把握する。

* システム監視ツール

システム監視ツールを導入し、ある程度運用を自動化する。システム管理ツールには、ネットワ

ーク負荷を監視しグラフ化する MRTG や、システム全体を統合監視するツールの Nagios、

ZABBIX などがある。

- Nagios

リソース監視、ネットワーク監視、SNMP 監視などに標準対応した統合監視ツール。

- ZABBIX

ログ履歴管理機能など新しい機能が盛り込まれた統合監視ツール。エンタープライズ利用

や商用サポートに対応しているのが特徴。

4 - 5 -応-9



習得ポイント 4-5-応-5. Web サーバのチューニング

対応する

コースウェア

第 7 回 Rails による高度な開発

4-5-応-5. Web サーバのチューニング

Web アプリケーションの性能を向上させる施策の 1 つとして、Web サーバの設定調整や、拡張モジ

ュールの利用など、Web サーバのチューニング技法について解説する。


* ベンチマークを測定し、接続数を増やしながら、サーバ負荷の変化をモニタし、同時接続数や

メモリ割り当てなどの設定値を調整する。

* ab コマンドによるベンチマークの測定

* mod_status によるモニタリング

* Apache とスクリプト言語を連携させる場合は、CGI として Perl や PHP といったプロセスを起動す

るのではなく、Apache の拡張モジュール（mod_perl, mod_php）として組み込むことで高速化する

ことが多い。

* Apache 設定項目（MPM の選択、起動プロセス数、待機プロセス数、メモリーリークを防ぐ

MaxRequestPerChild、KeepAlive やタイムアウトの調整など）

図 4-5-応-5. Web サーバのチューニングの流れ

②ベンチマーク測定

③測定結果の取得

④ボトルネックの特定

⑤性能チューニング

性能目標値の達成終了

再度ベンチマーク測定へ

はい

いいえ

モニタリング

①性能目標値の設定

4 - 5 -応-10

【解説】

1) 性能チューニング

CPU やメモリなどの限られたシステムリソースを最大限に有効活用するためには性能チューニング

は欠かせない作業である。

WebシステムではWebサーバ、アプリケーションサーバ、データベースサーバなど複数のサーバで

構築されており、さまざまな要素がボトルネックとなり得る可能性があるが、ここでは代表的な Web

サーバである Apache のチューニングに関して述べる。

2) Apache チューニング

Apache のチューニングを行う際には、性能目標値の設定、ベンチマーク測定、サーバ負荷のモニ

タリング、ボトルネックの特定、設定値の調整という一連の作業を行う。

* 性能目標値の設定

チューニングを行う際には、明確な性能目標を数値（スループットとレスポンスタイム）で示す。

* ベンチマーク測定

Apache でベンチマーク測定を行う場合は、Apache に標準で付属している ab コマンドを使用す

る。ab コマンドはリクエスト数や同時接続数を指定する事で、用途に合った負荷をかけることが

できる。

* モニタリング

Apache の動作状況をモニタリングする場合は、mod_status モジュールを使用する。mod_status

モジュールを利用する事で現時点のサーバ統計情報を成形された HTML ページで表示する

事ができる。

* 設定値の調整（httpd.conf）

ベンチマーク測定の結果を参考に、下記の設定項目を調整する。

- 起動プロセス数、待機プロセス数（StartServers/MinSpareServers/MaxSpareServers）

- デーモンプロセスの再起動リクエスト数（MaxRequestsPerChild）

- 接続待機数、接続待機時間（MaxKeepAliveRequests/KeepAliveTimeout）

- タイムアウト時間（Timeout）

* スクリプト言語使用時の注意点

スクリプト言語とApacheを連携する場合は、CGIとしてPerlやPHPといったプロセスを起動する

のではなく、Apache の拡張モジュール（mod_perl、mod_php）を利用する。

CGI ではアクセス毎に機械語への変換が行われプロセスが起動されるが、拡張モジュールを利

用した場合は機械語への変換結果がキャッシュされ、変換は初回のみになる。

そのため、CGI と比較すると拡張モジュールを利用した場合は大幅な高速化が期待できる。

* MPM（マルチプロセシングモジュール）選択

MPMとはサーバデーモンの実行部分を司るモジュールである。Webシステムの規模やOSにあ

わせて選択し、Apache コンパイル時に指定する。

4 - 5 -応-11



習得ポイント 4-5-応-6. AJAX, JSON, YUI / jQuery

対応する

コースウェア

第 9 回 Web2.0 の世界

4-5-応-6. AJAX, JSON, YUI / jQuery

Web2.0 アプリケーションの代表的な表現手法である AJAX (Asynchronous JavaScript And XML)、

JavaScriptでデータをやり取りするシンプルな表現の JSON (JavaScript Object Notation)を紹介し、さ

らに、YUI /jQuery といったライブラリの利用方法を取り上げる。


* AJAX (Asynchronous JavaScript And XML)とは、JavaScriptの機能を使って、非同期にサーバと

ブラウザ間で XML をやりとりする技術のこと。通常の Web アプリケーションと異なり、画面遷移

をさせずにデータを送受信できるため、デスクトップアプリケーションのようなインタフェースが実

現できる。

* JSON (JavaScript Object Notation)とは、JavaScript 言語でのオブジェクト表記法。 JavaScript

からの扱いが容易なことから、Ajax で送受信するデータ形式として XML の代わりに使用される

ようになった。

* AJAX を使った Web アプリケーションを実装する場合、YUI/jQuery などの JavaScript ライブラリ

が多く利用される。

図 4-5-応-6. Ajax による非同期通信アプリケーションの流れ

HTMLエンジン

Ajaxエンジン

1. HTTPリクエストを送信

2. 「HTML+Javascript」を含むAjaxコンテンツ取得

3. ユーザ操作によるデータ表示要求 4. 非同期でサーバにデータを要求

5. サーバがデータを送信6. 取得データを画面遷移なしで表示

WebサーバWebブラウザ

時間の流れ

4 - 5 -応-12

【解説】

1) AJAX（Asynchronous JavaScript And XML）

AJAX とは、Web ブラウザに実装されている JavaScriptHTTP 通信の機能を利用して非同期通信で

サーバと情報交換する技術の総称である。従来 Web アプリケーションは、画面遷移やリロードを行

わなければサーバと通信する事が出来ず動的な表示変更などが行えなかったが、AJAX の技術を

使うことにより検索入力時に候補を表示するなど動的な表現が可能となり、Web アプリケーションの

使い勝手を大幅に向上した。

なお、本来は XML を使った JavaScript 通信技術という意味である AJAX であるが、昨今では意味

が多義化し、データ交換に JSON 形式を利用するものや、非同期通信を行わない画面部品だけの

ライブラリなども AJAX ライブラリと呼ばれている。

他のプログラム言語の開発フレームワークにも機能が導入されるなど、今後の Web アプリケーショ

ン開発において重要な技術である。

2) JSON(JavaScript Object Notation)

JSON とは JavaScript で利用されるデータ構造の表記を使ったデータ記述言語である。

XML よりも軽量、可読性が高いなどの優秀な点が多いフォーマットであり、JavaScript だけでなくさ

まざまなプログラム言語間でデータ交換用のフォーマットとして利用されている。

* JSONP（JSON with padding）

JSONPはAJAXにおいてクロスドメイン通信を実現する技術である。AJAXでは通常セキュリティ

の制約により自身が配信されたドメインにしかアクセスできないが、JSONP の技術を組み合わせ

ることで、JavaScript から他サイトのWeb サービスの利用を可能とする。

3) 代表的な JavaScript ライブラリ

AJAX を利用したWeb アプリケーションを構築する場合は、クロスブラウザ対応などの恩恵を受ける

ために JavaScript のライブラリを利用するのが一般的である。

JavaScript ライブラリは数多く存在するが、ここでは代表的な JavaScript ライブラリをいくつか挙げ

る。

* jQuery

jQuery は最も普及しているライブラリの１つで、軽量な基盤ライブラリとして多くの開発者に利用

されている。「$」を使った記述でDOMツリーやデータ構造の操作を少ない記述で実行できる文

法が特徴で、クロスブラウザ対応の AJAX 機能やイベント処理に関する機能などさまざまな機能

が実装されている。

* YUI（Yahoo! UI Library）

YUIは米Yahoo!が提供するAJAXライブラリである。名前の通り、画面部品に特化したライブラリ

で、タブパネル、スライダー、カレンダー、ドラッグ＆ドロップなど高度なインタフェース部品を提

供しており、AJAX が話題となった当初から利用されている。

4 - 5 -応-13



習得ポイント 4-5-応-7. RIA, HTML5

対応する

コースウェア


4-5-応-7. RIA, HTML5

次世代の Web アプリケーションにおいて、とくにクライアントサイドでの活用が期待される RIA (Rich

Internet Application)や、表現力を高めたHTMLのバージョン 5など、次世代クライアントの動向を示

す。


* RIA (Rich Internet Application)とは、Flash, Silverlight, JavaFX などを利用した Web アプリケー

ションのこと。ブラウザにプラグインを組み込むことで、ブラウザ単体では実現できない、より表

現力の高いユーザインタフェースを提供できる。

* HTML5は、5回目のHTML仕様の大幅な改訂版である。RIAのもつマルチメディア要素をプロ

プライエタリなプラグインを必要とせずに実現する。

図 4-5-応-7. RIA の概念

Webアプリケーション

RIA

デスクトップアプリケーション

コミュニケーション技術

・デスクトップアプリケーションの操作性・高度な対話性・Webアプリケーションの柔軟性

RIA(Rich InternetApplication)

4 - 5 -応-14

【解説】

1) RIA(Rich Internet Application)

Web アプリケーションでインタフェース作成に利用する HTML は、もともと静的なコンテンツを表示

するために設計された言語である。そのため、Web アプリケーションは従来のデスクトップアプリケ

ーションと比較すると操作性や表現力が劣る傾向にある。

RIA は、このようなWeb アプリケーションの表現力の欠点を解決する技術である。

HTML関連技術を応用したDHTMLや AJAX も RIAの一種と考えられるが、ここではブラウザにプ

ラグインを組み込むことにより動画やベクターグラフィックスなどの高度な表現力を付与する RIA 技

術に触れる。

* Flash、Flex

Flash、Flex とは、Adobe Systems 社が提供する RIA 技術である。Flash は RIA というキーワード

が使われる前から多く普及している規格であり、Flash 実行環境はさまざまな Web ブラウザに対

応している。FlexはFlash開発環境では難しかったプログラミング技法によるFlashアプリケーシ

ョン開発を可能とする RIA 開発環境であり、作成したアプリケーションは Flash 実行環境で実行

する事ができる。

* Silverlight

Silverlight とは、Microsoft 社が提供する RIA 技術であり、Flash とよく比較される技術である。も

ともと Silverlight は Windows Vista 用のインタフェースとして開発されていた「WPF」の Web ブラ

ウザ向けのサブセットとして開発されていたという経由がある。Microsoft 製のブラウザ Internet

Explorer だけでなく、Firefox、Safari などのブラウザにも Silverlight 実行環境は対応している。

* JavaFX

JavaFX は Java 実行環境上で動作する RIA プラットフォームである。ただ、JavaFX は RIA に特

化した技術ではなく、デスクトップ環境やモバイル環境用にもプラットフォームを提供している。

2) HTML5

HTML5は 5回目のHTML仕様の大幅な改定版であり、今までRIA技術を利用しなければ実現不

可能であったマルチメディア要素などの高度な表現をプロプライエタリなプラグイン無しで実現する

ことを重要な目的の１つとしている。また、HTML の本来の目的である文書の構造化を図るため、

<section>、<article>、<figure>、<header>、<footer>などの構造化要素タグが多く追加される。さらに、

HTML5では機能追加だけでなく、本来CSSで記述するべき<font>や<center>などのタグ用を廃止

するなど現仕様部分の改善も多く行われている。

策定当初にHTML5 仕様に含まれ、今は別仕様として分離された「WebSocket」、「Web Storage」な

どの内容も含め、一般的にHTML5 と言われる事が多い。

現状、正式勧告を目指し W3C により策定が進められており、代表的なブラウザでは既に発表され

たドラフトを元に機能対応が順次進められている。

4 - 5 -応-15



習得ポイント 4-5-応-8. Web サービス(マッシュアップ)

対応する

コースウェア


4-5-応-8. Web サービス(マッシュアップ)

存在する Web アプリケーションの一部を利用して新しいアプリケーションを簡単に構築できるような

枠組みとしてAPIを公開しているWebサービスの考え方と、それらを効果的に活用したマッシュアッ

プについて説明する。


* Webサービスとは、インターネット技術を利用して、Webアプリケーション同士でデータをやりとり

する仕組みのこと。

* Web サービスでは、REST や SOAP といった技術が利用され、提供するサービスを機能ごとに

API として公開される。

* 検索サイト、ショッピングサイト、ブログサイトなど、それぞれのサイトが公開している API を組み

合わせて、新たに付加価値のあるコンテンツを提供することをマッシュアップと呼ぶ。

図 4-5-応-8. Web サービスを組み合わせたマッシュアップの例

Webサービス1

Webサービス2

Webサービス3

SOAP

JSON

REST

マッシュアップWebアプリケーション

4 - 5 -応-16

【解説】

1) Web サービス

Web サービスとは、インターネットで用いられる HTTP プロトコルをベースに XML や XHTML 等の

標準的なフォーマットのメッセージを交換しあい、LAN または WAN ネットワーク上に分散した主に

Web ベースのアプリケーション同士を相互に連携させるサービスのことである。つまり、Web サービ

スは分散情報システムの一つと考えることができる。

Web サービスの初期段階では HTTP プロトコルにバインドする形の SOAP の利用が先立って唱え

られていたが、Webサービスが隆盛を誇るきっかけになったのは、SOAPより仕様が簡単なXMLベ

ースの REST(Representational State Transfer)や JavaScript における表記法を利用した JSON

（JavaScript Object Notation）を大手インターネットサービスが採用し、API を公開したからである。

このことによりユーザは割と大がかりな SOAP の仕組みを利用しなくても比較的簡単に Web サービ

スを利用できるようになり、Web サービスが一般的に多く普及したと考えられる。

もちろん SOAP も企業間のデータ交換用のプロトコルなどに多く利用されており、今後も Web サー

ビスを支える重要な技術基盤である。

2) マッシュアップ

マッシュアップとは、複数のWebサービスを利用してアプリケーションやサービスを構築する技法の

ことである。複数のサービスを組み合わせ、あたかも１つの機能やサービスのように見せることをマ

ッシュアップと呼ぶ。例としては、地図の表示と郵便番号データを対応づける機能や、特定のテー

マに関する情報をブログ、ショッピング、画像などの複数のユーザーベースから収集し成形するア

プリケーションなどが考えられる。

今までWebアプリケーション開発はある程度のリソースや期間を設けて構築するため、費用対効果

の点から考えると基幹システムや大手企業のWebサイトやサービスなど業務全体から考えると狭い

範囲での適用が主であった。しかしマッシュアップの登場により低コスト開発によるシステム化の適

用範囲の拡大が唱えられるなど、2000 年代後半より話題となっている。

* 低コスト開発が可能

既存のサービスを流用する事で、比較的低コストで Web アプリケーションを構築する事が可能

である。また、このコスト減により今まで費用対効果的に難しかったロングテールな業務やビジ

ネスに対するシステム化が可能となりえる。

* 無料Web サービスが多く存在

Google、Yahoo!、YouTube、Flicker、Facebook、Twitter などの巨大なユーザーベースを持つ大

手インターネットサービス事業者が無料でWebサービスを公開している。このようなWebサービ

スを組み合わせることで、斬新なアプリケーションを構築する事ができる。

* 実装が容易

HTTP, HTML, REST, JSONといったWebの標準技術を利用しているので、実装が比較的容易

に行う事ができる。

4 - 5 -応-17



習得ポイント 4-5-応-9. REST, SOAP

対応する

コースウェア


4-5-応-9. REST, SOAP

HTTP を用いてアクセスした結果 XML によりデータを取得する REST (Representational State

Transfer)の仕組みと、同様に Web サービスで利用されるプロトコルである SOAP (Simple Object

Access Protocol)について解説する。


* SOAP(Simple Object Access Protocol)とは、HTTP や SMTP などのインターネット技術を利用し

た、リモートプロシージャコールのプロトコルのこと。 SOAP 通信でやりとりされる SOAP メッセー

ジにはXMLが使われている。

* SOAP は、CORBA のような分散オブジェクト技術を、HTTP や XML などのオープンなインター

ネット技術を利用して実現している。 Web サービスのインタフェースを WSDL（Web Service

Description Language）という XML形式のファイルで定義する。

* REST(Representational State Transfer)とは、Web サービスの API を実装する方法のひとつで、

HTTPプロトコルでXMLや JSONをやりとりすること。 SOAPのようにWSDLの厳密な定義を必

要としないので実装が容易なため広く使われるようになっている。 Google、Twitter、Amazon を

はじめ多くのサービスが API として利用できるようになっている。

図 4-5-応-9. HTTP にバインドした SOAP メッセージ

<SOAP-ENV:Envelope xmlns:SOAP-ENV=“……><SOAP-ENV:Header>

：</SOAP-ENV:Header><SOAP-ENV:Body>

<m:sayHello xmlns:m=“http://example.co.jp/Apache/Datastore/”><m:name>Taro Yamada</m:name>

</m:sayHello></SOAP-ENV:Body>

</ SOAP-ENV:Envelope>

POST /webservice HTTP1.1Host: example.co.jpContent-Type: text/xml;charaset=“utf-8”Content-Length: *******SOAPAction: http://example.co.jp/Apache/Datastore/sayHello

ヘッダ

SOAPエンベロープ

SOAPヘッダ

SOAPボディ

SOAPメッセージ

4 - 5 -応-18

【解説】

1) SOAP(Simple Object Access Protocol)

SOAP とは、システム間でオブジェクトを送受信する RPC(リモートプロシージャコール)のためのプロ

トコルであり、Web サービス提供の手段として多く利用されている。SOAP は CORBA のような分散

オブジェクト技術を HTTP や SMTP などの既存の通信プロトコル上にバインドして使用する事がで

き、企業間で使用する場合でもファイアウォールを意識しないで通信することができる。また、SOAP

は XML 文書ベースのプロトコルのため、システムが作成されているプログラム言語に依存しない。

なお、SOAP で Web サービスを提供する場合は、サービスのインタフェースを WSDL(Web Service

Description Language) という XML 形式で定義する。この定義からスタブを生成する機能がプログ

ラム言語ごとに提供されており、プログラマは生成されたスタブの関数を呼ぶ事で Web サービスを

利用する事ができる。

2) SOAP メッセージ

SOAP プロトコルにおいて、オブジェクト送受信は SOAP メッセージによって行われる。SOAP メッセ

ージはヘッダとSOAPエンベロープで構成され、SOAPエンベロープはSOAPヘッダ、SOAPボディ

から構成される。

* ヘッダ

ヘッダは SOAP 実装を行うプロトコルに依存したヘッダであり、プロトコルバインディングヘッダと

も呼ばれる。

* SOAP エンベロープ

SOAP エンベロープは SOAP メッセージ全体を包含するもので XML 文書として構成される。子

要素として SOAP ヘッダと SOAP ボディを持ち、SOAP ヘッダは SOAP ボディに含まれる情報を

受信者がどのように処理するかなどのメタ情報を格納する。なお、SOAP ヘッダの記述は任意で

あり、存在しなくても問題はない。SOAP ボディには受信者が実際に処理を行う情報を格納する。

RPCの実装として利用する場合は、メソッド名、パラメータ、戻り値、エラーメッセージなどの情報

を格納する。

3) REST(Representational State Transfer)

REST には２つの意味があり、ここでは一般的に良く使われるWeb サービス API を実装する方法の

意味であるRESTに関して説明する。RESTはHTTPプロトコルでXMLや JSONなどのデータをや

り取りするための仕組みであり、SOAP や RPC を使用しない簡易的な Web サービス API の提供方

法と考えられる。RESTでは SOAPのようにプロトコルに関する技術仕様が定義されているわけでは

なく、送受信するデータや使用方法に関してはWeb サービス提供者によって定義される。

このスクリプト言語などからも容易に利用できる簡単さと、Google、Twitter、Amazon などの大手イン

ターネットサービスがWebサービス API提供に RESTを採用しているという背景から、広く普及して

いる技術である。

* RESTful

本来 REST とは、Web のような分散システムのアーキテクチャスタイルの１つであり、REST 原則

に従ったシステムを RESTful と呼ぶ。

4-5-応. web アプリケーションに関する知識

Documents