# プロになるためのWeb技術入門(LESSON3まで) ## LESSON1 「Webアプリケーション」とは何か ### 1.1 デスクトップアプリケーションの特徴 * PC(ローカル)上で動く。 * 画面はOSの機能で表示される。 * アプリをPCにインストールする必要がある。 ### 1.2 Webアプリケーションの特徴 * Webサーバ上で動く。 * 画面はHTMLで表現され、Webブラウザ上で表示される。 * PCへのインストールは不要。 ## LESSON2 Webはどのように発展したか ### 2.1 WWWの誕生と普及 * **インターネット**:**相互(Inter)** なネットワーク(Network)→世界中のコンピューターネットワークの相互接続を表す。 * **WWW(World Wide Web)**:世界中のネットワークを繋ぐ場所のこと。ハイパーリンクで世界中が蜘蛛の巣のように結びついていることから命名。 * **HTML(Hyper Text Markup Ranguage)**:統一されたWeb様式。ハイパーテキスト及びハイパーリンクの埋め込みにより、画面遷移が容易になった。 * **NCSA Mosatic**:**文字と画像を混在させて表示した**初のWebブラウザ。無料で利用できるようになり、wwwの利用は大きく広がった。 ### 2.2 Webを支える技術の発明 * **クライアント・サーバ方式**:クライアントからのリクエストに対し、サーバがレスポンスを返す方式。不特定多数の利用者に多様なコンテンツ展開が可能に。 * 主な製品:Apatch HTTP Server, Internet Information Servicies等) * **URL**:サイトが持つ一意(ユニーク)のアドレス。 * **スキーム**:http,ftpなどのプロトコルで定義される。 * **ホスト名**:リソースを持つホストコンピューター名のこと。wwwなどのローカル名と、その先のアドレスの親ドメイン名から構成される。 * **HTTP(Hyper Text Transfer Protocol)**:コンテンツのやりとりを行うプロトコル。 * **RFC(Request for Comments)**:プロトコルの技術文書の形式。**IETF(The Internet Engineering Task Force)** が公開している。 ### 2.3 CGIの誕生 **CGI(common Gateway Interface)**:HTMLを生成するプログラムとWebサーバとを結びつけるインターフェース。プログラムにリクエストを渡してHTMLを書いてもらい、レスポンスを返す役割を仲介する。**動的コンテンツ生成のキモとなる。** ### 2.4 サーブレットの誕生 * **サーブレット**:JavaEEの機能の一つ。Webコンテナ上でサーブレットを実行させるため、CGIで発生していたマルチプロセスの問題点を解消した。 * J**VM(Java Virtual Machine)**:Javaプログラムを動かす仮想マシンのこと。**プラットフォームの独自仕様に依存することなく実行可能なため**、あらゆるマシンでの利用が可能となり、爆発的普及に貢献した。 ### 2.5 JSPの誕生 **JSP(Java Server Pages)**:サーブレットで表現が難しかったフロントエンド部分、すなわちHTMLに対する記述を容易に行えるようにした技術のこと。 ほぼHTMLの書き方に準じており、必要な部分だけJavaコードを埋め込むスタイルを取ることで、HTMLベースでの画面表現が可能となった。以降、**バックエンドとフロントエンドの分業**が進んでいった。 ### 2.6 Webアプリケーションフレームワークの時代 **Webアプリケーションフレームワーク**:Webアプリケーションで用いるフレームワーク、すなわち**開発しやすくする土台として様々な機能が再利用できる仕組み**のことである。大規模化や精密化に対する現場の負担を減らすために導入された。 ## LESSON3 HTTPを知る ### 3.1 HTTPの知識はなぜ必要か Webアプリケーションが動作しない場合に原因が突き止められるよう、HTTPをはじめ、各構成技術や要素についての知識が必要である。 ### 3.2 HTTP(Hyper Text Transfer Protocol) HTTPは、Webブラウザとサーバをつなぐ**通信のルールを定めた通信プロトコル**である。具体的には**通信の伝達方法**と、**情報の意味付け**の2点においてルールが定められており、HTTPの場合、**伝達方法はHTMLである。** #### 3.2.1 リクエスト情報 * **リクエスト・ライン**:サーバーに対するリクエストが入る。**メソッド、URI、HTTPバージョンの順**に記す。 * **メソッド**:GET, POST, PUT, DELETE等、リクエストの種類を表す。 * **URI(Uniform Resourse Identifier)**:メソッドを実行する対象場所を指定する。 **URI=URL(場所を表す。例:https://www ~ .jp/webpage/)+URN(名前を表す。例:index.html)** * **HTTPバージョン**:HTTP/1.1等のバージョンを表す。 * **メッセージ・ヘッダ**:リクエストに対する各種情報が入る。 * **Accept(Content-Type)**:Webクライアントが受け取り可能な**コンテントタイプ**が入る。(例:apprication/json, image/jpeg等) * **Accept-Language**:Webクライアントが受け取り可能な言語が入る。(例:日本語→ja-JP) * **User-Agent**:**利用しているブラウザの種類やバージョン**が入る。この項目は、スマホ版サイト表示の判定やマーケティングの統計資料等で活用される。 * **Host**:リクエスト元のホスト名やポート番号が入る。 #### 3.2.2 レスポンス情報 * **ステータス・ライン**:リクエストの結果が入る。**HTTPバージョン、ステータスコード、レスポンスフレーズ**の順に記す。 * HTTPバージョン:リクエスト情報と同様。 * **ステータスコード**:リクエスト処理の結果を数値で表したもの。 * 100番台:情報(処理継続中) * 200番台:通信成功(完了) * 300番台:リダイレクション(完了までに追加の動作が必要) * 400番台:クライアント側のエラー * 500番台:サーバ側のエラー * **レスポンス・フレーズ**:ステータスコードに対応した処理結果を単語で技術したもの。 * 200 OK:リクエストが正常に完了した。 * 302 FOUND:リダイレクト元に正常にアクセスできた。この後リダイレクト先のページに遷移。 * 401 Unauthorized:ログイン認証に失敗し、アクセスできなかった。 * 403 Forbidden:アクセス権限が無く、アクセスできなかった。 * 404 NOT FOUND:リクエスト先にアクセスできなかった。(例:ページが見つかりません) * 500 Internal Server Error:サーバ処理のエラー全般で表示。 * **メッセージ・ヘッダ**:レスポンスに対する各種情報が入る。 * **メッセージ・ボディ**:レスポンスで返される内容が入る。 #### 3.2.3 HTTPリクエストの原則 * **1リクエストにつき1リソースを取得**:複数リソース取得のためにはその度リクエストが必要。ステートレスなHTTPでは保存が効かない難点も。(第4章参照) * **ファイル名を省略するとデフォルト設定のものが返る**:URN部分を記入しない場合、デフォルト設定されているページが呼び出される。 ### 3.3 TCP/IP * **TCP/IP**:**IPアドレス**を用いて送信先(元)を特定し、情報を転送するプロトコルのこと。 * **パケット**:データを一定量で細かく刻んだもの。送受信時の基準となる。 * **ISP(Internet Service Provider)**:インターネットとの通信を仲介する団体。**インターネット利用にはISPとの契約が必須。** まとまった量のIPアドレスを管理団体から割り当てられている。 #### 3.3.1 グローバルIPとプライベートIP * **グローバルIP**:**全世界で一意(ユニーク)なIPアドレス。** インターネット利用時に必須。**NAPTによって、1グローバルIPで複数のプライベートIPを束ねる**ことができる。 * **プライベートIP**:**1ネットワーク内で一意(ユニーク)なIPアドレス。** グローバルIPとは**重複しても良い。** 3つのクラスの範囲内で指定されたIPアドレスは、特別な申請無しで自由に利用できる。 #### 3.3.2 DNS(Domain Name System) * DNS:**ドメイン名をIPアドレスに変換する技術**である。DNSサーバを介して変換が行われる。量が膨大なため、**複数台のサーバで分散管理している。** * **トップレベルドメイン**:ドメインの末尾につくもの。(例:.jp, .com, .net等) * **ルートサーバ**:トップレベルドメインを扱うサーバを取りまとめる最上位サーバ。2010年現在世界で13個ある。 * ポート番号:データを、**利用するプロトコル別**に分散させるための番号。代表的なものは**well-knownポート番号**という。 * HTTP:80 * HTTPS:443 * SMTP:25 * POP3:110 ### 3.4 メソッドとリクエストパラメータ GETメソッドやPOSTメソッドでは、HTMLページで入力した情報等を転送するために**リクエストパラメータ**を扱う。 各メソッドで適するデータが異なるため注意が必要である。 #### 3.4.1 GETメソッドでのリクエストパラメータ転送の特徴 * URIに転送情報が表示される。 * クエリ文字列(宛先URIに続いて、?で始まるキーと値の組み合わせ=クエリ文字列が記載される。例:…/result.html ?arg1=123&arg2=456) * URLの長さは、クエリ文字列含めて255文字までのものもある。 →転送内容が簡単に分かってしまうためセキュリティ上の問題があり、またURLに文字数制限が存在するものもあるため大量のデータ送信には不向き。 * 検索結果等、入力したパラメータを参照したい時に役立つ。 * 副作用がない。(同様の要求を繰り返しても同じ結果が返る。) **☆適する処理:検索・参照処理、小規模な処理** #### 3.4.2 POSTメソッドでのリクエストパラメータ転送の特徴 * 転送情報はURIに表示されない。:リクエストパラメータは**メッセージボディ部分**に記載される。 * 文字数制限を気にする必要がない。 →GETメソッドで問題だったセキュリティ上の問題が解決し、大量のデータ送信にも向いている。 * パラメータをユーザは後から参照できない。 * 副作用がある。(同様の要求を繰り返しても同じ結果が返るとは限らない。) **☆適する処理:ログイン処理、大規模な処理** #### 3.4.3 文字化けとエンコード URLに使用できるのはアルファベット及び半角数字、一部の記号(. - _ ~)のみである。日本語等の使用不可の文字である場合、文字化けが起こる。 その際に用いるのが、**%と16進数を組み合わせた、パーセントエンコード**である。%の後の16進数2桁分の記載を1セットとし、これを繰り返す。 3セット(16進数6桁分)を日本語1文字に変換する。 ###### tags: `読書`
×
Sign in
Email
Password
Forgot password
or
By clicking below, you agree to our
terms of service
.
Sign in via Facebook
Sign in via Twitter
Sign in via GitHub
Sign in via Dropbox
Sign in with Wallet
Wallet (
)
Connect another wallet
New to HackMD?
Sign up