Python アドバンストシリーズチュートリアル: HTTP プロトコルと静的 Web サーバーの開発

学習目標

1. HTTP プロトコルの基本概念を理解する

2. HTTPリクエストメッセージとレスポンスメッセージを使いこなす

3. 開発者ツールを使用して HTTP プロトコルの通信プロセスを表示する方法を学びます

4. Python に付属する静的 Web サーバーを構築する

5. Python 静的 Web サーバー開発をマスターする

1. HTTPプロトコルの概要

1. ウェブサイトのURL

URLはURLとも呼ばれ、URLの英語のフルスペルは(Uniform Resoure Locator)、Uniform Resource Locatorを意味し、ネットワークリソースのアドレスという理解が一般的です。URLアドレス：https://www.itcast.com/18/1122/10/E178J2O4000189FH.html

2. URLの構成

3.HTTPプロトコル

☆シーンインポート

まずシナリオを見てみましょう。

ブラウザとWebサーバー間の通信プロセスにおいて、そのデータ形式にルールはありますか？また、任意に設定できるのでしょうか？回答: いいえ、ブラウザと Web サーバー間の通信では、HTTP プロトコルを使用して、ブラウザと Web サーバー間で通信されるデータの形式を指定する必要があります。

☆HTTPプロトコルとは何ですか？

HTTP プロトコルの正式名は (HyperText Transfer Protocol) で、翻訳するとハイパーテキスト転送プロトコルになります。ハイパーテキストとは、テキストデータをベースにした非テキストデータのことを指します。非テキストデータには、写真、音楽、ビデオなどが含まれ、これらの非テキストデータをリンクを使用して読み込んで表示します。一般に、ハイパーテキストはリンクを指します。次の図に示すように、テキストデータは、通常 Web ページデータと呼ばれるものでもあります。

☆HTTPプロトコルの概念と機能

HTTP プロトコルの作成者は Tim Berners-Lee で、1991 年に設計されました。HTTP プロトコルは Web ページデータを送信するために設計されましたが、現在ではあらゆる種類のデータの送信が可能になっています。HTTP プロトコル形式でのデータの送信は、TCP の送信プロトコルに基づいており、データを送信する前に接続を確立する必要があります。TCP 伝送プロトコルはネットワーク内で伝送されるデータのセキュリティを確保するために使用され、HTTP プロトコルはこれらのデータの特定の形式を指定するために使用されます。

注: HTTP プロトコルで規定されているデータ形式は、ブラウザと Web サーバー間の通信データの形式であり、ブラウザと Web サーバー間の通信には HTTP プロトコルが必要です。

☆ブラウザがWebサーバーにアクセスする過程

2、HTTPリクエストメッセージとレスポンスメッセージ

1.HTTPリクエストメッセージ

最も一般的な HTTP リクエストメッセージは 2 つあります。 ① GET リクエストメッセージ ② POST リクエストメッセージ GET: Web サーバーのデータを取得 POST: Web サーバーにデータを送信

2. GETリクエストメッセージのフォーマット

---- リクエストライン ----
GET /wp-content/uploads/2020/12/zm.svg HTTP/1.1 # GET リクエストメソッドリクエストリソースパス HTTPプロトコルバージョン
---- リクエストヘッダ -----
ホスト: www.itcast.cn # サーバーのホストアドレスとポート番号。デフォルトは 80 です。
Connection: keep-alive # サーバーとの接続を長時間維持します。
Upgrade-Insecure-Requests: 1 # ブラウザーに安全でないリクエストをアップグレードさせます。 https を使用して
ユーザーエージェントをリクエストします。 Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_4) AppleWebKit/537.36 (KHTML、Gecko など) Chrome/69.0.3497.100 Safari/537.36 # ユーザーエージェント (クライアントの名前) 受け入れます: text/html,application/
xhtml +xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8 # 許容可能なデータ型 Accept-Encoding: gzip, deflate # 許容可能な圧縮形式 Accept-言語
:
zh -CN,zh;q=0.9 #使用可能な言語
Cookie: pgv_pvi=1246921728; #ログインユーザーの識別
---- 空行 ----

3. GETリクエストメッセージの解析

