Expressの基本的な使い方を確認します。ミドルウェアの設定方法、リクエストデータの取得方法、レスポンスデータの設定方法について取り上げます。
Expressをインストール
npm init
npm install --save express
簡単な例で動作確認
app.js
というファイルを作り、以下処理を記述します。
const express = require('express')
const app = express()
// app.METHOD(PATH, CALLBACK)
app.get('/', (req, res) => {
res.json({ 'message': 'hello world' })
})
app.listen(5000, () => console.log('Example app listening on port 5000!'))
プロセスを起動します。
$ node app.js
Example app listening on port 5000!
curlでリクエストしてみます。
$ curl -v localhost:5000
* Rebuilt URL to: localhost:5000/
* Trying ::1...
* TCP_NODELAY set
* Connected to localhost (::1) port 5000 (#0)
> GET / HTTP/1.1
> Host: localhost:5000
> User-Agent: curl/7.54.0
> Accept: */*
>
< HTTP/1.1 200 OK
< X-Powered-By: Express
< Content-Type: application/json; charset=utf-8
< Content-Length: 25
< ETag: W/"xxxxxxxxxxxxxxxxxxxxxxxxxxxxx"
< Date: Sat, 8 Sep 2018 14:29:16 GMT
< Connection: keep-alive
<
* Connection #0 to host localhost left intact
{"message":"hello world"}
JSONデータを取得できました。
Middleware
設定対象
app.use
でMiddlewareを設定します。リクエストを続ける場合、next()
を実行します。
const express = require('express')
const app = express()
// 全リクエスト対象
app.use((req, res, next) => {
console.log('middleware A')
next()
})
// 全リクエスト対象
app.use((req, res, next) => {
console.log('middleware B')
next()
})
// /usersリクエストのみ対象
app.use('/users', (req, res, next) => {
console.log('middleware C')
next()
})
app.get('/', (req, res) => {
console.log('Routing /')
res.json({ 'message': 'hello world' })
})
app.get('/users', (req, res) => {
console.log('Routing /users')
res.json({ 'message': 'hello world' })
})
app.listen(5000, () => console.log('Example app listening on port 5000!'))
プロセスを起動して、curlでリクエスト( curl localhost:5000
)すると以下のようになります。
$ node app.js
Example app listening on port 5000!
middleware A
middleware B
Routing /
再度、プロセスを起動して、curlでリクエスト( curl localhost:5000/users
)すると以下のようになります。
$ node app.js
Example app listening on port 5000!
middleware A
middleware B
middleware C
Routing /users
エラー処理のミドル
エラー処理のミドルは、ルート呼び出しの後で最後に定義します。
const express = require('express')
const app = express()
app.get('/', (req, res) => {
throw new Error('test error')
res.send('Hello')
})
app.use((err, req, res, next) => {
console.error(err.stack)
res.status(500).send('Error occurred')
})
app.listen(5000, () => console.log('Example app listening on port 5000!'))
curlでリクエストします。
$ curl localhost:5000
Error occurred
サーバーサイドではエラースタックが表示されました。
$ node app.js
Example app listening on port 5000!
Error: test error
at app.get (/xxx/express-api/app.js:5:9)
at Layer.handle [as handle_request] (/xxx/express-api/node_modules/express/lib/router/layer.js:95:5)
at next (/xxx/express-api/node_modules/express/lib/router/route.js:137:13)
at Route.dispatch (/xxx/express-api/node_modules/express/lib/router/route.js:112:3)
at Layer.handle [as handle_request] (/xxx/express-api/node_modules/express/lib/router/layer.js:95:5)
at /xxx/express-api/node_modules/express/lib/router/index.js:281:22
at Function.process_params (/xxx/express-api/node_modules/express/lib/router/index.js:335:12)
at next (/xxx/express-api/node_modules/express/lib/router/index.js:275:10)
at expressInit (/xxx/express-api/node_modules/express/lib/middleware/init.js:40:5)
at Layer.handle [as handle_request] (/xxx/express-api/node_modules/express/lib/router/layer.js:95:5)
参考
- http://expressjs.com/ja/guide/writing-middleware.html
- http://expressjs.com/ja/guide/using-middleware.html
- https://expressjs.com/ja/guide/error-handling.html
Request
HTTPヘッダ
HTTPヘッダの取得方法を確認します。
const express = require('express')
const app = express()
app.get('/', (req, res) => {
console.log(`req.get('User-Agent'): ${req.get('User-Agent')}`)
console.log(`req.get('Accept'): ${req.get('Accept')}`)
res.end()
})
app.listen(5000, () => console.log('Example app listening on port 5000!'))
プロセスを起動して、curlでリクエスト( curl localhost:5000
)すると以下のようになりました。
$ node app.js
Example app listening on port 5000!
req.get('User-Agent'): curl/7.54.0
req.get('Accept'): */*
クエリ文字列
クエリ文字列の取得方法を確認します。
const express = require('express')
const app = express()
app.get('/users', (req, res) => {
console.log(`req.query: ${JSON.stringify(req.query)}`)
console.log(`req.query.page: ${req.query.page}`)
console.log(`req.query.limit: ${req.query.limit}`)
console.log(`req.query.xxxx: ${req.query.xxxx}`)
res.end()
})
app.listen(5000, () => console.log('Example app listening on port 5000!'))
プロセスを起動して、curlでリクエスト( curl "localhost:5000/users?page=3&limit=20"
)すると以下のようになりました。
$ node app.js
Example app listening on port 5000!
req.query: {"page":"3","limit":"20"}
req.query.page: 3
req.query.limit: 20
req.query.xxxx: undefined
リクエストパラメータ
リクエストパラメータの取得方法を確認します。
const express = require('express')
const app = express()
app.get('/users/:id', (req, res) => {
console.log(`req.params.id: ${req.params.id}`)
res.end()
})
app.listen(5000, () => console.log('Example app listening on port 5000!'))
プロセスを起動して、curlでリクエスト( curl localhost:5000/users/222
)すると以下のようになりました。
$ node app.js
Example app listening on port 5000!
req.params.id: 222
リクエストボディ
リクエストボディの取得方法を確認します。 req.body
はデフォルトで未定義なので、body-parser
で生成しておく必要があります。
const express = require('express')
const bodyParser = require('body-parser')
const app = express()
app.use(bodyParser.json())
app.use(bodyParser.urlencoded({ extended: true }))
app.post('/users', (req, res) => {
console.log(`req.body: ${JSON.stringify(req.body)}`)
console.log(`req.body.name: ${req.body.name}`)
console.log(`req.body.old: ${req.body.old}`)
res.end()
})
app.listen(5000, () => console.log('Example app listening on port 5000!'))
プロセスを起動して、curlでリクエスト( curl -X POST -d name=yamada -d old=35 localhost:5000/users
)すると以下のようになりました。
$ node app.js
Example app listening on port 5000!
req.body: {"name":"yamada","old":"35"}
req.body.name: yamada
req.body.old: 35
その他(ip, path, hostname …)
その他のプロパティについて確認します。
const express = require('express')
const app = express()
app.get('/users', (req, res) => {
console.log(`hostname: ${req.hostname}`)
console.log(`baseUrl: ${req.baseUrl}`)
console.log(`originalUrl: ${req.originalUrl}`)
console.log(`method: ${req.method}`)
console.log(`path: ${req.path}`)
console.log(`route: ${req.route}`)
console.log(`ip: ${req.ip}`)
console.log(`protocol: ${req.protocol}`)
res.end()
})
app.listen(5000, () => console.log('Example app listening on port 5000!'))
プロセスを起動して、curlでリクエスト( curl localhost:5000/users?x=123
)すると以下のようになりました。
$ node app.js
Example app listening on port 5000!
hostname: localhost
baseUrl:
originalUrl: /users?x=123
method: GET
path: /users
route: [object Object]
ip: ::1
protocol: http
参考
Response
利用例
// レスポンスを返す
res.send('<p>hey</p>')
// jsonを返す(内部でJSON.stringify()が利用される)
res.json({ user: 'tobi' })
// データなしで終了
res.end()
// ステータスコードを設定
res.status(404).end()
res.status(500).json({ error: 'message' })
// リダイレクト
res.redirect('/foo/bar')
// http headerを設定
res.set('Content-Type', 'text/plain')
res.set({
'Content-Type': 'text/plain',
'Content-Length': '123',
'ETag': '12345'
})