SIC - 上級プログラミング2(第 回)masaomi/java2/adv_prog2_07.pdfAjaxやWebsocket...

Post on 07-Aug-2020

1 views 0 download

Transcript of SIC - 上級プログラミング2(第 回)masaomi/java2/adv_prog2_07.pdfAjaxやWebsocket...

上級プログラミング2(第7回)

工学部 情報工学科

木村昌臣

今日のテーマ

Webアプリケーションとは Webアプリケーションとはなにか

Webアプリケーションの仕組み

三層アプリケーション

サーブレット、JSP、JavaBeans

MVCモデル

Webアプリケーションの環境構築 Webサーバー(Apache)

Webアプリケーションサーバー(Tomcat)

Webアプリケーションとは

Webアプリケーションとはなにか

実際の処理を行うサーバーとのデータのやり取りやユーザーインターフェイスとしてWeb技術を利用したもの

Webブラウザ Webサーバー

Webアプリケーションサーバー

HTTP

Webアプリケーションの仕組み

WebブラウザWebサーバー

Webアプリケーションサーバー

HTTP

アプリケーションが動作

(Javaプログラム等)

ユーザーインターフェイス

HTTP-アプリケーション間インターフェイス

接続には専用のモジュールが必要

三層アプリケーション

WebブラウザWebサーバー/

Webアプリケーションサーバー

HTTP

DBサーバー

JDBCなど

第一層 第二層 第三層

ビジネスロジックプレゼンテーション

【参考】従来のクライアント・サーバーアプリケーション(二層アプリケーション)

サーバー

DBサーバー

第一層 第二層

クライアント

ビジネスロジック

プレゼンテーション

従来のクライアント・サーバーモデルと比べて三層アプリケーションモデルのうれしい点

表示(プレゼンテーション)とデータ処理(ビジネスロジック)の分離

ブラウザさえあればクライアントをインストールする必要がない

(それゆえに)クライアントの更新が不要

データベースなどの基幹システムに対してクライアントから直接アクセスすることがない(アクセスはWebアプリケーションサーバのみ)のでセキュリティが向上

サーブレット(Servlet)

Webアプリケーションサーバーで動作するJavaプログラム

HttpServletクラスを継承して作る

次の三つのパッケージはインポートする必要あり

java.io.*

javax.servlet.*

javax.servlet.http.*

HttpServletRequestで入力、HttpServletResponseで出力を行う

JSP

Java Server Page

HTMLにJavaプログラムによる処理を付け加えたもの

サーブレットは最終的にHTML形式で出力するが、JavaのプログラムではHTMLのレイアウトの調整を詳細に行うことは困難

同様のことを、HTMLをベースにし、必要な処理を付け加えることにより実現したものがJSP

JavaBeans

いろいろなWebアプリケーションで共通に使われるJavaクラス群をモジュール化してまとめたもの

データ接続用など

クラスのプロパティ(変数)にアクセスするときには、直接、変数にアクセスするのではなく、メソッド経由でアクセスする

set変数名()・・・・変数に値のセット

get変数名()・・・・変数の値を取得

DBサーバー

それぞれの役割(検索エンジンを例として)

サーブレット

JavaBeans

検索語の入力検索処理の指示

JSP

表示用処理の指示

検索処理結果の取得

表示

※ただし、JavaBeansやJSPの役割をサーブレットだけで実現することもある

MVCモデル

サーブレット

JavaBeans

JSP

適切な出力の指示を行う

Control

ビジネスロジックのモデリングを行う

Model出力を行う

View

MVCモデルにのっとったWebアプリケーションを設計する利点

規模が大きいアプリケーションに向いている

役割別に分類されているため、異なる役割の人が開発に参画しやすい

M(モデル): 共通部品開発者

V(ビュー): 画面デザイナー

C(コントロール): アプリケーション開発者

Webアプリケーションの作り方の変化

従来のWebアプリケーションの困難

従来のWebアプリケーションでは、1画面に対してWebページ 1つが対応

ユーザーがページ遷移を待たなければならず、user experience的によくない(使いづらい)

Webブラウザの「戻る」ボタンを押されると処理の流れが断ち切られるため、別途対応が必要

AjaxやWebsocket

WebブラウザとWebサーバー間のページ遷移なしの通信を利用したプログラムを実現

Single Page Application (SPA)

HTML5で高度な処理をJavaScriptで行うことができるようになったことが背景

HTMLからページ遷移なしにHTTPでサーバーとデータのやり取りが可能(Ajax)

描画方法が豊かになったので、いろいろなUI部品が簡単に使用可能

ひとつのWebページのみでアプリケーションの全ての画面を実現

Webアプリケーションとネイティブアプリケーションのいいとこ取り

