備忘録

Windows,Linux,Mac,AWS,VMware,ネットワークなどの検証

Expressの使い方

node.js(JavascriptでWebサーバやWebアプリを作るソフトウェア)の使い方。

Expressフレームワークのインストール

// プロジェクトディレクトリの作成
$ mkdir express-project
$ cd express-project

// npm(nodeのパッケージマネージャ) の初期化
$ npm init -y

// Expressのインストール
// --save は、package.jsonファイルにexpressモジュールのバージョンなどを記録するオプション
$ npm install --save expres
const express = require('express'); //Expressモジュールの読みこみ
const app = express();
const portNo = 8000; // TCPポート番号

// http://localhost:8000/ にGETアクセスしたとき、
//「GET受信しました」と返す。
app.get('/', (req, res) => {
  res.send('GET受信しました');
});

// Webサーバを起動
app.listen(portNo, ()=>{
  console.log('起動しました: http://localhost:8000/:' + portNo);
});

※以下、モジュールの読み込みとWebサーバの起動部分は省略します。
モジュールの読み込みとWebサーバの起動:

const express = require('express'); //Expressモジュールの読みこみ
const app = express();
const portNo = 8000; // TCPポート番号

// Webサーバを起動
app.listen(portNo, ()=>{
  console.log('起動しました: http://localhost:8000/:' + portNo);
});

http://localhost:8000/hello/ にアクセスしたとき、返事を返す。

app.get('/hello/', (req, res) => {
  res.send('GET受信しました');
});

http://localhost:8000/1 にアクセスしたとき、返事を返す。

「1」を変数(URLのパターンマッチ)として扱います。

app.get('/:num', (req, res) => {  // URLパターンの末尾に:num を指定する
  res.send('GET受信しました: ' + req.params.num);  // req.params.num で:numの値を取得する
});

http://localhost:8000?q=hi にアクセスしたとき、クエリー文字列を取得する

app.get('/', (req, res) => {
  res.send('GET受信しました: ' + req.query.q);  // req.query.q でqの値を取得する。(qをキーと呼ぶ)
});

フォームから送信されたPOSTメソッドを受け付ける

「body-parser」というライブラリをインストールします。

GitHub - expressjs/body-parser: Node.js body parsing middleware

$ npm install --save body-parser
const express = require('express')
const app = express();
const bodyParser = require('body-parser'); // body-parser モジュールを読み込みます
app.use(bodyParser.urlencoded({extended: true}); // body-parser モジュールを使えるようにセットします

// http://localhost:8000/ にアクセスすると、入力フォームが表示される。
app.get('/', (req, res) => {
  res.send('<form method="POST">' +
  '<input type="text" name="test" value="テスト">' +
  '<br /><input type="submit" value="送信">'+
  '</form>'
  );
});

app.post('/', (req, res) => { // app.post でPOSTメソッドを受け付ける
  res.send('POST受信しました: ' + JSON.stringify(req.body));
});

f:id:tksfj17:20180203125132p:plain

POST受信しました: {"test":"テスト"}