Quantcast
Channel: Node.jsタグが付けられた新着記事 - Qiita
Viewing all articles
Browse latest Browse all 8866

Node.jsでHTTPメソッドを使う。

$
0
0

免責事項

この記事は初心者視点でザックリとした説明をしています。正確性に欠ける可能性がございますが、ご了承ください。「明らかに違うよ」ということがありましたら、ご指摘くださると幸いです。

環境

OS:最新版ではないMacOS
VirtualBox:5.2.26
Vagrant:2.2.6
Ubuntu:ubuntu/bionic64 v20181129.0.0

目次

  1. HTTPメソッドとは
  2. HTTPメソッドを使ってみる

1. HTTPメソッドとは

HTTPメソッド(HTTPリクエストメソッド)とは、WEBブラウザが、HTTPというルールの元に、WEBサーバーに様々な種類のお願いを出すことです。
普段、WEBページにアクセスする場合はGETメソッドが使われますが、
HTTPメソッド1.1は8種類あり、以下のようなお願いを出すことができます。

リクエストメソッド意味CRUD例(Twitterの例)
GETリソースの取得READツイートをみる
POSTリソースの追加CREATE ツイートをする
PUTリソースの更新/追加UPDATE/CREATEリツイートをする
DELETEリソースの削除DELETEツイートを消す
HEADヘッダ情報の取得××
CONNECTプロキシサーバに通信を開始してもらう××
OPTIONSサーバのオプションの確認××
TRACEリクエストがどんな経路で届いたか確認××

WEBアプリケーションを作る上では、CRUDだけを意識すれば良いらしいです。

2. HTTPメソッドを使ってみる

今回はHTTPメソッドのGET、POST、DELETEをNode.jsで作ったサーバーに対してリクエストします。
index.jsファイルを作り、以下のように記述してください。

index.js
'use strict';consthttp=require('http');constserver=http.createServer((req,res)=>{res.writeHead(200,{'Content-Type':'text/plain; charset=utf-8'});

これはサーバーを作っています。
サーバーに対してクライアントからリクエストがあったときに、リクエストを表すオブジェクトの引数 req と レスポンスを表すオブジェクトの引数 res を受け取る無名関数が呼び出されます。

関数が呼び出されたら、res.writeHead(200, ....)が実行されます。
これは200というリクエストの成功を示すステータスコードと共に、レスポンスヘッダを書き込んでいます。

レスポンスヘッダには、内容の形式(Content-Type)が、通常のテキスト(text/plain)であるという情報と、文字セット(charset)がutf-8であるという情報を書き出しています。

余談ですが、HTTPリクエストをしたら、HTTPレスポンスが返ってきます。
HTTPレスポンスは、
1. HTTPステータスライン
2. HTTPレスポンスヘッダ
3. HTTPレスポンスボディ
の3つに分かれており、それぞれには別の情報が書かれています。
今回は、その中のHTTPレスポンスヘッダに情報を書き込んでいます。

続いて、index.jsファイルに以下を追記してください。

index.js
switch(req.method){case'GET':res.write('GET '+req.url);break;case'POST':res.write('POST '+req.url);letbody='';req.on('data',(chunk)=>{body=chunk;}).on('end',()=>{console.info('['+now+'] Data posted: '+body);});break;case'DELETE':res.write('DELETE '+req.url);break;default:break;}res.end();})

req.methodにはHTTPリクエストメソッドが格納されているので、Switch文を使い、処理を分岐させています。
GETメソッドならば、そのURLをコンテンツとしてレスポンスに返して終わりです。
POSTメソッドの際は、そのURLをコンテンツとしてレスポンスに返し、さらに追加して送られてくるデータがあります。
送られたデータはchunkに格納され、それを変数bodyに入れています。
DELETEメソッドは、そのURLをコンテンツとしてレスポンスに返して終わりです。res.end()は、resのendメソッドを使いレスポンスの書き出しを終了してます。

続いて以下のようにindex.jsに追記します。

index.js
server.on('error',(e)=>{console.error('['+newDate()+'] Server Error',e);server.on('clientError',(e)=>{console.error('['+newDate()+'] Client Error',e);});constport=8000;server.listen(port,()=>{console.info('['+newDate()+'] Listening on '+port);});

次にイベントハンドラの設定です。
サーバー側でエラーイベントが発生したら、errorが呼び出されコンソールに表示されます。
クライアント側でエラーイベントが発生したら、clientErrorが呼び出されコンソールに表示されます。

constport=8000;server.listen(port,()=>{console.info('['+newDate()+'] Listening on '+port);});

はサーバーが8000番ポートでリクエストを待つという処理です。

全体でこのようなファイル構成になります。

index.js
'use strict';consthttp=require('http');constserver=http.createServer((req,res)=>{constnow=newDate();console.info('['+now+'] Requested by '+req.connection.remoteAddress);res.writeHead(200,{'Content-Type':'text/plain; charset=utf-8'});switch(req.method){case'GET':res.write('GET '+req.url);break;case'POST':res.write('POST '+req.url);letbody='';req.on('data',(chunk)=>{body=chunk;}).on('end',()=>{console.info('['+now+'] Data posted: '+body);});break;case'DELETE':res.write('DELETE '+req.url);break;default:break;}res.end();})server.on('error',(e)=>{console.error('['+newDate()+'] Server Error',e);})server.on('clientError',(e)=>{console.error('['+newDate()+'] Client Error',e);});constport=8000;server.listen(port,()=>{console.info('['+newDate()+'] Listening on '+port);});

確認を行う。

それでは、GET、POST、DELETEのHTTPリクエストメソッドが適切に送られるかの確認を行います。
コンソールを2つ立ち上げ、片方をサーバー側、もう片方をクライアント側とします。

サーバー側のコンソールで以下のようにサーバーを立ち上げます。

サーバー
$ node index.js
> [Wed Nov 06 2019 15:59:55 GMT+0900 (GMT+09:00)] Listening on 8000
GETメソッド
クライアント
$ curl -X GET http://localhost:8000
> GET /
POSTメソッド

POSTメソッドは-dオプションをつけて、情報を送ることができます。

クライアント
$ curl -X POST -d 'こんにちは' http://localhost:8000
> POST /

以下のように送った内容がサーバー側に表示されます。

サーバー
[Wed Nov 06 2019 16:44:30 GMT+0900 (GMT+09:00)] Data posted: こんにちは
DELETEメソッド
クライアント
$ curl -X DELETE http://localhost:8000
> DELETE /

> の後で 'リクエストの種類 / ' と表示されたらうまくリクエストが送られた証拠になります。

参考

「N予備校 プログラミングコース」
https://www.nnn.ed.nico/
「逆引きcurlコマンドのオプション一覧」
https://www.setouchino.cloud/blogs/99#post-x-post-d


Viewing all articles
Browse latest Browse all 8866

Trending Articles