Recomendados
Mais conteúdo relacionado
Semelhante a HTTP を肌で感じる
HTTP を肌で感じる
- 2. 今日話すこと HTTP (Hypertext Transfer Protocol) (HTTP/2 は話しません) 肌で感じるためのデモの方法 2
- 3. 思い立った経緯 以前、挙動がややこしいBFCache (Back‑Forward Cache) の挙動 確認のための検証用コードをに書いた 検証用コードのためにミニマルにHTTP サーバーとレスポンスヘッ ダ―を操作できるシステムが必要だった → シェルスクリプトとnc コマンドを利用 コレ、教育目的にかなりいいのでは？（要検証） 3
- 6. HTTP Hypertext Transfer Protocol とは、HTMLなどのコンテンツの送受 信に用いられる通信プロトコルである。主としてWorld Wide Web において、WebブラウザとWebサーバとの間での転送に用いられ る。 ‑‑ Wikipedia より 利用用途が拡大して、ブラウザ以外による通信にも利用されることが増 えましたね。 6
- 7. では、実際のHTTP はどんなプロトコルなのか Wikipedia 記載のHTTP/1.0 のリクエスト GET /index.html HTTP/1.0 これをnc コマンドで投げる 7
- 8. (補足: nc コマンドとは) もしくは netcat 任意のTCP/UDP コネクションの接続要求、受け付けができる 8
- 9. HTTP リクエストしてみる $ docker container run ‐d ‐‐name http‐nc‐demo > ‐p 8080:80 nginx:stable‐alpine # デモ用 HTTP サーバー $ nc localhost 8080 localhost のTCP 8080 にHTTP サーバーを立ち上げる(手段不問) nc でlocalhost のTCP 8080 に接続 TCP が確立し、ターミナルへの入力が送信内容となる HTTP はテキストベースのプロトコルなので、手入力で通信を記述で きる！ 9
- 11. HTTP リクエストの解説 GET /index.html HTTP/1.0 最後の空行: HTTP は以下の構造となるため リクエストライン: 先頭行 GET : メソッド( GET / POST / HEAD など) /index.html : リクエストURI (http://example.com /example.html ← この部分) HTTP/1.0 : HTTP バージョン ヘッダー部(何行でも) : 今回は空 空行 Body 部: 今回は空 11
- 12. HTTP レスポンスの解説 HTTP/1.1 200 OK Server: nginx/1.10.2 (中略) Accept‐Ranges: bytes <!DOCTYPE html> (以下略) ステータスライン: 先頭行 HTTP/1.1 : HTTP バージョン 200 : ステータスコード OK : 説明句(任意のテキスト) ヘッダー部(何行でも) : Server: ... や Accept‐... など 空行 Body 部: <!DOCTYPE html>... 12
- 13. HTTP レスポンスしてみる $ nc ‐l 8081 localhost のTCP 8081 にHTTP サーバーを立ち上げる(by nc ) Web ブラウザでlocalhost の8081 にアクセス TCP が確立し、ターミナルへの入力が送信内容となる ブラウザ側がタイムアウトする前にレスポンスを打ち込む！ 13
- 15. 素晴らしい！！！ 15
- 16. ここまで HTTP とは何かを知った HTTP レスポンス/リクエストの簡単なフォーマットを知った 自由にHTTP リクエストor レスポンスを作る手段を手に入れた 16
- 19. Connection: Keep‑Alive TCP 接続を切らずに、後続のHTTP リクエスト/レスポンスを伝送する HTTP/1.1 ではデフォルトで接続が持続する 切りたいときは Connection: close を指定する 19
- 20. $ nc localhost 8080 GET / HTTP/1.1 Host: localhost (HTTP/1.1 ではHost ヘッダーは必須) HTTP/1.1 200 OK Server: nginx/1.10.2 (以下略) レスポンスが帰ってくるが、 nc は終了しない → 再度、リクエスト・レスポンス ( Connection: close を付ける場合も試す) 20
- 21. 302 リダイレクト ステータスコード302 を返すと同時に、 Location ヘッダーで指定先にリダイレクトさせることができる 21
- 25. response2 をgzip 圧縮 $ gzip ‐c response2 > response2.gz gzip 用のヘッダーを作成 HTTP/1.1 200 Ok Connection: close Content‐Encoding: gzip response3 として保存 Body 部(gzip データ) を結合 $ cat response2.gz >> response3 以下を起動して、ブラウザからアクセスしてみる $ cat response3 | nc ‐l 8081 $ open http://localhost:8081 25