[WEB]HTTPレスポンスとGET/POSTリクエスト

WEB

どうも。つじけ(tsujikenzo)です。このシリーズでは「ノンプログラマーによるWeb周り基礎学習」について全4回でお送りします。今日は最終回の4回目です。

前回のおさらい

前回は、「TCPとHTTPリクエスト」 ということで、TCPにおけるサーバとクライアントのファイルのやりとりで、HTTPリクエストの中身が明らかになりました。

[WEB]TCPとHTTPリクエスト
どうも。つじけ(tsujikenzo)です。このシリーズでは「ノンプログラマーによるWeb周り基礎学習」について全4回でお送りします。今日は3回目です。前回のおさらい前回は、「ネットワークとHTTP」 ということで、ネットワークは7...

今回は、「HTTPレスポンスとGET/POSTリクエスト」 をお届けします。

WebサーバーとTCPクライアントのやりとり

今回は、クライアントを「TcpClient.java」に戻して、サーバを「本物のWebサーバ」にしてファイルのやりとりを行ってみます。Webサーバから何が返ってくるでしょうか。

前回、サーバで保存された「server_recv.txt」は「ブラウザから送信されたHTTPリクエスト」でした。なので「server_recv.txt」を「client_send.txt」として、サーバに送付してみます。

接続が成功して、通信が完了すると、「server_recv.txt」が保存されますので、中身を確認してみます。

1: HTTP/1.1 200 OK
2: Date: Wed, 26 May 2021 17:47:09 GMT
3: Server: Apache/2.4.6 (Win32)
4: Last-Modified: Mon, 11 Jun 2007 11:53:14 GMT
5: ETag: "2e-432a0069dbe80"
6: Accept-Ranges: bytes
7: Content-Length: 46
8: Keep-Alive: timeout=5, max=100
9: Connection: Keep-Alive
10: Content-Type: text/html
11:
12: <h1>It works!</h1>

これが、「HTTPレスポンス」の正体です。

HTTPレスポンス

HTTPの仕様書であるRFC7230では、サーバから応答されるへのメッセージは、このように定められています。
– ステータスライン
– レスポンスヘッダ
– 空行(CR+LF)
– ペイロード本体を含むメッセージボディ(もしあれば)

前節で取得したHTTPリクエストも、このような構造になっています。

//ステータスライン
1: HTTP/1.1 200 OK
//レスポンスヘッダ
2: Date: Wed, 26 May 2021 17:47:09 GMT
3: Server: Apache/2.4.6 (Win32)
4: Last-Modified: Mon, 11 Jun 2007 11:53:14 GMT
5: ETag: "2e-432a0069dbe80"
6: Accept-Ranges: bytes
7: Content-Length: 46
8: Keep-Alive: timeout=5, max=100
9: Connection: Keep-Alive
10: Content-Type: text/html
//空行
11:
//メッセージボディ
12: <h1>It works!</h1>

ステータスライン

ステータスラインは3つの要素から成り立っています。
– HTTP/1.1・・・プロトコルバージョン(この通信で使うHTTPのバージョン)
– 200・・・状態コード(成功コードもしくはエラーコード)
– OK・・・リーズンフレーズ(状態コードの概観)

「ステータスコード」と「リーズンフレーズ」はみなさんもよく見かけると思います。「404 (Not Found)」というようなエラーコードです。

GETメソッドとPOSTメソッド

HTTPには、8種類のメソッドがあります。
– GET:ターゲットリソースの現在の表現を転送する。
– HEAD:GET と同じだが、状態行とヘッダ節のみを転送する。
– POST:要請ペイロードに対し、リソースに特有な処理を遂行する。
– PUT:ターゲットリソースの現在の表現すべてを、要請ペイロードに置換する。
– DELETE:ターゲットリソースの現在の表現すべてを、除去する。
– CONNECT:ターゲットリソースで識別されるサーバへ、トンネルを確立する。
– OPTIONS:ターゲットリソース用の通信オプションを述べる。
– TRACE:ターゲットリソースへの経路に沿ってメッセージループバックテストを遂行する。

前回、HTTPリクエストのGETメソッド(略してGETリクエストと呼ばれます)の中身を確認しました。

1: GET /index.html HTTP/1.1
2: Host: localhost:8001
3: User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.77 Safari/537.36
4: Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
5: Accept-Language: ja,en-US;q=0.9,en;q=0.8
6: Accept-Encoding: gzip, deflate
7: Connection: keep-alive

同様に、HTTPリクエストのPOSTメソッド(略してPOSTリクエストと呼ばれます)はこのような中身になります。

