Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
History of HTTP
Search
cupper
September 13, 2021
Technology
100
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
History of HTTP
cupper
September 13, 2021
More Decks by cupper
See All by cupper
kintoneでAWSリソースを管理する
cupperservice
0
120
Let's get started with Scala
cupperservice
0
420
All in Scala
cupperservice
0
59
Recommendation_of_Gatling.pdf
cupperservice
2
580
Golang on AWS
cupperservice
0
49
What's scala.js?
cupperservice
0
63
How to work in local
cupperservice
0
64
Make a REST Server on Golang
cupperservice
0
97
Why do you use JavaScript
cupperservice
0
41
Other Decks in Technology
See All in Technology
Snowflake Horizon Catalog と Apache Iceberg で作る オープンなデータ基盤
kitagawaz
0
400
並行性の問題を防げ!実践トランザクション入門
occhi
0
250
人にやさしく、AIにやさしく、書き手を選ばないIaCのガードレール再考 / Rethinking IaC Guardrails for Humans and AI Alike
kohbis
6
2.1k
行動するAIのためのオントロジー | DevRev — Encraft #26.pdf
dvrv_tknrszk
2
700
AI駆動開発、viviONの1年 ── うまくいったこと・いかなかったこと
vivion
0
150
生成AIを使って「人が」考える技術 ― AI時代の人機共想と実践ノウハウ|UNITT AC2026
ishiirikie
0
530
The seven pitfalls of AI (revised version)
ufried
0
230
サーバーフルコンピューティング?AWS Lambda
iwatatomoya
1
200
[2026 Oracle Technical Deep Dive] AI時代のデータベース基盤をどう選ぶ? Exadata Database Serviceの選択肢と使い分け (2026年9月17日開催)
oracle4engineer
PRO
0
210
2026-10-01_MagicPod_QAハーネスエンジニアリングとQA組織の未来像
ynisqa1988
1
470
私の推しは「聞いてから進む」AIです -AI-DLCに一人でアプリを作らせた話
yama3133
1
160
OpenSharing について熱く語る〜AI アセットの共有について〜
kameitomohiro
0
180
Featured
See All Featured
Intergalactic Javascript Robots from Outer Space
tanoku
273
27k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
49
3.6k
16th Malabo Montpellier Forum Presentation
akademiya2063
PRO
0
390
Being A Developer After 40
akosma
91
590k
Noah Learner - AI + Me: how we built a GSC Bulk Export data pipeline
techseoconnect
PRO
0
450
How to Get Subject Matter Experts Bought In and Actively Contributing to SEO & PR Initiatives.
livdayseo
0
200
The Art of Programming - Codeland 2020
erikaheidi
57
14k
Designing Experiences People Love
moore
143
24k
Data-driven link building: lessons from a $708K investment (BrightonSEO talk)
szymonslowik
1
1.3k
How to optimise 3,500 product descriptions for ecommerce in one day using ChatGPT
katarinadahlin
PRO
3
3.9k
Everyday Curiosity
cassininazir
0
340
How to build an LLM SEO readiness audit: a practical framework
nmsamuel
2
930
Transcript
HTTPの歴史を振り返る ネットワーク入門勉強会 2021.09.13 Kawashima Kazuhisa
自己紹介 名前 :川嶋 一寿(かわしま かずひさ) 生息地 :静岡市(Slackの静岡チャネル) 趣味 :ジョギング、温泉、酒 仕事
: • ゆめみのサーバサイドエンジニア • 専門学校講師(ネットワークとクラウドの授業を担当) • Scalaの初心者向けの記事を執筆(Scalapedia) Twitter :@cupperservice
HTTPとは Hypertext Transfer Protocol • HTMLなどのテキストによって記述されたWebページ等のコンテン ツの送受信に使用するプロトコル • サーバはクライアントの状態を保持しない/ステートレスなプロトコ ル
• トランスポート層にTCPを使用する。
HTTPの属する層 OSI参照モデル TCP/IPプロトコルスタック アプリケーション層 アプリケーション層 プレゼンテーション層 セッション層 トランスポート層 トランスポート層 ネットワーク層
インターネット層 データリンク層 リンク層 物理層 HTTP TCP UDP IP
HTTPのバージョン HTTP/0.9 HTTP/1.0 HTTP/1.1 HTTP/2 HTTP/3 1995年 1990年 2000年 2005年
2010年 2015年 2020年 多くの拡張がされた ・Cookie ・SSL/TLS ・WebSocket ・CORS ...
HTTP/0.9 • ドキュメント化された最初のHTTPプロトコル • サーバ上のコンテンツを取得するだけの単純なもの • ワンラインプロトコル GET /index.html <html>
… </html>
HTTP/1.0 • 1996年5月にRFC 1945として発表 • GET以外のメソッドが追加 • プロトコルバージョンを追加 • ヘッダーを追加
• レスポンスにステータスを追加 • HTML以外の文章を転送できるように
HTTP/1.0 例 GET /index.html HTTP/1.0 User-Agent: Mozilla/2.02 [fr] (WinNT; I)
HTTP/1.0 200 OK Content-Type: text/html <html> … </html>
HTTP/1.0 メソッド メソッド 役割 GET 指定されたオブジェクトを取得 HEAD 指定されたオブジェクトのメタ情報(ヘッダー)を取得 PUT オブジェクトをサーバに蓄積
POST オブジェクトをサーバに送信 DELETE リソースを削除 LINK リソースと他のリソースの関係を確立する UNLINK リソースと他のリソースの関係を削除する
HTTP/1.0 ヘッダー • General-Header 一般的な情報(Connection, Forwarded, ...) • Request-Header リクエストについての付加的な情報(User-Agent,
If-Modified-Since, ...) • Response-Header レスポンスについての付加的な情報(Server, Retry−After, ...) • Object-Header オブジェクトの情報(Content-Length, Content-Type, ...)
HTTP/1.0 ステータス • 1xx: 未定義 • 2xx: 成功 • 3xx:
リダイレクション • 4xx: クライアントエラー • 5xx: サーバーエラー
HTTP/1.0 問題点 HTTP/1.0で追加された機能は、試行錯誤の結果生まれたもの 標準化されたものではない サーバとブラウザの間での相互運用性の問題が多く発生した
HTTP/1.1 • 1997年1月にRFC2068として発表 • コネクションの再利用が可能となった • パイプライン機能を追加 • Chunked形式のレスポンスを追加 •
新たなキャッシュ制御の仕組を追加 • 言語 / エンコーディングのコンテンツネゴシエーションを追加 • サーバのコロケーションが可能となった
HTTP/1.1 例 GET /index.html HTTP/1.1 User-Agent: Mozilla/2.02 [fr] (WinNT; I)
Connection: keep-alive HTTP/1.1 200 OK Content-Type: text/html Connection: keep-alive <html> … </html> GET /images/hoge.jpg HTTP/1.1 User-Agent: Mozilla/2.02 [fr] (WinNT; I) Connection: keep-alive ...
HTTP/1.1 メソッド メソッド 役割 OPTIONS 対象リソースの通信オプションを記述 GET リソースを取得 HEAD リソースのメタ情報(ヘッダー)を取得
PUT 新しいリソースを作成するか、サーバのリソースを置き換える POST サーバにデータを送信 PATCH リソースの部分的な変更 DELETE リソースを削除 TRACE 対象リソースまでのループバックテストをする CONNECT クライアント、サーバ間の接続を開始する
コネクション
HTTPに関する関連技術
Cookie • HTTP -> ステートレスな通信 • Cookie -> ステートフルな情報を持たせる Request
HTTP/1.1 200 OK Set-Cookie: key=value ... GET /hogehoge HTTP/1.1 Cookie: key=value ...
SSL / TLS TCP/IPの上の層に追加された暗号化レイヤー Client Hello Server Hello Server Certificate
Server Key Exchange Certificate Request Server Hello Done Client Certificate Client Key Exchange Certificate Verified Change Cipher Exchange Finished Change Cipher Spec Finished
リアルタイムなWebアプリを実現する • ポーリング • Comet • Server Sent Events •
WebSocket
ポーリング クライアントから一定間隔でサーバにデータを取得しに行く Request Response 終わった? まだだよ 終わった? 終わった 終わった? まだだよ
サーバの処理が完了するまで 一定間隔でサーバに問い合 わせる サーバの処理時間
Comet Request Response コネクションを張りっぱなしに する サーバの処理時間 レスポンスを受け取ったら、すぐにHTTPコネクションを張り直し、サーバ からの応答を待つ 終わった
Server Sent Events 1つのHTTPコネクションで複数のデータを返す Request chunked サーバから送信されたデータ を受け取る 任意のタイミングでク ライアントにデータを
送信する Content-Type: text/event-steram chunked chunked
WebSocket Opening handshake(HTTP upgrade) Opening handshake(Switching Protocols) 送信 送信 送信
送信 送信 送信 任意のタイミングでサー バにデータを送信する WebSocketにスイッチ後は双方向に通信できる 任意のタイミングでク ライアントにデータを 送信する
キュリティモデル • Same-Origin Policy • CORS
Same-Origin Policy あるOriginから読み込まれたドキュメントやスクリプトから他のOriginに あるリソースへのアクセスを制限する www.hogehoge.com www.poupou.com コンテンツA Origin(www.hogehoge.com)から取得 したコンテンツAから 別のOrigin(www.poupou.com)には、ア
クセスできない
Origin http://www.hogehoge.com/index.htmlとの比較 URL Same Origin http://www.hogehoge.com/path1/hoge.html o 違いはパスのみ http://www.hogehoge.com:80/path1/hoge.html o
違いはパスのみ http://www.hogehoge.com:8080/path1/hoge.html x ポート番号が違う https://www.hogehoge.com/path1/hoge.html x プロトコルが違う http://www.poupou.com/path1/hoge.html x ホストが違う
CORS(Cross-Origin Resource Sharing) 異なるOriginへのアクセス権を与える仕組み www.hogehoge.com www.poupou.com コンテンツA Origin(www.hogehoge.com)から 取得したコンテンツAから 別のOrigin(www.poupou.com)に
Originヘッダーを付けてアクセス Origin: http://www.hogehoge.com Access-Control-Allow-Origin: http://www.hogehoge.com Origin(www.hogehoge.com)から 取得したコンテンツAからのアクセスを 許可する
Preflight Request OPTIONSを使用して実際のリクエストが送信可能かチェックする OPTIONS /doc HTTP/1.1 Origin http://www.hogehoge.com Access-Control-Request-Method: POST
Access-Control-Request-Headers: Content-Type HTTP/1.1 204 No Content Access-Control-Allow-Origin: http://www/hogehoge.com Access-Control-Allow-Methods: POST Access-Control-Allow-Headers: Content-Type Access-Control-Max-Age: 86400 POST /doc HTTP/1.1 Content-Type: application/json Origin: http://www.hogehoge.com ... HTTP/1.1 200 OK Access-Control-Allow-Origin: http://www/hogehoge.com Content-Type: application/json ... Preflight Requesst Main Requesst
HTTP/2 HTTPのメッセージの転送を効率化し、パフォーマンスを向上 • バイナリでの送受信 • 1つのコネクションでHTTPリクエスト / レスポンスを多重化 • ヘッダーの圧縮
• 優先順位 • サーバプッシュ
HTTP/2 ストリーム 1つのTCPコネクションで複数のHTTPリクエスト / レスポンスをやり取り する ↑を管理するための概念をストリームと呼ぶ TCPコネクション Stream (id=1)
HTTP リクエスト HTTP レスポンス Stream (id=3) HTTP リクエスト HTTP レスポンス
HTTP/2 フレーム HTTP2での送信の単位 / 用途ごとに10種類のタイプがある フレーム名 タイプ番号 説明 DATA 0
HTTP Bodyを転送するために使用 HEADERS 1 HTTPヘッダーを転送するために使用 PRIORITY 2 ストリームの優先順位を変更するために使用 RST_STREAM 3 エラーでストリームを終了するために使用 SETTINGS 4 コネクションに関するパラメータのやり取りをするために使用 PUSH_PROMISE 5 サーバプッシュに使用するストリームを予約するために使用 PING 6 コネクション維持のために使用 GOAWAY 7 コネクションを切断するために使用 WINDOW_UPDATE 8 フロー制御のために使用 CONTINUATION 9 サイズの大きなフレームを継続して送信するために使用
HTTP/2 フレーム HTTPメッセージはフレームに分割され、直列化して送信する HEADERS フレーム stream id=1 HEADERS フレーム stream
id=3 DATA フレーム stream id=3 HEADERS フレーム stream id=1 HEADERS フレーム stream id=3 DATA フレーム stream id=3 DATA フレーム stream id=1
HTTP/2 ネゴシエーション HTTP/2の通信を開始する方法は以下 • ALPN • HTTP1.1からアップグレード • ダイレクト
HTTP/2 ALPN RFC7301で定義されているTLS拡張を使用する方法 ClientHello ALPN extension - http/2 - http/1.1
ServerHello ALPN extension selected protocol - http/2
HTTP/2 アップグレード RFC7301で定義されているTLS拡張を使用する方法 GET / HTTP/1.1 Host: hogehoge.example.com Connection: Upgrade,
HTTP2-Settings Upgrade: h2c HTTP2-Settings: <HTTP/2 SETTINGS フレーム> HTTP/1.1 101 Switching Protocols Connection: Upgrade Upgrade: h2c
HTTP/3 - HTTP over QUIC トランスポート層にQUICを使用する(予定) 次の機会 or 他の方で話したい方
Thank you for listening!