GET / HTTP/1.1\r\n

ホスト: www.itcast.cn\r\n
接続: キープアライブ\r\n
安全でないアップグレード要求: 1\r\n
ユーザーエージェント: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_4) AppleWebKit/537.36 (KHTML、Gecko など) Chrome/69.0.3497.100 Safari/537.36\r\n
受け入れる: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp ,image/apng,*/*;q=0.8\r\n
受け入れエンコーディング: gzip、deflate\r\n
受け入れ言語: zh-CN,zh;q=0.9\r\n
Cookie: pgv_pvi=1246921728; \r\n

\r\n (リクエストヘッダ情報の後に省略できない'\r\n'が別途あります) => 空行

注: データの各項目の間に \r\n を使用します。HTTP リクエストでは、各オプションの終了後にラベル \r\n (行の終わりを表す) をその後ろに追加する必要があります

Windows システムでは、改行は \n を使用して実装されます。ただし、Linux および Unix システムでは、\r\n を使用して改行を実装する必要があります。

4. POSTリクエストのメッセージフォーマット

---- リクエスト行 ----
POST /xmweb?host=mail.itcast.cn&_t=1542884567319 HTTP/1.1 # POST リクエストメソッドリクエストリソースパス HTTP プロトコルバージョン
---- リクエストヘッダ ----
ホスト: メール。 itcast.cn # サーバーのホストアドレスとポート番号、デフォルトは 80
Connection: keep-alive # サーバーとの接続を長時間維持します
Content-Type: application/x-www-form-urlencoded # 要求された内容をサーバーに伝えますデータ型
ユーザーエージェント: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_4) AppleWebKit/537.36 (KHTML、Gecko など) Chrome/69.0.3497.100 Safari/537.36 # クライアントの名前 ---- 空行 ----
-- --
リクエスト本文 ----
username=hello&pass=hello # リクエストパラメータ

5. POSTリクエストメッセージの解析

POST /xmweb?host=mail.itcast.cn&_t=1542884567319 HTTP/1.1\r\n
ホスト: mail.itcast.cn\r\n
接続: キープアライブ\r\n
コンテンツタイプ: application/x-www- form-urlencoded\r\n
ユーザーエージェント: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_4) AppleWebKit/537.36 (KHTML、Gecko など) Chrome/69.0.3497.100 Safari/537.36\r\n \r\n(
requestヘッダー情報の後には '\r\n' が 1 つありますが、これは省略できません)
username=hello&pass=hello

注: 各データの間に \r\n を使用して終了します

6. GET および POST リクエストメッセージの概要

① HTTP リクエストメッセージは、リクエストライン、リクエストヘッダ、空行、リクエストボディの 4 つの部分で構成されます。

② リクエスト行は、リクエストメソッド、リクエストリソースパス、HTTPプロトコルバージョン（1.1または2.0）の3つの部分で構成されます。

③ GET モードのリクエストメッセージにはリクエストボディがなく、リクエスト行、リクエストヘッダー、空行のみが含まれます。

④ POST リクエストメッセージは、リクエストライン、リクエストヘッダ、空行、リクエストボディの 4 つの部分で構成されます。注: POST メソッドではリクエスト本文を許可できませんが、この形式はまれです。

7. HTTP 応答メッセージの分析 (強調)

--- レスポンス行/ステータス行 ---
HTTP/1.1 200 OK # HTTP プロトコルのバージョンステータスコードステータスの説明
--- レスポンスヘッダ ---
Server: Tengine # サーバー名
Content-Type: text/html; charset=UTF- 8 # コンテンツタイプ (応答データタイプ、画像/png)
接続: keep-alive # クライアントとの接続を長時間維持する
日付: Fri, 23 Nov 2018 02:01:05 GMT # サーバーの応答時間
---空白行- --
-- レスポンスボディ ---
<!DOCTYPE html><html lang="ja"> …</html> # クライアント（htmlページ）のデータを応答

応答ヘッダー情報は主に、ブラウザーのクライアントに、返されるデータの処理方法を指示します。

8. HTTP レスポンスのステータスコード

Web サーバーの応答ステータスを示すために使用される 3 桁のコードです。

ステータスコード	説明する
200	サーバーはリクエストを正常に処理しました
400	不正なリクエストです。リクエストのアドレスまたはパラメータが間違っています。
404	要求されたリソースはサーバー上に存在しません
500 (サーバー側例外)	サーバーの内部ソースコードでエラーが発生しました

3. HTTPプロトコルの通信プロセスを表示する

1. Google Chrome 開発者ツール

Google Chrome ブラウザをインストールし、Windows および Linux プラットフォームで F12 または Ctrl+Shift+I を押して開発者ツールを表示します。Mac で「表示 -> 開発者 ->」開発者ツールを選択するか、alt+command+ のショートカットキーを直接使用します。 i 、もう 1 つのマルチプラットフォーム共通操作は、Web ページを右クリックしてチェックを選択することです。

ヒント: 開発者ツールは、Web ページのレイアウトを表示したり、JS コードをデバッグしたりするための強力なツールでもあります。

2. HTTPプロトコルの通信処理

注: ブラウザとサーバー間のすべてのデータ通信は、リクエストと応答のペアで発生し、各リクエストと応答は HTTP プロトコルの形式に準拠している必要があります。

3. Google Chrome 開発者ツールの使用

ステップ 1: 各タブの機能を理解する

ステップ 2: ネットワークを使用して HTTP リクエストを送信する

ステップ 3: HTTP プロトコルの通信プロセスのリクエストヘッダーとリクエストヘッダー情報を表示する

レスポンスヘッダー、レスポンスボディ情報

4. まとめ

Google Chrome のデベロッパーツールは、http プロトコルの通信プロセスを表示するための強力なツールです。[ネットワーク] タブのオプションを使用して、各リクエストとレスポンスの通信プロセスを表示できます。デベロッパーツールを呼び出す一般的な方法は、次のとおりです。 Web ページをクリックしてチェックを選択します。ヘッダーオプションは 3 つの部分で構成されます。

① 一般：主な情報

② Response Headers: レスポンスヘッダ

③ リクエストヘッダー: リクエストヘッダーの応答オプションは、応答本文の情報を表示します。

4. Python に付属する静的 Web サーバーを構築する

1. 静的 Web サーバーとは何ですか

静的ドキュメント (html/css/js/pictures/audio/video) を要求元のブラウザーに提供できるプログラム。通常、Baidu のニュースデータを閲覧するとき、ニュースデータは毎日変更されるため、アクセスするページは動的ですが、開発するものは静的であり、毎日独自の静的 Web サーバーにアクセスします。ページ上のデータは変化しません。変更します。

2. Python に付属する静的 Web サーバーを構築する

Linuxの作成方法：

Windowsの作成方法：

① フォルダーを作成し、すべてのリソースファイルをこのフォルダーに置きます

② DOS ウィンドウで cd コマンドを使用して、このディレクトリに切り替えます。

③ python -m コマンドを使用して静的 Web サーバーを作成します

python -m http.server 9000

-m は、パッケージ内のモジュールを実行することを意味します。このコマンドを実行するときは、静的ファイルを指定するディレクトリに入る必要があります。その後、ブラウザを通じて対応する HTML ファイルにアクセスできるため、静的 Web サーバーが設定されます上。

④ Web 静的サーバーにアクセスします。

HTTP 通信プロセスを表示します。

3. まとめ

静的 Web サーバーは、リクエストを送信するブラウザーに静的ドキュメントを提供するプログラムです。Python に付属する Web サーバーを構築するには、コマンド python –m http.server ポート番号を使用します。ポート番号が指定されていない場合、デフォルトは8000です

強調！: 応答本文に含まれるデータがブラウザに送信され、ブラウザはレンダリング後に特定のページを生成します。

5. Python を使用して独自の Web サーバーを開発する

Webサーバー = TCPサーバー（7ステップ） + HTTPプロトコル（リクエスト、レスポンス）

1. 開発手順

2.固定ページのデータを返却する

importソケット

if __name__ == '__main__':
# 1. ソケットを作成します
tcp_server_socket =ソケット.socket(socket.AF_INET,ソケット.SOCK_STREAM)
tcp_server_socket.setsockopt(socket.SOL_SOCKET,ソケット.SO_REUSEADDR, True)
# 2.IPとポートをバインドします
tcp_server_socket.bind(("", 8080)) # 3. True のときにtcp_server_socket.listen(128)
のリスニングをセットアップします。 # 4. 接続を確立しますclient_socket, client_addr = tcp_server_socket.accept() client_request_data = client_socket.recv(1024).decode () print(client_request_data) with open("html/index.html", "rb") as f: file_data = f.read() # 応答行response_line = "HTTP/1.1 200 OK\r\n" # 応答ヘッダー応答ヘッダー = "サーバー:pwb\r\n"

# レスポンスボディ
response_body = file_data

# レスポンスデータ
response_data = (response_line + response_header + "\r\n").encode() + response_body

# 5. データの送信
client_socket.send(response_data)
# 6. クライアントソケット接続 client_socket を閉じます
。近い（）

3. 指定したページのデータを返す

分析手順: ① ユーザーが要求したリソースのパスを取得します。

② 要求されたリソースのパスに従い、指定されたファイルのデータを読み込みます

③指定されたファイルデータの応答メッセージを組み立ててブラウザに送信

④ 要求されたファイルがサーバー上に存在しないことを確認し、404 ステータス応答メッセージを組み立ててブラウザに送信し、ユーザーが要求したリソースのパスを取得します。

request_list = client_request_data.split(" ", maxsplit=2)
request_path = request_list[1] # /gdp.html
if request_path == "/":
# ユーザーがリソースパスを指定しない場合、デフォルトでアクセスされるデータはホームページのデータ
request_path = "/index.html"

指定されたページのデータを取得します。

# 指定されたファイルデータを読み取る
# rb を使用する理由は、ブラウザーが
open("html/" + request_path, "rb") をファイルとして含む画像も要求する場合があるためです。
# ファイルデータを読み取る
file_data = file.read()

指定されたページデータの応答メッセージを組み立てます。

# 応答行
response_line = "HTTP/1.1 200 OK\r\n"
# 応答ヘッダ
response_header = "Server: PWS1.0\r\nContent-Type: text/html;charset=utf-8\r\n" #
応答ボディ
response_body = file_data
# 応答メッセージのデータを連結します
response_data = (response_line + response_header + "\r\n").encode("utf-8") + response_body #
応答メッセージのデータを送信
client_socket.send(response_data)
client_socket.close ()

404 ページデータの応答メッセージを組み立てます。

try:
# 指定されたファイルを開きます。コードは省略されます...
例外として e:
response_line = 'HTTP/1.1 404 Not Found\r\n'
response_header = 'Server: PWS1.0\r\nContent-Type: text /html; charset=utf-8\r\n'
response_body = '<h1>アクセスしている Web ページはもう存在しません</h1>'.encode('utf-8')
response_data = (response_line + response_header + ' \r\n').encode('utf-8') + response_body
# 404 応答メッセージデータを送信
client_socket.send(response_data)
else:
# 指定されたページの応答メッセージデータを送信します。コードは省略されます...
最後に:
client_socket .close()

6. FastAPI フレームワーク

学習目標

FastAPIとは何かを知ることができる
FastAPIのインストール方法を知ることができる
FastAPIの基本的な使い方をマスターできる
FastAPIを使いこなして指定した複数のWebページにアクセスできるようにする

1. FastAPIとは

FastAPI は、最新の高速 (高パフォーマンス) Python Web フレームワークであり、標準の Python タイプヒントに基づいて、Python3.6 以降を使用して API を構築するための Web フレームワークです。

FastAPI は、簡単に言うと、Web 開発に必要なコードをすべて簡素化するもので、マルチタスクやルーティングデコレータなどのさまざまな複雑なコードを自分で実装する必要はなく、FastAPI が提供する関数を呼び出すだけで済みます。 . これまで多くの複雑なコードを必要としていた機能を実現できます。

FastAPIの特徴

高速パフォーマンス: NodeJS や Go に匹敵する高いパフォーマンス
迅速な開発: 機能の開発が約 200% ～ 300% 高速化されます。
バグの減少:
バグの減少: 開発者が引き起こす傾向にあるエラーの 40% を削減します。
直感的: 完璧な編集サポート
シンプル: 使いやすく、学びやすく、ドキュメントを読む時間が短縮されます。
簡潔なコード: コードの重複を大幅に削減します。各パラメータで複数の関数を宣言してバグの発生を減らすことができます。
標準化: API ベースで完全な互換性のある開発標準: OpenAPI (旧名 Swagger) および JSON スキーマ

環境を構築する

Python環境：Python 3.6以降

fastapi インストール

☆取り付け方法１：

fastapiをインストールする
pip インストール fastapi
運用に使用する場合は、Uvicorn や Hypercorn などの ASGI サーバーも必要になります。
pip インストール uvicorn

☆インストール方法 2: 1) [ファイル] -> [設定] を選択します。

2) 対応するプロジェクトのプロジェクトインタープリターを選択します -> pygame を選択します (pygame と入力して検索すると時間を節約できます) -> パッケージのインストールボタン -> プロジェクトが pygame パッケージをインストールするのを待ちます (数分から 10 分かかる場合があります)分) -> return if pygame パッケージ情報があれば、プロジェクトの設定が成功したことを意味します

2. FastAPIの基本的な使い方

機能要件:

サーバーを構築する
HTMLページを返す

基本的な手順:

インポートモジュール
FastAPI フレームワークオブジェクトの作成
@app ルーティングデコレーターを介してデータを送受信する
サーバーを実行する

コード：

# fastapi から FastAPI モジュールをインポート
import FastAPI
# 応答メッセージをインポート
fastapi からの応答モジュール import Response
# サーバーをインポート uvicorn module
import uvicorn

# FastAPI フレームワークオブジェクトを作成
app = FastAPI()

# @app ルーティングデコレータを介してデータを送受信
# @app.get (パラメータ) : getメソッドに従ってリクエストデータを受け入れる
# リクエストされたリソースのURLパス
@app.get("/index.html")
def main():
with open("source/html/index.html" ) as f:
data = f.read()
# return 応答データを返す
# Response(content=data, media_type="text/html"
# パラメータ 1: 応答データ
# パラメータ 2: データ形式
return Response(content=data, media_type ="text/html ")

# サーバーの実行
# パラメータ 1: フレームワークオブジェクト
# パラメータ 2: IP アドレス
# パラメータ 3: ポート番号
uvicorn.run(アプリ、ホスト = "127.0.0.1"、ポート = 8000)

3. FastAPI を介して指定された複数の Web ページにアクセスする

ルートデコレータの役割:

実際、ルートデコレータを使用すると、Web ページを関数に対応させることができ、指定された Web ページにアクセスできます。

# fastapi から FastAPI モジュールをインポート
import FastAPI
# 応答メッセージをインポート
fastapi からの応答モジュール import Response
# サーバーをインポート uvicorn module
import uvicorn

# FastAPI フレームワークオブジェクトを作成
app = FastAPI()

# @app ルーティングデコレータを介してデータを送受信
# @app.get (パラメータ) : getメソッドに従ってリクエストデータを受け入れる
# リクエストされたリソースのURLパス
@app.get("/index1.html")
def main():
with open("source/html/index1.html" ) as f:
data = f.read()
# return 応答データを返す
# Response(content=data, media_type="text/html"
# パラメータ 1: 応答データ
# パラメータ 2: データ形式
return Response(content=data, media_type ="text/html ")

@app.get("/index2.html")
def main():
with open("source/html/index2.html") as f:
data = f.read()
# return 応答データを返す
# Response(content=data, media_type="text/html"
# パラメータ 1: 応答データ
# パラメータ 2: データ形式
return Response(content=data, media_type="text/ html")

# 実行サーバー
# パラメータ 1: フレームオブジェクト
# パラメータ 2: IP アドレス
# パラメータ 3: ポート番号
uvicorn.run(app, host="127.0.0.1", port=8000)

4. まとめ

基本的な手順:
インポートモジュール
FastAPI フレームワークオブジェクトの作成
@app ルーティングデコレーターを介してデータを送受信する
サーバーを実行する