1: POST /hoge/ HTTP/1.1
2: Host: localhost:8080
3: Connection: keep-alive
4: Content-Length: 22
5: Cache-Control: max-age=0
6: Origin: http://localhost:8080
7: Upgrade-Insecure-Requests: 1
8: User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/54.0.2840.98 Safari/537.36
9: Content-Type: application/x-www-form-urlencoded
10: Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8
11: Referer: http://localhost:8080/hoge/
12: Accept-Encoding: gzip, deflate, br
13: Accept-Language: ja,en-US;q=0.8,en;q=0.6
14:
15: name=hoge&comment=hoge

POSTリクエストをよく見ると、GETリクエストと同様に、このような構造になっています。
– 1行目・・・リクエストライン
– 2行目以降・・・リクエストヘッダ
– 空行
– リクエストボディ(クエリストリング)

つまり、「リクエストライン」「リクエストヘッダ」「(必要に応じて)リクエストボディ」の3つを記述できれば、誰でもHTTPリクエストを作成できる ということです。

HTTPリクエストを作成するメソッド

HTTPリクエストの中身を理解しましたので、誰でもHTTPリクエストを作成できるようになりましたが、さすがに1行ずつ記述するのは大変そうです。

GASには、HTTPリクエストを作成してサーバーに送信するメソッド があります。(その他のプログラミング言語にもほとんど用意されていると思います)

それが、UrlFetchAppクラスのfetch()メソッド です。

UrlFetchApp.fetch(url, params)

引数には、以下を指定します。
– URL・・・リクエストURL
– params・・・メソッドとペイロード(メッセージボディ)を含むJSONなど

サンプルコードはこのようになります。

//GETリクエストの例
const response = UrlFetchApp.fetch('http://www.google.com/');
console.log(response.getContentText());

//POSTリクエストの例
const resumeBlob = Utilities.newBlob('Hire me!', 'text/plain', 'resume.txt');
const formData = {
'name': 'Bob Smith',
'email': 'bob@example.com',
'resume': resumeBlob
};

const options = {
'method': 'post',
'payload': formData
};

UrlFetchApp.fetch('https://httpbin.org/post', options);

paramsに渡せる[options]では、JSONやxmlなど、ペイロードのタイプを指定できます。詳しくは公式リファレンスを参考にしてください。

Class UrlFetchApp  |  Apps Script  |  Google for Developers

[補足] GETとPOSTの使われどころ

GETやHEADなどのリクエストでは、送信されるのはヘッダのみです。POSTリクエストはHTTPレスポンスと同じように「ボディ部」があり、ここに送信したいデータを記述できます。

大きなデータやファイルをサーバに送る(データベースへのデータの格納など)のによく使われますので、以下のような機能に利用されます。

  • [ HTMLフォームに手入力された一連のフィールド ]などのデータブロックを、データ取り扱い処理に供する。
  • [ 掲示板、ニュースグループ、メーリングリスト、ブログ、その他同類の記事群 ]などへ、メッセージを投函する。
  • 生成元サーバによりまだ識別されていない、新たなリソースを作成する。
  • 既存のリソースの、いくつかの表現に、データを付加する。

これは、「GETリクエストは、POSTリクエストに必要な情報を取得するためにも利用される」 と言えるでしょう。

https://developer.freee.co.jp/tutorials/first-call

GETリクエストはURLで構成されるため、ブックマークとして保存できますが、個人のパスワードを送信する必要がある場合は、POSTリクエストで送信した方がよいでしょう。

まとめ

以上で、「HTTPレスポンスとGET/POSTリクエスト」 ということで、HTTPレスポンスの構造を確認しました。

また、HTTPの8つのメソッドから、よく使う「GET/POSTリクエスト」を取り上げました。

HTTPリクエストの中身を理解することで、公式リファレンスを読む力が付きますし、メソッドを正しく使いこなすことができます。

もちろん、HTTPレスポンスも、私たちが全文を解析することはありません。取得したResponseオブジェクトを操作するメソッド を調べ、使いこなすことで、コピペコードから卒業できる日がくるでしょう。

APIやOAuthなどの技術については、またいつかブログを書きたいと思います。

参考文献

このブログを書くにあたって、こちらの書籍とサイトを参考にさせていただきました。

本当の基礎からのWebアプリケーション入門――Webサーバを作ってみよう

大変勉強になりました。ありがとうございました。

このシリーズの目次

  1. [WEB]ノンプログラマーによるWeb周り基礎学習
  2. [WEB]ネットワークとHTTP
  3. [WEB]TCPとHTTPリクエスト
  4. [WEB]HTTPレスポンスとGET/POSTリクエスト
タイトルとURLをコピーしました