参考文献:https://arxiv.org/ftp/cs/papers/0610/0610094.pdf

SPAの例

ブラウザ上でExcelが動いていることに

注意

https://blogs.office.com/2014/04/14/more-office-online-commenting-printing-tell-me-and-more/

以降、この講義では

サーブレット、JSP、BeansによるMVCモデルを元に説明

Javaだけで話を閉じるために

SPAではJavaScriptの活用が不可欠

Webアプリケーションの環境構築

Webアプリケーションの実行環境例

Webブラウザ Webサーバー

Webアプリケーションサーバー

HTTP

TomcatApache

接続には専用のモジュールが必要

Webアプリケーションの実行環境

Webサーバー

Apache (Apache Software foundation)

IIS (Microsoft)

IHS (IBM)

Web アプリケーションサーバー

Tomcat (Jakarta Apache Project)

WebSphere Application Server (IBM)

など

Apacheの入手

http://httpd.apache.org/docs/current/platform/windows.html#downのリンクからダウンロード

Apacheのインストール

インストーラを実行(デフォルトでよい)

サービスとして実行

ネットワークドメイン

サーバー名

正しくインストールできるとこの画面が見れる

ブラウザでhttp://localhost/

にアクセス

Tomcatの入手

http://ring.shibaura-it.ac.jp/archives/net/apache/dist/tomcat/tomcat-9/v9.0.10/bin/からダウンロード

環境変数JAVA_HOMEを設定

「マイコンピュータ」を右クリックし、「プロパティ」→「詳細設定」タブ→「環境変数」ボタンを押す

「システム環境変数」の「新規ボタン」を押して、環境変数JAVA_HOMEにjdkのインストールディレクトリを設定する

Tomcatのインストール(1)

基本的にデフォルトでOK

ServiceStart Menu ItemsDocumentation

Examplesにチェック

Tomcatのインストール(2)

Tomcatの使用ポートは8080

管理パスワードをつけておく

Tomcatのインストール(2)

JRE(Java Runtime環境)のインストールディレクトリを指定

成功するとhttp://localhost:8080/で以下の画面が表示される

コネクタ(mod_jk)

Webサーバー

Webアプリケーションサーバー

接続用の専用モジュール=コネクタ

mod_jkというモジュールを使ってWebサーバーとWebアプリケーションサーバーを連携させる

※mod_jk2やwebapp

mod_jkの入手

http://ring.shibaura-it.ac.jp/archives/net/apache/dist/tomcat/tomcat-connectors/jk/binaries/win32/jk-1.2.15/から mod_jk-apache-2.0.55.so をダウンロード

mod_jkの導入

名前をmod_jk.soに変更し次のディレクトリにコピーC:¥Program Files¥Apache Group¥Apache2¥modules

mod_jkが使えるように設定

Webアプリケーションのログ取得用ディレクトリを作成

C:¥logs

mod_jkの設定ファイルを用意(workers.properties) C:¥Program Files¥Apache Group¥Apache2¥confの直下に置く(内容は次のみ)

C:¥Program Files¥Apache Group¥Apache2¥confにあるhttpd.confを次ページのように編集

worker.list=worker1worker.worker1.type=ajp13worker.worker1.host=localhostworker.worker1.port=8009

## httpd.confの最後に追加# #################################### mod_jkの設定#################################### mod_jkモジュールをロードLoadModule jk_module modules/mod_jk.so

# mod_jkの設定ファイル(workers.properties)の場所JkWorkersFile "C:/Program Files/Apache Group/Apache2/conf/workers.properties"

# ログファイルの場所JkLogFile "C:/logs/mod_jk.log"

# ログ取得レベルJkLogLevel info

## URLとWebアプリケーションの対応付け###自分で作ったプログラムを入れる場所JkMount /webapps/* worker1##サンプル(JSP)JkMount /jsp-examples/* worker1##サンプル(サーブレット)JkMount /servlets-examples/* worker1

動作確認(サンプルプログラムを動かしてみる)

import java.io.*;import java.util.*;import javax.servlet.*;import javax.servlet.http.*;

public class HelloWorld extends HttpServlet {public void doGet(HttpServletRequest request,

HttpServletResponse response)throws IOException, ServletException

{PrintWriter out = response.getWriter();out.println("<html><head>");out.println("<title>Hello world</title></head>");out.println("<body><h1> Hello world! </h1>");out.println("</body>");out.println("</html>");

}}

実行結果

参考URL

http://programnet.hp.infoseek.co.jp/jsp&servlet/tomcat.html

http://www.hellohiro.com/servletwebxml.htm

http://www.castle.flnet.org/pw/?Java%2FTomcat5.5%2Fmod_jk