World Wide Web の仕組み(3)

共通科目情報処理(講義)、体育専門学群対象、2002年02月01日

                                       電子・情報工学系
                                       新城 靖
                                       <yas@is.tsukuba.ac.jp>

このページは、次の URL にあります。
http://www.hlla.is.tsukuba.ac.jp/~yas/ipe/taiiku-kougi-2001/2002-02-01
あるいは、次のページから手繰っていくこともできます。
http://www.hlla.is.tsukuba.ac.jp/~yas/ipe/
http://www.hlla.is.tsukuba.ac.jp/~yas/index-j.html
http://www.ipe.tsukuba.ac.jp/~yshinjo/

■復習

■今日の重要な話

教科書198-219ページ。、

■HTTPとApache

WWW ページのデータは、 WWW サーバ ( httpd ) が保存している。 WWW クライアント(ブラウザ)は、WWW サーバから WWW ページのデータを取り寄せる。

この時使われる通信プロトコルをHTTP ( Hyper Text Transfer Protocol ) という。

WWW サーバには何種類もある。筑波大学教育用計算機システムで使っている WWWサーバのプログラムの名前は、Apache 。

■Apache の動作

起動時に設定ファイルを読み込み、要求を待つための TCP/IPのポートをいくつか(標準ではポート番号80番)を作成する。

図? Apache の動作

◆HTTP

WWW のクライアント(普通はWWWブラウザ)からの要求は、 HTTP によりサーバに伝えられる。普段は、これらのプロトコルを直接人間が手で打ち込む必要はないが、WWWサーバの設定を行なう過程では、確認のために telnet コマンドで接続して、直接手で打つ。

◆HTTPの要求

プロトコルは、実際には比較的簡単である。クライアントからサーバに送られる要求 ( メソッド(method) ) は、２種類だけ。

GET
POST

例:次のような URL のページをアクセスする。


	http://www.domain/dir1/file1.html

クライアントは、URL のうちのホスト部分を抜きだし、これと標準の 80ポート番号(80)を使って、TCP/IP のコネクションを張る。

クライアントは、HTTP で次のような要求を送る。


GET /dir1/file1.html HTTP/1.0

(

(Return, Enter)は、２つ必要。)

◆ファイルとの対応

WWWサーバは、普通は、このファイルは、あるディレクトリを起点にしたファイル名になっている。この起点となるディレクトリをドキュメント・ルート・ディレクトリ(document root directory) という。このディレクトリは、Apache では、標準で次のようになる。


/usr/local/apache/share/htdocs/

上の GET 要求に相当するファイルは、次のファイルになります。


/usr/local/apache/share/htdocs/dir1/file1.html

◆応答

Apache は、このファイルを開き、内容を読み込む。そして、この内容を、HTTP の応答(response)として、クライアントに返す。


----------------------------------------------------------------------
HTTP/1.1 200 OK
Date: Mon, 04 Jan 2002 12:53:07 GMT
Server: Apache/1.3.3
Last-Modified: Sun, 31 May 2002 05:35:29 GMT
Content-Length: 1234
Content-Type: text/html

<HTML>
<HEAD>
<TITLE>Univ of Tsukuba</TITLE>
</HEAD>
<BODY>

<H1>Welcome</H1>
....
</BODY>
</HTML>
----------------------------------------------------------------------

◆ステータス、メタデータ、データ

HTTP の応答の第一行は、テータス（成功か失敗かを表す）。 200 は、エラーがなく成功したという意味。

アクセスされた日付、データの日付、データの型と長さが現れる。 Content-Type: が text/htmlならば、 HTML で書かれたページの意味。インラインイメージなら、なら image/gif や image/jpeg になる。

このような情報は、情報そのものではなくて、情報に関する情報という意味でメタ情報（メタデータ）という。

空行の後に、実際のデータが続く。

◆HTTP要求のオプション

HTTP の要求にも、オプションが渡せる。

例：テキストしか受け付けられない。


