「Angular2を使ってWebサーバからデータを取得してみた | hiro345」では、Python3が楽だったので採用しましたが、Node.jsでもWebサーバーは用意できます。npmのパッケージにあるconnectやserve-staticを使うと良さそうでしたが、package.jsonを使ったりするのを説明するのも面倒なので、素のNode.jsでCORS対応簡易サーバを実装する方法を調べてみました。

ヘッダーを設定して、ファイルを読み込んで返しています。画像ファイルよりJavaScriptの”.js”などに対応をした方がいいのでしょうが、こんな感じ、というのがわかればいいので、こうしてあります。

var http = require("http");
var fs = require('fs');
var path = require('path');

var server = http.createServer(function (req, res) {
  console.log('request starting...');
  res.setHeader('Access-Control-Allow-Origin', '*')
  res.setHeader('Access-Control-Request-Method', '*')
  res.setHeader('Access-Control-Allow-Methods', 'OPTIONS, GET')
  res.setHeader('Access-Control-Allow-Headers', '*')
  var filePath = '.' + req.url;
  if (filePath == './') {
    filePath = './index.html';
  }
  var extname = path.extname(filePath);
  var contentType = 'text/html';
  switch (extname) {
    case '.json':
      contentType = 'application/json';
      break;
    case '.png':
      contentType = 'image/png';
      break;
  }
  fs.readFile(filePath, function(error, content) {
    if (error) {
      if(error.code == 'ENOENT'){
        res.writeHead(404);
        res.end('404 Not found', 'utf-8');
      } else {
        res.writeHead(500);
        res.end('500 Internal Error: '+error.code+'\n');
        res.end();
      }
    } else {
        res.writeHead(200, { 'Content-Type': contentType });
        res.end(content, 'utf-8');
    }
  });
});
server.listen(process.env.PORT || 8000, function () {
  console.log('Server running ...');
});