【学習記録②】チームラボオンラインスキルアップ課題(WEBサーバについて)

はじめに

第2回です。チームラボオンラインスキルアップ課題を実践します。

「STEP1-2.WEBサーバについて ／チームラボオンラインスキルアップ課題」
https://team-lab.github.io/skillup/step1/02-http.html

今回学習すること

WEBサーバについて

用語集

• クライアント（主にWEBブラウザ）
• WEBサーバ（クライアントとHTTPによる通信を行うプログラム及びコンピュータ）
• HTTP（プロトコル）
  • WebサーバはHTTPを用いてクライアントと通信する
  • HTTP通信は必ずクライアント側のリクエストから開始される
  • サーバはこれにレスポンスを返す
• HTTPリクエスト
  • リクエスト（クライアント⇒サーバ）
    • メソッド（GET／POST）
    • URI（/index.html）
    • ホスト名（example.com）
  • レスポンス（サーバ⇒クライアント）
    • ステータスコード（200、403、404）
    • Content-Type（送信したファイルの種類「text/html」）
    • 空行
• 「GETメソッド」…コンテンツを呼び出す際に用いられる
  • 1. クライアント(主にブラウザ)がWEBサーバにリクエストを送る
  • 2. リクエスト内容に応じて、サーバはレスポンスを返す
  • 3. クライアントはデータを受取り、ファイルの内容を表示する
• 「POSTメソッド」…掲示板など動的なコンテンツに書き込む際に用いられる
  • 1．クライアントがWEBサーバにリクエストを送る
  • 2．サーバでデータを処理するプログラムが起動
  • 3. 掲示板の更新処理などを行った後にレスポンスを返す
• クラウドコンピューティング(インターネットなどのコンピュータを経由して、コンピュータの資源をサービスの形で提供する利用形態)
  • Paas(Platform as a Service)
    • AWS(Amazon Web Service)
    • GCP(Google cloud Platform)
    • Heroku

リクエストとレスポンス（例）

リクエスト

//クライアント(主にブラウザ)からWEBサーバにリクエストを送る
GET /index.html HTTP/1.1
Host: example.com

//これはexample.comというホスト名のサーバに対し、GETメソッドで
/index/htmlというURIを要求していることを表す。

レスポンス

HTTP/1.1 200 OK　　　　　　　//ステータスコード
Content-Type: text/html　　 //送信したファイルの種類
Content-Length: 25069
Date: Fri, 10 May 2013 06:17:55 GMT
　　　　　　　　　　　　　　　 //最後に1行の空行を挟む
(コンテンツ本体)

実際の通信を見てみよう

実践済み

GoogleChromeには「要素を検証」という機能があり、Webページの情報や通信の様子を見ることができます。右クリック→「検証」→「Network」タブでWebページの通信の様子が見れます。
タブを開いている状態でページを更新したり、別のページを開いて色々なWebページの通信の様子を見てみましょう。