[Web開発] HTTP構造及び、コア要素



# HTTP構造及び、コア要素


## HyperText Transfer Protocol

- ハイパーテキスト（HTML）文書を交換するために作られた「protocol（通信規約）」
- つまり、ウェブ上でネットワークでサーバー同士が通信をする際に、何らかの形式で通信をしようと規定している「通信形式」あるいは「通信構造」と考えればよい。
フロントアンドサーバーとクライアント間の通信に使われる。
またバックアンドとフロントアンドサーバー間での通信にも使われる。
- HTTP はTCP/IP ベースになっている。

## HTTP通信方式

- HTTP 基本的にリクエスト応答（request/response）構造となっている。
クライアントがHTTP requestをサーバに送ると、サーバはHTTP responseを送る仕組み。
クライアントとサーバのすべての通信がリクエストと応答で行われる。
- HTTP はStateless である。
Statelessとは、文字通り「state（状態）」を保存しないという意味。
つまり、要請が来たらそれに応答をするだけ。 
例えば、クライアントがリクエストを送り応答を受け取った後、少し後で再度リクエストを送る際に、前に送ったリクエスト応答について知らないという意味である。
だから、もし様々な要請/応答の進行過程やデータが必要なときは、クッキーやセッションなどを使うことになる。

## HTTP request構造

HTTP request メッセージは大きく3 部分で構成される:

- スタートライン（start line）
- ヘッダーズ（headers）
- バディ（body）

## スタートライン（start line）

- HTTP Method
当該requestが意図したactionを定義する部分。
HTTP Methods にはGET、POST、PUT、DELETE、OPTIONS 等がある。
主にGETとPOSTと使われる。
- Request target
当該リクエストが送信される目標uri。
たとえばlogin。
- HTTP Version
文字通り使われるHTTPバージョン。 バージョンには1.0、1.1、2.0 などがある。

## ヘッダーズ（headers）

- 当該requestに対する追加情報(addional information)を含んでいる部分。
例えば、requestメッセージbody の全長(Content-Length)など。
- Key:Value値になっている(:が使われる)。
key:value
HOST: google.com => Key = HOST, Value = google.com
- Headers も大きく3 部分に分かれるが（general headers, request headers, entity headers）、細かすぎる部分であることが分かりすぎてもよい。

``` 
Accept: */*
Accept-Encoding: gzip, deflate
Connection: keep-alive
Content-Type: application/json
Content-Length: 257
Host: google.com
User-Agent: HTTPie/0.9.3
```

- Host
リクエストが送信される target の host url:たとえば、google.com
- User-Agent
リクエストを送信するクライアントに関する情報:たとえば、ウェブ ブラウザに関する情報。
- Accept
その要請が受けられる応答(response)タイプ。
- Connection
当該要請が終わった後にクライアントとサーバが引き続きネットワークコネクションを維持するか、それとも切断するかについて指示する部分。
- Content-Type
当該リクエストが送るメッセージbodyのタイプ。例えば、JSONを送るとapplication/json。
- Content-Length:
メッセージbodyの長さ。

## バディ（body）

- 該当リクエストの実際のメッセージ内容。
Bodyがないrequestも多い。
例えば、GET request はほとんどbodyがない場合が多い。

``` 
POST /payment-sync HTTP/1.1

Accept: application/json
Accept-Encoding: gzip, deflate
Connection: keep-alive
Content-Length: 83
Content-Type: application/json
Host: intropython.com
User-Agent: HTTPie/0.9.3

{
    "imp_uid": "imp_1234567890",
    "merchant_uid": "order_id_8237352",
    "status": "paid"
}
```

## HTTP Response構造

- Responseもrequestと同様に大きく3 部分で構成されている。

- スタートライン（start line）
- ヘッダーズ（headers）
- バディ（body）

## スタートライン（start line）

- Responseの状態を簡略に表す部分。
3つの部分で構成されている。

- HTTPバージョン
- ステータスコード:応答状態を表すコード。 数字でできているコード
たとえば、200
- Statustext:応答状態を簡単に説明する部分。
例えば、「Not Found」

``` 
HTTP/1.1 404 Not Found
```

## ヘッダーズ（headers）

- 応答のheadersと同じである。
- ただし、responseでのみ使用されるheader値がある。
- たとえば、User-Agent の代わりに Server ヘッダが使用される。

## バディ（body）

- responseのbodyと一般的に同じである。
- Requestと同様に、全てのresponseがbodyというわけではない。 データを転送する必要がない場合、bodyが空になる。

