update.はじめに私は数ヶ月前に未経験としてIT企業に入社しました。2ヶ月間ほどJavaを用いたWebアプリケーションの開発を研修で行ったのでわかったことを簡単にまとめて行こうと思います。間違っていることもたくさんあると思いますので、どんどん指摘して頂けると助かります。開発方法や手順は書いていません。知識として必要な用語や全体像をざっくりと記載しています。対象HTML/CSSで静的なWebページを作成したことがあるが、動的なWebアプリケーションを作るにあたってどのような知識が必要なのかがわからない方Javaのコードの書き方はわかるが、動的なWebアプリケーションを作る時の全体像が見えない方WebクライアントとWebサーバーまず、今ブラウザ上で見ているようなWebページは、クライアントとサーバーというコンピュータ(ソフトウェア)によって実現されています。Webクライアントサーバーに対して何らかのサービスを要求し、サーバーからそのサービスを提供されるコンピュータ(ソフトウェア)をクライアントと呼び、Webサーバーに保管してあるWebページにアクセスして利用できるものをWebクライアントと呼ぶ。Webクライアントとは、ChromeやIEなどのブラウザのことだとイメージすれば大丈夫です。Webサーバークライアントからの要求に対して、何らかのサービスや機能をクライアントに提供するコンピュータ(ソフトウェア)をサーバーと呼びます。サーバーにはWebサーバーやメールサーバー、データベースサーバー、アプリケーションサーバーなどあり、Webクライアントからのアクセスに応じるものをWebサーバーと呼びます。ApacheやIIS、nginxなどが有名なWebサーバーソフトウェアになります。ユーザーがGoogleで何か検索したいなと思った時、ブラウザ上のURL欄にhttps://www.google.comと入力してアクセスすると思います。実際にアクセスしたらGoogleのページは一瞬で表示されますが、クライアントとサーバー間で見た場合、ユーザーがGoogleのページにアクセスしようとする間に以下のようなやりとりが行われます。WebサーバーがWebクライアントにResonseメッセージを送信し、Webページが表示ここで送受信しているメッセージはHTTPというプロトコルでやりとりを行っています。プロトコルプロトコルとは、簡単にいうとコンピュータ同士がやりとりする際のルールみたいなものです。日本人同士で会話をする時、日本語という言語(ルール)で会話するのと同様にWebクライアントとWebサーバーがやりとりをする時、HTTPというプロトコル(ルール)で送受信を行います。することで、クライアント側でWebページを閲覧することができています。単なるWebサーバーだけでは静的なWebページを表示させることしかできず、動的なWebページを表示させるためには、処理を実行させるためのソフトウェアが必要になってきます。クライアントがWebサーバーに送るRequestメッセージとして、GETとPOSTという2種類の送信方法があり、これをうまく使い分けて動的なWebページを実現させていく必要があります。そのソフトウェアやGET,POSTの説明の前に静的なWebページと動的なWebページを比較してみます。静的コンテンツと動的コンテンツ静的なWebページ以下の画像のように、静的なWebページを表示する際、WebクライアントがWebサーバーへ要求したWebページをそのまま応答としてWebクライアントへ返しているので、何度要求しても同じページの内容が返ってきます。Webサーバーにあらかじめ保管してあるHTMLファイルをそのまま返すようなイメージ。何かしらの処理を行ってからWebページをWebクライアントに返しています。Webサーバー側で何らかの処理(プログラム)を実行して、HTMLテキストを生成しているイメージ。入力フォームにQiitaと入力してボタンを押すことでWebページの表示内容をQiitaに変更させることができます。このように、動的なWebページを実現するためには何らかの処理(プログラム)が必要で、その処理を実行させるためにプログラムを実行するソフトウェアが必要になってきます。この何らかの処理というのを、C言語やPHPやJavaなどのプログラミング言語で実装していくことになります。動的なWebページを表示する流れ先ほど、Webページを表示する流れを説明しましたが、動的なWebページを表示するということ(プログラムの実行)に焦点を置いてWebページを表示する流れを説明していきたいと思います。Webサーバー内でアプリケーションを実行まず例としてWebページをPHPで実装する場合、WebサーバーにはPHPファイルを実行するモジュールがないため、PHP実行用モジュールをWebサーバーに組み込んで、Webサーバーを拡張させます。WebサーバーがApacheを使用している場合、mod_php5というPHP実行用モジュールを組み込んでPHPスクリプトを実行します。することでWebサーバー内でHTMLファイルを生成し、クライアントへ返します。流れは以下のようになる。次に例としてWebページをJavaで実装する場合、アプリケーションサーバーを用意します。GlassFishがあります。ここで用意したアプリケーションサーバーはWebサーバーと別物なので簡単にやりとりができません。WebクライアントとWebサーバー間がHTTPプロトコルでやりとりできるように、Webサーバーとアプリケーションサーバー間もやりとりできるようにするための何かしらのプロトコルを必要とします。WebサーバーをApache,アプリケーションサーバーをTomcatとした場合、Apacheにはmod_jkと呼ばれる連携用モジュールが提供されており、これをApacheの拡張機能として組み込みます。連携用モジュールmod_jkがajp13というプロトコルを使用することで、Webサーバーとアプリケーションサーバー間でのやりとりを実現させています。ちなみに、Tomcatは簡易的なWebサーバーも持っているため、連携しなくても動的Webページを表示できます。Webサーバーとアプリケーションサーバー間でやりとりができるようになったことで、Webクライアントからの要求がアプリケーションサーバーに届き、メッセージを元に処理を実行することでHTMLテキストを生成しています。流れは以下のようになります。WebサーバーがWebクライアントへHTTPプロトコルでResonseメッセージを送信し、Webページが表示このように、モジュールやアプリケーションサーバーを用いることで動的なWebページの表示が実現できます。次に、どのようなアプリケーションを実行してHTMLファイルを生成しているかについて、Javaを用いて説明していきます。サーブレットサーブレットとは、Javaで作られたHTMLなどのWebコンテンツを生成するためのプログラムのことで、Tomcatなどのアプリケーションサーバーによって実行されます。実際に以下のような、ServletController.javaという簡単なサーブレットを作成してみました。out.println("これはTomcatによって実行されたサーブレットが生成したWebコンテンツです。}}このサーブレットを実行することで、ブラウザ上で以下のようなWebページを表示させることができます。ちなみにこのWebページは表示内容を変更したりすることができないため、静的なWebページだと感じると思いますが、Webクライアントからの要求後、Webサーバーに保管してあるHTMLファイルをそのまま返すような流れで表示している訳ではなく、アプリケーションサーバーがjavaファイルを実行してHTMLテキストを生成し、ブラウザに表示しているので、これは動的なWebページになります。GETとPOST次に、上の例の動的なWebページ(静的コンテンツと動的コンテン内のブラウザ画像)のように、表示内容をどのように変更しているかについて説明していく。上の例の動的なWebページでは、HelloWorld!からQiitaという文字に変更しました。Webページを表示する流れで示したように、Webクライアントは、Webサーバーへ情報を送る方法としてRequestメッセージを送信することしかできません。Webページの表示内容を変更させるには、Requestメッセージにパラメータ(任意の値)を持たせて送信する必要があります。そこでRequestメッセージの送信方法としてGETとPOSTという2種類あるので、これらがどのようにパラメータを持っているか比較していきます。以下のような、RequestメッセージをGETもしくはPOSTで送信できる簡単なWebページを用意しました。ちなみに、このWebページにアクセスした時のURLは192.168.56.101/Test/TestControllerになります。GETまず、RequestメッセージをGETで、パラメータはQiitaとして送信してみます。HelloWorld!と表示されていた部分がQiitaと変更されましたが、それと同時にURLも192.168.56.101/Test/TestControllerから、192.168.56.101/Test/TestController?inputText=Qiitaに変更されました。Requestメッセージの送信方法としてGETを用いた場合、送信したパラメータはURLに組み込まれてWebサーバーに届きます。ちなみに、この場合inputTextはキーで、Qiitaがそのキーに対する値になります。POST次に、RequestメッセージをPOSTで、パラメータはQiitaとして送信してみます。こちらもHelloWorld!と表示されていた部分がQiitaと変更されましたが、GETとは異なり、URLは192.168.56.101/Test/TestControllerのままです。Requestメッセージの送信方法としてPOSTを用いた場合、送信したパラメータをURLに組み込まず、Requestメッセージ内に組み込まれてWebサーバーに届きます。GETとPOSTの使い分け実際の例を考えてみます。Googlehttps://www.google.comにアクセスして検索ワードにQiitaと入力すると、ブラウザ上のURL欄にはhttps://www.google.com/search?hl=ja&q=Qiitaとしてアクセスしています。Googleの検索はGETでRequestメッセージを送信しています。GETで送信していることによって、後でまたこのページを見たいという時にブックマークしたりして再度簡単にアクセスすることができます。検索条件など他の人に見られてもあまり問題なく、かつパラメータごと保存できる方が便利な場合はGETを使用した方が良いです。逆にPOSTは、人に見られてはいけない内容を送信してアクセスする場合や、データベースを書き換えたりする場合に使用するべきです。以下に違いを簡単にまとめました。先ほどのサーブレットのソースコードを見てもらえばわかるように、ServletControllerクラス内にはdoGetとdoPostというメソッドがありました。RequestメッセージがGETで送られてきた場合、doGetメソッドが実装され、RequestメッセージがPOSTで送られてきた場合、doPostメソッドが実装されて、HTMLテキストを生成します。実際にWebページの表示のために生成されたHTMLテキストはどのような内容なのか確認してみます。192.168.56.101/Test/TestControllerにアクセスした時のHTMLテキストは以下のようになります。<p>HelloWorld!</p></body></html>formタグで指定している、actionとmethodについてですが、actionは、どのclassファイル(.java)を実行するかの指定をしており、methodは、requestメッセージの送信方法(getかpost)を指定します。クライアント側で、あるformタグ内のsubmitボタンを押した場合、requestメッセージがWebサーバーへ送信され、actionで指定したクラスのdoGetかdoPostのメソッドが実行されます。その際、送信するパラメータがあればパラメータも一緒に送信されます。この場合、inputタグのnameがキーinputTextとなり、入力した文字列が値Qiitaとして送信されます。192.168.56.101/Test/TestControllerのサーブレットは、以下のようになります。}}このソースファイルの内容は詳細に理解する必要は全くないのですが、注意してもらいたいのは、ServletController.javaに記載していたようなhtmlタグなどを出力する処理がないところです。この処理が記載しなくても良いのは、サーブレットとJSPで役割を分担して連携させているためです。JSPJSPとは、簡単にいうとHTML形式の中にJavaのコードを埋め込んだものです。処理を行うサーブレットと、それを表示するJSPに分担させることで、効率よく開発を行うことができます。以下は、先ほど上で取り上げていたサーブレットのTestController.javaから呼ばれるJSPTestView.jspです。%>というタグの中に組み込んでいきます。Webページに文字を出力させるには、out.println();の引数に表示させたい文字列を入れれば良い。%>で文字列を出力させることができます。CSSやJavaScriptの外部ファイルを読み込みたい場合もHTMLと同様にヘッダー部分に記入していきます。このように、処理担当のサーブレットと表示担当のJSPで役割を分けることで開発しやすくなります。大量のデータを保存し管理できるサーバーが必要になってきます。その大量のデータを保存・管理できるサーバーというのが、データベースサーバーです。DataBase、PostgreSQLなどが有名なデータベースサーバーソフトウェアになります。このようなデータベースサーバーを用いることで、Webアプリケーションを通じて大量のデータベースを管理することができます。その大量のデータベースを扱ってWebアプリケーションを開発する場合はMVCモデルという開発手法を用いることで、より大規模な開発を効率よく行うことができます。MVCモデルMVCモデルは、アプリケーションソフトウェアをModel,View,Controllerの3つの役割に分けて開発していきます。それぞれ簡単に説明していきます。Modelモデルはアプリケーションの処理を担当します。データの管理、データベースへのアクセスやメソッドの管理についてを行います。コントローラーからの指示により処理を実行します。一般的なjavaファイルがモデルにあたります。Viewビューは、アプリケーションの表示を担当します。コントローラーから出力結果を渡されます。HTML形式に書かれているJSPファイルがビューにあたります。Controllerコントローラーは、View(画面)からの情報入力を受け、Model(処理やデータ)を呼び出し、Viewへの結果の出力を担当します。一つのコントローラーに、特定のViewに対する処理や特定の処理の流れが書かれています。サーブレットクラスがコントローラーにあたります。MVCモデルの流れこの3つの役割に分けた場合のアプリケーションの処理の流れは以下のようになります。サーバーがクライアントへResonseメッセージを送信し、Webページが表示これがMVCモデルの簡単な流れであるが、厳密にはMVC2やMVP、MVVMなど種類があり、開発するアプリケーションによって適切に変えていくべきでしょう。Webアプリケーション全体の流れ以上を踏まえ、JavaによるWebアプリケーションの全体の仕組みは以下のようになります。クライアントサイドとしてはもちろんWebクライアントが存在しており、サーバーサイドにはWebサーバーやアプリケーションサーバー、データベースサーバーがあります。サーバーを構築する場合、Webサーバー、アプリケーションサーバー、データベースサーバー等をインストールし、それぞれ実行する事で、Webアプリケーションにアクセスした際、正常に動作されます。新しくアプリケーションを追加する場合も、それを実行するアプリケーションサーバーをインストールして実行していき、拡張させていけます。upLoginユーザーは見つかりませんでした。