1. multerモジュールをインストール
2. クライアント側でinput(type=“file”, name=“file”) ファイルアップロードのフォームを作成
3. クライアント側ではenctype=“multipart/form-data” でファイルを受け取れる
4. サーバ側ではmulter({ dest: 'tmp/' }).single('file') でポスト時に単一ファイルを受け取れる
5. サーバ側ではファイルの情報はreq.file に格納される

form(action=“./upload” method=“POST” enctype=“multipart/form-data”)
input(type=“file”, name=“file”)
input(type=“submit” value=“Upload” id=“upload” )

router.post('/upload', multer({ dest: 'tmp/' }).single('file'), function (req, res, next) {
console.log(req.file.path, req.file.originalname)
res.render('uploaded');
});

1. index.pugではファイルを受け付けるフォームと、javascriptを読み込むscriptタグ、テキストを表示するタグを作成
2. javascript側ではフォームに“change”イベントが発生した時に、var text = document.getElementById(“text”); でファイルの一覧を取得
3. javascript側で、var reader = new FileReader() でFileReaderインスタンスを起動
4. javascript側でreader.readAsText(file[0])でファイルの一覧の一番目のテキストを取得
5. javascript側で、readerのonload時にtext.textContent = reader.result でテキストの中身をブラウザに表示

input(type=“file”, name=“file” id=“inputfile”)
p(id=“text”)
script(src=“./javascripts/main.js”)


''var inputFile = document.getElementById(“inputfile”);
　　　　var text = document.getElementById(“text”);
　　　　
　　　　inputFile.addEventListener(“change”, function (e) {

  　　　　var file = e.target.files \\
  　　　　var reader = new FileReader() \\
  　　　　reader.readAsText(file[0]); \\
  　　　　reader.onload = function () { \\
      　　　　text.textContent = reader.result; \\
  　　　　} \\

　　　　}, false);