11.
POSTリクエスト
POSTリクエスト
URLエンコード
ExpressでPOSTデータを取得するには、URLエンコードする必要があります。URLエンコードしないとマルチバイト文字が文字化けします
urlencoded()
ExpressのURLエンコードは、ミドルウェアで urlencoded() を設定します。
app.use(express.urlencoded({ extended: true }))
- Expressの ver4.16 以前は「body-parser」モジュールのインストールが必要
POSTリクエスト
post()
post() でPOSTリクエストの処理ができます。
app.post('URL', (req, res) => {
})
POSTデータ取得
POSTリクエストからデータは、リクエストオブジェクトの bodyプロパティで取得します。
app.post('URL', (req, res) => {
// POSTデータ取得
var data = req.body
})
簡易ログイン認証
ログインフォームから送信されたPOSTデータで、簡単なログイン認証をしてみましょう。
.env設定
「.env」に認証用の「LOGIN_NAME」と「PASSWORD」を設定します。
HOST=localhost
PORT=3000
LOGIN_NAME=test
PASSWORD=1234
- パスワードは通常、ハッシュデータにしておく必要がありますが今回はRAWデータとします
認証処理
「ログイン名」「パスワード」を取得して認証処理を実装します。
POSTデータ取得
POSTデータは、リクエストオブジェクトのbodyに格納されています。HTMLフォームで送信された「login_name」「password」をそれぞれ取得します。
server.js
app.post('/auth', (req, res) => {
const login_name = req.body.login_name;
const password = req.body.password;
})
ログイン判別
送信データと設定データを比較してログインの判別をします。
server.js
app.post('/auth', (req, res) => {
const login_name = req.body.login_name;
const password = req.body.password;
var message = 'ログインできませんでした';
if (login_name == process.env.LOGIN_NAME && password == process.env.PASSWORD) {
message = 'ログインしました';
}
res.send(message);
})
フォーム送信確認
ログインページアクセスし、ログイン名、パスワードを送信して動作確認してみましょう。
結果
ソース
server.js
const express = require('express');
const dotenv = require('dotenv');
dotenv.config();
const HOST = process.env.HOST;
const PORT = process.env.PORT;
const app = express();
app.use(express.urlencoded({ extended: true }));
app.use(express.static(__dirname + '/public'));
app.get("/", (req, res) => {
console.log(req.body);
console.log(req.url);
console.log(req.query);
res.send("Hello Express!");
});
app.get("/profile", (req, res) => {
res.send("This is Profile page.");
});
app.post('/auth', (req, res) => {
const login_name = req.body.login_name;
const password = req.body.password;
var message = 'ログインできませんでした';
if (login_name == process.env.LOGIN_NAME && password == process.env.PASSWORD) {
message = 'ログインしました';
}
res.send(message);
})
app.listen(PORT, HOST, () => {
console.log(`Server listen: http://${PORT}:${HOST}`);
});