``` 
HTTP/1.1 404 Not Found

Connection: close
Content-Length: 1573
Content-Type: text/html; charset=UTF-8
Date: Mon, 20 Aug 2018 07:59:05 GMT

<!DOCTYPE html>
<html lang=en>
  <meta charset=utf-8>
  <meta name=viewport content="initial-scale=1, minimum-scale=1, width=device-width">
  <title>Error 404 (Not Found)!!1</title>
  <style>
    *{margin:0;padding:0}html,code{font:15px/22px arial,sans-serif}html{background:#fff;color:#222;padding:15px}body{margin:7% auto 0;max-width:390px;min-height:180px;padding:30px 0 15px}* > body{background:url(//www.google.com/images/errors/robot.png) 100% 5px no-repeat;padding-right:205px}p{margin:11px 0 22px;overflow:hidden}ins{color:#777;text-decoration:none}a img{border:0}@media screen and (max-width:772px){body{background:none;margin-top:0;max-width:none;padding-right:0}}#logo{background:url(//www.google.com/images/branding/googlelogo/1x/googlelogo_color_150x54dp.png) no-repeat;margin-left:-5px}@media only screen and (min-resolution:192dpi){#logo{background:url(//www.google.com/images/branding/googlelogo/2x/googlelogo_color_150x54dp.png) no-repeat 0% 0%/100% 100%;-moz-border-image:url(//www.google.com/images/branding/googlelogo/2x/googlelogo_color_150x54dp.png) 0}}@media only screen and (-webkit-min-device-pixel-ratio:2){#logo{background:url(//www.google.com/images/branding/googlelogo/2x/googlelogo_color_150x54dp.png) no-repeat;-webkit-background-size:100% 100%}}#logo{display:inline-block;height:54px;width:150px}
  </style>
  <a href=//www.google.com/><span id=logo aria-label=Google></span></a>
  <p><b>404.</b> <ins>That’s an error.</ins>
  <p>The requested URL <code>/payment-sync</code> was not found on this server.  <ins>That’s all we know.</ins>
```

## よく使われるHTTP Methods

GET

- 名前の通り、あるデータをサーバーから受け取り（GET）来る時に主に使うMethod。
- データの生成修正削除なしで受信するだけのときに使用される。
- 最も簡単で多用されるHTTP Method
- 述べたとおり、主にデータを受け取る時に使われるため、requestにbodyを送らない場合が多い。

POST

- データを生成/修正/削除するときに主に使用されるMethod。
- データを生成及び修正するときに多く使用するため、ほとんどの場合、requst bodyが含まれて送られる。

PUT

- POSTに似ている。 データを生成するときに使用されるMethod。
- POSTと重なるのでPOSTを使用するところもあり、POSTに統一して使用するところもあるが、ここ数年POSTに押されてうまく使わなくなっている傾向。

DELETE

- 特定のデータをサーバーから削除リクエストを送るときに使われるMethod
- PUTと同様にPOSTに押されてよく使われない傾向。

## 知っていてほしい HTTP Methods

- 主にリクエストURIで使用できるMethodを受ける時に使用される。
- 例えば、update uri でどのmethod がリクエスト可能か（GET?POST?）を知りたいなら、まずOPTIONS リクエストを使って確認することになる。

``` 
http -v OPTIONS http://example.org

OPTIONS / HTTP/1.1
Accept: */*
Accept-Encoding: gzip, deflate
Connection: keep-alive
Content-Length: 0
Host: example.org
User-Agent: HTTPie/0.9.3

HTTP/1.1 200 OK
Allow: OPTIONS, GET, HEAD, POST
Cache-Control: max-age=604800
Content-Length: 0
Date: Mon, 20 Aug 2018 08:37:45 GMT
Expires: Mon, 27 Aug 2018 08:37:45 GMT
Server: EOS (vny006/0450)
```

## よく使われるHTTP Status Code

200 OK

- 最もよく目にするstatus code。
- 問題なく全てうまく実行された時に送るコード。

301 Moved Permanently

- そのURIが他のアドレスに変わった時に送るコード。

``` 
HTTP/1.1 301 Moved Permanently
Location: http://www.example.org/index.asp
```

400 Bad Request

- 該当要請が誤った要請である場合に送るコード。
- 主に要請に含まれたinput値が誤った値が送られた時に使用されるコード。
- たとえば、電話番号を送らなければならないのにtextが送られたときなど。

401 Unauthorized

- ユーザがその要請を進めるには、まずログインをしたり、会員加入をしたり等が必要であることを示そうとするときに用いられるコード。

403 Forbidden

- ユーザーが当該要請に対する権限がないという意味。
- 例えば、課金を行ったユーザーにしか見られないデータをリクエストしたときなど。

404 Not Found

- 要請されたuriが存在しないという意味

``` 
http -v google.com/no-such-uri

GET /no-such-uri HTTP/1.1
Accept: */*
Accept-Encoding: gzip, deflate
Connection: keep-alive
Host: google.com
User-Agent: HTTPie/0.9.3

HTTP/1.1 404 Not Found
Content-Length: 1572
Content-Type: text/html; charset=UTF-8
Date: Mon, 20 Aug 2018 08:46:48 GMT
Referrer-Policy: no-referrer
```

500 Internal Server Error

- サーバでエラーが出たときに使用されるコード。
- API開発を行うバックアンド開発者が嫌うコード。


# 備考

* 特にありません。