HTML間通信


私たちがインターネットでWWWにアクセスするとき、ブラウザはHTMLに記述されたテキスト、デザイン、リンクを読みとって、それを表示します。 それによって表示されるのは、あらかじめHTMLに記述されたままの Web デザインであり、言わば、誰が、いつアクセスしても基本的には同一の表示になります。

こうした「静的な」Web 表示から一歩進んで、アクセスしたユーザやその要求に応じて1つの Web ページを動的に変えることも、JavaScript や VBScript などのスクリプト言語を挿入することによって可能となります。 特に JavaScript は Netscape と Microsoft Internet Explorer の2大ブラウザの両方によってサポートされており、幅広い利用が出来ます。

例えば JavaScript の Navigator オブジェクトによって、ユーザの使用プラットフォーム(OS)、使用ブラウザとそのバージョン、Plugin 情報などを取得できますし、Date オブジェクトによってローカルマシーン上の時間を取得できます。 それらの条件に応じてメッセージや動作の表示、それどころか1ページの内容を丸ごと書き換えることも可能です。

またボタン、テキストボックス、プルダウンメニュー、チェックボックスやラジオボタンなどのフォームは初期のHTMLでは、ただメッセージの送信用に使われるだけでしたが、スクリプトで制御することにより本来のアプリケーションに近い応用が出来るようになりました。 OSと Web ブラウザが統合の方向に向かうと言われている現在、これからはHTMLに於るスクリプトとフォームの使用は必須になって行くと思われます。

もちろん JavaScript にも限界はあります。まず第1に、ユーザのローカルディスクにアクセスしてこれを書き換えると言うことは、Cookie ファイルを除いて出来ません。例えば Date オブジェクトはクライアントのローカル時間を読み込むことは出来ても、それを書き換えることは出来ません。 それが出来ないのは技術上の問題と言うより、セキュリティ上の理由からでしょう。私たちがどこかのページにアクセスして、知らない間にシステムの時間がおかしく変えられてはたまりませんから。この点は、セキュリティの問題が解決されるまでは変わらないと思います。

第2に、スクリプト実行の効果は原則として1ページ内に限られるということです。 「js. ファイルにリンクする」で述べたように、JavaScript のルーチンや変数などのデータを定義したサーバ上のファイルにアクセスして複数のページ上でこれを読み込むことは出来ても、そのデータを書き換えることは出来ません。 これは、スクリプトが条件に応じた Web ページの「カスタマイズ」が可能だと述べた上の展望からすれば、1つの限界と言えます。

もちろんCGIなどサーバの機能を利用すれば、そうしたことは不可能ではありません。例えばどこかのページでアンケートフォームに記入して送信しようとしたとき、フォームに記入した内容を他のページに表示して確認を取る、ということがよくありますが、これは通常CGIを使っています。 しかしサーバの機能を使わずに、クライアントサイドだけでページ間のデータを交信させる方法も実はあります。Cookie と呼ばれるローカルファイルを仲介させる方法がそれです。Netscape と Internet Explorer で実行できます。

JavaScript は document.cookie プロパティにより Cookie ファイルを読み書きします。例えば

document.write(document.cookie)


と書けば、Cookie ファイルに記述されたデータを(もしあれば)ページ上に表示します。document.cookie = A と書けば、A という変数に定義した内容を Cookie ファイルに書き込みます。 Cookie の内容を一定期間保存するためには

document.cookie = A+";expires=Fri, 31-Dec-1999 23:59:59 GMT"



のように書けばグリニッジ標準時1999年12月31日金曜日23時59分59秒までこのデータを保存させることになります。

Cookie を使った実例としてよく見かけるのは、或るページにユーザがアクセスするたびにその回数を Cookie に読み込み、ページ上でその回数を表示するというやり方です。またユーザが選択したデータを Cookie に保存しておき、次にアクセスしたとき、それを読み込んでページをユーザ好みにページをカスタマイズするというのも多く見かけます。 また掲示板で自分のハンドル名やメールアドレス、削除キーなどを書き込んだ場合、次にアクセスしたときにも自動的に表示されるように Cookie ファイルに保存することも多く行われるようになりました。これらはいずれも、Cookie のデータを長期間保存することを条件としています。

しかし有効期限を特に指定せずにセッション毎に Cookie を使用する方法もあります。ここで述べるHTML間通信がその1例です。原理は簡単です。或るページで Cookie に文字なり変数なりを書き込み、違うページにジャンプしたとき、Cookie にアクセスしてそのデータを読み込みます。 これによって複数のページ間でデータの動的な共用が可能になります。ごく簡単な例を示しましょう。下のテキストボックス内に適当な言葉を入れてからボタンを押して下さい。

ここでは以下のようなコードを使っています。

//ボタンが押されると Jump() 関数が呼び出される
function Jump() {
//テキストボックスに書き込みがないと警告
if(document.test.log.value == "") alert("テキストボックスに書き込みがありません。");
else
{
//日本語など2バイト文字が使われる場合を考慮し、テキストをアスキーコードに変換
mot = escape(document.test.log.value);
//Cookie に書き込もうとする
document.cookie = mot;
//Cookie の受け取りを拒否したら警告
if(document.cookie == "" || document.cookie != mot) alert("Cookie の使用が無効になっています。Cookie の使用を有効にして下さい。");
//Cookie を受け入れたら別ページにジャンプ
else location.href = "Cooking.htm";
}
}

ユーザがもし Cookie を受け取らないブラウザ設定にしているか、Cookie を受け取る際の警告で受け取りをキャンセルしたら、Cookie の書き込みはゼロですから、「Cookie の使用が無効になっています。」という警告をします。 1度 Cookie に書き込みが行われると、もはや書き込みゼロではなくなりますが、2度目に違う文字を入れてボタンを押したとき、Cookie の受け取りを拒否したら、テキストボックスの文字と Cookie の中味は一致しませんから、ここでも「Cookie の使用が無効になっています。」という警告を行うことが出来ます。

ユーザが Cookie を受け取った場合のみ、別ページにジャンプすることが出来ます。そのページでは、Cookie のデータを unescape() メソッドでアスキーコードから文字表示に戻してページに表示しています。

この簡単なテストにはあまり意味がないようですが、頭の良い方ならこれによって多くのことが出来ることに気づくはずです。大別すれば、1つにはページのユーザ向けカスタマイズであり、もう1つはハイパーリンクの制御です。Cookie を媒介とすることにより、1サイト内の各ページを有機的に関係づけることが可能になります。 「パスワードでアクセス制限」で述べたのも、その1例です。

Cookie についてはさまざまな論議がありますが、正しく活用すれば、これほど便利なものはありません。中味をよく吟味もせずに Cookie をすべて不安視する人は、実は Cookie の意味をよくわかっていないのだと思います。「Cookie 受け取りの際に警告する」ブラウザ設定にしておけば、いつ、どのようなデータが Cookie に書き込まれるかをチェックすることが出来ますし、必要によってはページのソースを見ればよいのですから。不安な場合にはパスワードや電話番号などの個人データを Cookie ファイルに書き込まないようにした方がよいでしょう。

また Web ページの作成者が Cookie を利用する場合、あまり多くのデータを Cookie に書き込むようなことはしないで下さい。大規模なことをしたい場合には、CGIなどを使用した方がよいと思います。




次のトピックは「Dynamic HTMLの基礎(1)」です。

目次 | ← 前のトピック | ↑ページのトップ | 次のトピック →

ご意見・ご質問がありましたら「ザ・掲示板」またはメールにて梅ちゃん堂まで