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); 

https://teratail.com/questions/36146を参照

1. layout.pugでjqueryを読み込み
   script(src=“https://code.jquery.com/jquery-2.2.4.js”, integrity=“sha256-iT6Q9iMJYuQiMWNd9lDyBUStIq/8PuOW33aOqmvFpqI=”, crossorigin=“anonymous”)
2. FileReaderのreadAsTextメソッドで取得したファイルの中身を送信出来るようにjson形式にしておく
3. ボタンクリック時にajax通信で内容を飛ばすようにする。
4. index.js側ではPOSTしたURL側でreq.bodyで受け取る