Node.jsを学ぶ(その6・POSTに対応する・後編)

  • 投稿日:
  • by
  • カテゴリ:

昨日の続きで、Node.jsでPOSTに対応する簡単な事例を紹介します。

1.仕様

以下のような、ごくシンプルなプログラムを作ってみます。

  • 「http://localhost:8080/」にアクセスされたときには、名前を入力するフォームを表示します。
    node_formidable1.png
    なお、名前入力のフィールド名は「yourname」にします。
  • フォームのデータを、「http://localhost:8080/post」にPOSTで送信します。
  • 送信された名前をもとに、「○○さんこんにちは」と表示します。
    送信された名前をもとに、「○○さんこんにちは」と表示
  • 「http://localhost:8080/post」にPOST以外のプロトコルでアクセスされたときには、「Bad request」(ステータスコード400)のレスポンスを返します。

2.プログラム

実際にプログラムを作ると、以下のようになります。

var http = require('http');
var url = require('url');
var formidable = require('formidable');
var util = require('util');

var server = http.createServer(listener);
server.listen(8080);
console.log('Server start');

function listener(request, response) {
  var urlInfo = url.parse(request.url, true);
  var pathname = urlInfo.pathname;
  if (pathname == '/') {
    response.statusCode = 200;
    response.setHeader('Content-type', 'text/html');
    response.write(
'<!DOCTYPE html>' +
'<html>' +
'<head>' +
'<meta charset="UTF-8" />' +
'<title>formidable</title>' +
'</head>' +
'<body>' +
'<form method="post" action="/post">' +
'<p>お名前 <input type="text" name="yourname" size="20" /></p>' +
'<p><input type="submit" name="submit" value="送信" /></p>' +
'</form>' +
'</body>' +
'</html>'
);
    response.end();
  }
  else if (pathname == '/post') {
    if (request.method.toLowerCase() == 'post') {
      var form = new formidable.IncomingForm();
      form.parse(request, function(err, fields, files) {
        var yourname = fields.yourname;
        if (!yourname) {
          yourname = 'Node.js';
        }
        response.statusCode = 200;
        response.setHeader('Content-type', 'text/html');
        response.write(
'<!DOCTYPE html>' +
'<html>' +
'<head>' +
'<meta charset="UTF-8" />' +
'<title>formidable</title>' +
'</head>' +
'<body>' +
'<p>' + escape(yourname) + 'さんこんにちは。</p>' +
'<p><a href="/">トップに戻る</a></p>' +
'</body>' +
'</html>'
);
        response.end();
      });
    }
    else {
      response.statusCode = 400;
      response.setHeader('Content-type', 'text/plain');
      response.write('Bad request');
      response.end();
    }
  }
  else {
    response.statusCode = 404;
    response.setHeader('Content-type', 'text/plain');
    response.write('Not found');
    response.end();
  }
}

function escape(str) {
  str = str.replace(/&(?!\w+;)/g, '&')
  str = str.replace(/</g, '<')
  str = str.replace(/>/g, '>')
  str = str.replace(/"/g, '"');
  return str;
}

主要な部分の解説は以下の通りです。

13~32行目

「http://localhost:8080/」にアクセスされたときに、名前入力のフォームを出力します。

33~65行目

「http://localhost:8080/post」にアクセスされたときに、フォームから送信された名前をもとに、「○○さんこんにちは」と出力します。
35行目でformオブジェクトを生成し、36行目でフォームをパースして、その結果に基づいて37~55行目でページを出力します。
また、プロトコルがPOSTでない場合は(34行目)、「Bad Request」のレスポンスを返します(59~64行目)。

66~71行目

「http://localhost:8080/」「http://localhost:8080/post」以外にアクセスされたときに、「Not Found」のレスポンスを返します。