web入門
すばらしきwebの世界

webプログラミングの動作

2016.07.31一般

webプログラムを学習する前に、webプログラムがどのように動作しているかを、全体で捉えましょう。

必要な登場人物は以下です。
大きくは、サーバとクライアントで分かれます。

■クライアント
ブラウザ

■サーバ
webサーバ
サーバサイドプログラム
クライアントプログラム


クライアント

クライアントではブラウザ(“IE”や”Google Chrome”)が登場人物となります。


ブラウザ

htmlを解釈して表示します。

ブラウザはhtmlを読み込んでいるにすぎません。

html

試しに、メモ帳(windowsだとnotepad)を開いて、以下を記載し、”test.html”としてデスクトップへ保存して下さい。

“test.html”をブラウザで開いて下さい。
(またはブラウザを開いて、”test.html”ファイルをブラウザ画面へドラッグアンドドロップして下さい。)

結果をリンクしておきます。結果

いかかですか?

端的に言うと、htmlはブラウザとメモ帳があれば勉強出来ます。


サーバ

サーバにはwebサーバ(サーバプログラムを起動する為のプログラム)、サーバプログラム、クライアントプログラムが登場します。


webサーバ

クライアントとHttp通信を行うためのプログラムかつ、サーバサイドプログラム(PHP、Javaなど)を実行するためのプログラムのことです。

サーバと言われますが、物理筐体(パソコン)ではなく、実態はサーバ上でサーバサイドプログラム(PHP、Javaなど)を実行するためのプログラムのことです。

webサーバとしては”apach”やmicrosoftの”IIS”などがあります。

サーバサイドプログラム(PHP、Javaなど)で、クライアントにhtmlを返却する命令を記載しますが、
クライアントにhttpでhtmlを返却するという動作は実際のところwebサーバが行います。
いわば、サーバサイドプログラムを実行する為の基盤プログラムです。

webサーバ

余談ですが、サーバサイドJavaではよくwebサーバに”Apache Tomcat”が使用されます。
これは、webサーバにJava用のサーバサイドプログラム実行エンジン(サーブレットコンテナ)が事前に導入されたものになります。
tomchat


サーバサイドプログラム

webサーバからの要求で動作します。
実際、エンジニアはサーバプログラムを開発します。


クライアントプログラム

サーバにクライアントプログラムと書くと矛盾を感じます。
しかし、実際にサーバへhtmlファイルやjavaScriptファイルを置きます。
これは、htmlをwebサーバからクライアントへhttp経由で返却している為です。
先程”test.html”を作成しました。ここに記載したhtmlをwebサーバが送信しているのです。
webサーバは”test.html”ファイルを送信しているのではなく、htmlの内容を送信していることに注意して下さい。
送信されたhtmlをブラウザが解釈して表示します。
クライアントプログラム

javaScriptはhtmlをクライアント上で書き換えると言われます。
では、クライアント側に置くことが自然な気がしますが、
webサーバhtmlと一緒にjavaScriptも返却します。

ブラウザで、とあるイベント(ボタン押下など)をきっかけとして、webサーバとは通信せず、ブラウザがそのjavaScriptを解釈して、htmlを書き換えます。
javascript


最後に

今まで説明した内容を全体図にします。

全体

ここでは分からないかもですが、プログラムを学習するうちに理解が深まると思いますし、かつ重要なことです。