GET /dir1/file1.html HTTP/1.0
Accept: text/*

例：指定した時刻に作成したキャッシュが無効な時にだけデータの転送を要求


GET /dir1/file1.html HTTP/1.0
If-Modified-Since: Mon, 07 Jan 2002 12:53:07 GMT

◆アクセスログ

クライアントからどのようなアクセスが行なわれたかは、アクセス・ログ(access log) ( 転送ログ(transfer log) ) に記録される。たとえば、次のような情報が記録される。

192.168.10.20 - - [05/Jan/2002:01:08:11 +0900] "GET /dir1/file.html HTTP/1.0" 200 1622

このように、ホストの IP アドレス、日付、要求行、ステータス、転送されたバイト数などが記録される。

エラーが起きた時や起動・終了の情報は、エラー・ログ(error log) に記録される。

エラー・ログの例:

[Tue Jan  5 00:47:26 2002] [notice] Apache/1.3.3 (Unix) configured -- resuming normal operations
[Tue Jan  5 01:27:52 2002] [notice] httpd: caught SIGTERM, shutting down
[Tue Jan  5 05:57:11 2002] [error] [client 127.0.0.1] File does not exist: /usr/local/apache/share/htdocs/printenv
[Tue Jan  5 05:57:55 2002] [error] [client 127.0.0.1] Options ExecCGI is off in this directory: /usr/local/apache/share/htdocs/printenv.cgi

トラブルが起きた時には、このログを見て原因を探る

■CGIとフォーム

WWW サーバは、普通は、ファイルに保存された HTML データやイメージ・データを読み込み、WWWブラウザに返する。 CGI (Common Gateway Interface) では、ファイルが読み込まれる代わりにプログラムが実行され、その実行結果がブラウザに返される。

Gateway とは、WWW で使われている HTTP というプロトコルへの入り口という意味。プログラムの実行結果は、普通は、HTML にすることが多いが、普通のテキストであることもイメージであることもある。

図? CGIの仕組み

「プロセス」とは、実行中のプログラム。

CGI の利用例

検索エンジンで検索すべきキーワードを受け取る。
アクセス・カウンタ

◆CGI

CGI になるファイル名のパタン


/cgi-bin/name
/dir/name.cgi

◆CGIとセキュリティ

CGI は、プログラムを実行するので、セキュリティに細心の注意を払ながら利用する必要がある。CGIで実行されるプログラムにバグ(誤り)があると、重要なデータが盗まれることがある。

筑波大学教育用計算機システムでは、主サーバ(www.ipe.tsukuba.ac.jp)では CGI は使えない。CGI を使うためには、申請して副サーバ (www2.ipe.tsukuba.ac.jp)を使う。

◆フォーム

ブラウザからサーバに情報を送ってほしい時には、フォーム(form) という機能を使う。を考えます。 HTML記述例：

<FORM ACTION="http://www.u-ust.ac.jp/cgi-bin/adduser" method="post">
    <P>
    姓: <INPUT type="text" name="lastname">
    名: <INPUT type="text" name="firstname"><BR>
    <INPUT type="radio" name="sex" value="Male"> 男 <BR>
    <INPUT type="radio" name="sex" value="Female"> 女 <BR>
    電子メール: <INPUT type="text" name="email"><BR>
    <INPUT type="submit" value="send"> <INPUT type="reset"> 
    </P>
</FORM>

表示例：

<FORM>と </FORM> で括られた部分が１つのフォームになる。

<INPUT>の部分が、ブラウザからサーバに送られるデータを表わす。

send ボタンが押されると、ブラウザは、 HTTPの POST メソッドを使って、サーバにデータを送る。

サーバは、それを受け取ると、指定されたプログラムを実行する。実行されたプログラムは、環境変数と標準入力（ともに、プログラムにデータを与える方法の種類）からデータを受け取ることができる。

環境変数

REQUEST_METHOD
	データを送るのに使われたメソッド。POST か GET。
	GET は、普通のページを得るものと同じ方法で、長いデータは送れない。
SCRIPT_NAME
	プログラムの名前。
QUERY_STRING
	URLの指定で「?」以下に指定された文字列

メソッドとして POST が使われた時、標準入力からは、 <FORM></FORM>で指定されたパラメタを受け取ることがでる。

このデータは、「&」で区切られた「フィールド名=値」の並びになっている。

例:

lastname=姓&firstname=名&sex=Male&email=who@u-ust.ac.jp

環境変数 CONTENT_LENGTH からは、データの長さが得られる。

メソッドとして、GET が使われた時には、環境変数 QUERY_STRING に「&」で区切られた「フィールド名=値」の並びが含まれている。

送られてくるパラメタの中に漢字など含まれていた場合、 URLで使えない文字と同様に「%hh(2桁の16進数)」という形になっている。

これを元にもどすには cgiparse というプログラムや perl の命令 hex() が使われる。

■SSI (Server Side Include)

SSI (Server Side Include) は、CGI よりも手軽にHTML の途中に、他のファイルの内容やプログラムの実行結果を埋め込むための仕組。

SSI が使えるシステムでは、 file.html の変わりに file.shtml とすると、 SSI の機能が働くようになります。

例１: ファイルの内容の読込み

<!--#include file="filename"-->

例２: プログラム/bin/calの実行結果の埋め込み

<PRE>
<!--#exec cmd="/bin/cal"-->
</PRE>

例３:ファイル file.shtml の更新時刻の表示

最終に変更されたのは、
<!--#config timefmt="%Y/%m/%d %H:%M:%S"-->
<!--#flastmod file="file.shtml"-->
です。

◆SSIとセキュリティ

SSI を使う時にも、CGI と同様に、セキュリティに気をつける。特に、 `#include'や `#exec' で、大事なファイルが盗まれないように、細心の注意を払ながら利用する必要がる。

筑波大学教育用計算機システムでは、SSI は使えないような設定になっている。

■Javaアプレット

Java アプレット(applet) とは、 Javaというプログラム言語で書かれたプログラムの一種。

画面に何かを表示する機能があり、WWWブラウザ上で動く。 Javaアプレットを使うと、アニメーションを作ったり、 CGI を使わずにユーザとの対話できる。

CGI では、プログラムは、WWWサーバが走っているコンピュータで動くが、 Javaアプレットは、プログラムはブラウザの上で動く。

◆Javaアプレットのタグ

Javaアプレットは、HTML からみると、インライン・イメージと似ている。 Javaアプレットのためのタグは、 <APPLET></APPLET>。

HTML記述：

<APPLET CODE="rctext.class" WIDTH="500" HEIGHT="50">
<PARAM NAME="message" VALUE="hello,world">
与えたメッセージが動き回るJavaアプレット。
</APPLET>

表示例：

与えたメッセージが動き回るJavaアプレット。

CODE属性で、Javaアプレットを保存しているファイルのURL(ただし、同一ホスト内)、 WIDTH属性で、幅、 HEIGHT属性で、高さを指定する。 <PARAM>タグを使えば、アプレットにオプションを渡すことがでる。

<APPLET>と </APPLET>の間には、 Java Applet に対応していないブラウザのためのテキストを書く。

ソース・プログラム

Java言語については、共通科目では別の講義がある。

■アクセス制御

WWWは、もともと大勢の人にメッセージを伝えるための仕組。あるページは、ある特定の人（同じ研究室・部署の人）だけにしか見えないように設定することもできる。

アクセス制御(access control) ユーザ(アクセスの主体) が、ファイルやWWWページなどの資源をアクセスする時、どんなアクセスの仕方なら正しいということを定義して、それがきちんと守られていることをということを保証すること。

WWW ページのアクセス制御は、次のような情報がよく使われる。

クライアントが動作しているホストの IP アドレス。
ユーザ名とパスワード。

アクセス制御は、基本的には、 WWWサーバの管理者の仕事。 WWWサーバ (httpd) の設定ファイル ( /usr/local/etc/httpd/conf/httpd.conf, /usr/local/etc/httpd/conf/access.conf ) に記述される。

個人のページについては、 .htaccess というファイルを作れば、個人で変更できるようになっている場合がある。

◆IPアドレスによるアクセス制御

.htaccess:
----------------------------------------------------------------------
order deny,allow
deny from all
allow from 130.158.0.0/16 192.50.17.0/24
----------------------------------------------------------------------

◆パスワードが設定されたページのアクセス

例：パスワード・ファイル /home1/yshinjo/etc/passwd-doc1 に登録されているユーザだけが、 .htaccess があるディレクトリ以下にあるファイルをアクセスできる。

.htaccess:
----------------------------------------------------------------------
AuthType Basic
AuthName restricted stuff
AuthUserFile /home1/yshinjo/etc/passwd-doc1
require valid-user
----------------------------------------------------------------------

このパスワード・ファイルは、サーバ上で htpasswd というプログラムで作。

----------------------------------------------------------------------
% /usr/local/apache/bin/htpasswd -c /home1/yshinjo/etc/passwd-doc1 user1 
Adding password for user1.
New password:user1のパスワードを打ち込む
Re-type new password:user1のパスワードを打ち込む
% /usr/local/apache/bin/htpasswd /home1/yshinjo/etc/passwd-doc1 user2 
Adding user user2
New password:user2のパスワードを打ち込む
Re-type new password:user2のパスワードを打ち込む
% 
----------------------------------------------------------------------

一番最初は、-c オプション付で実行する。passwd コマンドと同様に、打ち込んだパスワードは、画面には表示されず、また、確認のために２回打つ必要がある。

htpasswd コマンドの結果、次のようなファイルが作られる。

----------------------------------------------------------------------
user1:1fjr1tHIgoG7U
user2:qXaeA9Zge7Yqc
----------------------------------------------------------------------

ユーザ名と暗号化されたパスワードから構成される。

パスワードによるアクセス制御の例: 設定ファイル .htaccess

----------------------------------------------------------------------
AuthType Basic
AuthName restricted stuff
AuthUserFile /home1/yshinjo/etc/passwd-doc1
require valid-user
----------------------------------------------------------------------

このアクセス制御が有効なファイルを GET したとする。


GET /dir1/file1.html HTTP/1.1

次のようなエラーが返る。


HTTP/1.1 401 Authorization Required
WWW-Authenticate: Basic realm="restricted stuff"
Content-Type: text/html


401 Authorization Required

...

.htaccess の AuthType と AuthName の内容が、HTTP の応答の WWW-Authenticate: に現れる。

このページをアクセスするには、クライアント(WWWブラウザ)は、ウインドウを開いてユーザにユーザ名とパスワードを要求する。そして、次のような YHM_GET() 要求をもう一度送る。


GET /dir1/file1.html HTTP/1.1
Authorization: Basic QWxhZGRpbjpvcGVuIHNlc2FtZQ==

Authorization: には、ユーザが打ち込んだユーザ名とパスワードが Base64 (64進数)で符合化されて含まれている。これを受け取ったサーバは、 AuthUserFile で指定されたファイルを開いて、ユーザ名とパスワードパスワードを照合して、正しければアクセスを許する。

Base64 は、暗号ではないので、簡単に元にもどせる。このアクセス制御の方法では、パスワードがそのままネットワークを流れてしまう。盗聴に弱い。

■実習

◆WWW サーバ上のデータの観察

htttp://www.ipe.tsukuba.ac.jp/ のページは、サーバ (icho) 上の /usr/local/WWW/htdocs/ 以下にある。次のようにして観察する。

telnet (Tera Term) でサーバ (icho) に接続してログインする。ユーザ名とパスワードを打つ。以下の一連の作業が終わったら、最後に、ログインを解除する（ログアウト）する。そのためには、exit コマンドかlogout コマンドを使う。
```
% exit 
```
less コマンドを実行する。less コマンド終了は、q キーを押す。
```
% less /usr/local/WWW/htdocs/index.html 
```
WWW ブラウザ(Netscape など)を実行して、 http://www.ipe.tsukuba.ac.jp/を開く。
WWW ブラウザで、ページのソース(HTML) を表示させる。Netscape なら「表示」メニューから「ページのソース」を選ぶ。
2. と 4. を比較する。

◆WWW サーバに残されたアクセスログの観察

アクセスログは、サーバ上の /usr/local/apache/logs/access_log というファイルにためられる。次のようにして観察する。 htttp://www.ipe.tsukuba.ac.jp/ のページは、サーバ (icho) 上の /usr/local/WWW/htdocs/ 以下にある。次のようにして観察する。

telnet (Tera Term) でサーバ (icho) に接続してログインする。ユーザ名とパスワードを打つ。以下の一連の作業が終わったら、最後に、ログインを解除する（ログアウト）する。そのためには、exit コマンドかlogout コマンドを使う。
```
% exit 
```
次のように tail コマンドを実行する。tail コマンド終了は、^C キー (Controlキーを押しながら C キーを押す)。
```
% tail -f /usr/local/apache/logs/access_log 
```
WWW ブラウザ(Netscape など)を実行して、 http://www.ipe.tsukuba.ac.jp/を開く。
「再読込み」を行う。
データが流れていく時には、適当な所で ^C で tail コマンドを終了させる。
自分のコンピュータのホスト名が表示されるかを見る。telnet (Tera Term) のスクロール機能を使う(注意: telnet の中では、マウスはうまく働かない。基本的にはキーボードからの文字しかサーバに送られない。)。

どんなデータがサーバに残されるか。

◆HTTP による WWW ページのアクセス

telnet コマンドを使って、WWW サーバにアクセスしてページを取り寄せる。 telnet コマンドには、Windows 2000 の Tera Term ではなく、次のいずれかを使う。

サーバに Tera Term で接続して、そこで telnet と打つ。
「コマンドプロンプト」で telnet と打つ。

サーバの telnet を使う方法。

telnet (Tera Term) でサーバ (icho) に接続してログインする。ユーザ名とパスワードを打つ。以下の一連の作業が終わったら、最後に、ログインを解除する（ログアウト）する。そのためには、exit コマンドかlogout コマンドを使う。
```
% exit 
```
次のように telnet コマンドを実行する。tail コマンドの強制終了は、 ^] キー(Controlキーを押しながら ] キー)を押した後に、「quit リターン」と打つ。
```
% telnet www.ipe.tsukuba.ac.jp 80 
```
「Escape character is '^]'.」と表示されたら、次のように打つ。
```
GET /index.html HTTP/1.0
```
( (Return, Enter)は、２つ必要。)
画面に WWW ページのデータが現れるのを確認する。画面の最後に、画面に「Connection closed by foreign host.」と表示され、 telnet コマンドを打つ以前の状態に戻っている。

これができたら、2. で、接続する WWW サーバを変えたり、3. で GET するファイルの名前を変えてみる。icho の場合、ファイルの名前として、「/~s012345/index.html」とすると、個人のホーム・ページが表示できる。

Windows 2000 のコマンドプロンプトの中で telnet コマンドを使う方法。

「コマンドプロンプト」を実行する。
その中で、telnet と打つ。
「 Microsoft Telnet> 」と表示されたら、次のように打つ。
```
set local_echo
set codeset Japanese EUC
```
「Microsoft Telnet>」に対して、open に続き、サーバ名とポート番号 80 を打つ。
```
open www.ipe.tsukuba.ac.jp 80
```
画面が消えたら、次のように HTTP の命令を打つ。
```
GET /index.html HTTP/1.0
```
( (Return, Enter)は、２つ必要。)
画面に WWW ページのデータが現れるのを確認する。
画面に「ホストとの接続が切断されました。続行するには何かキーを押して下さい...」と表示されたら、何かキーを押す。すると open コマンドを打つ以前の状態に戻っている。
telnet コマンドを終了させ、コマンドプロンプトの状態に戻すには、「Microsoft Telnet>」に対して、quit リターンと打つ。

これができたら、4. で、接続する WWW サーバを変えたり、5. で GET するファイルの名前を変えてみる。icho の場合、ファイルの名前として、「/~s012345/index.html」とすると、個人のホーム・ページが表示できる。

◆課題 HTML による WWW ページの作成

提出方法を確定した。締切りを変更した。

↑[もどる] ←[1月18日] ・[2月1日] →[2月8日]

Last updated: 2002/04/19 01:43:22

Yasushi Shinjo / <yas@is.tsukuba.ac.jp>