Express Session - Express

パッケージのインストール

パッケージのインストール

npm install express-session

オプション

 app.use(session({
  secret: 'secret',
  resave: false,
  saveUninitialized: false,
  cookie:{
  httpOnly: true,
  secure: false,
  maxage: 1000 * 60 * 30
  }
}));

secret は、指定した文字列を使ってクッキー ID を暗号化し、クッキー ID が書き換えらているかを判断します。

resave は、セッションにアクセスすると上書きされます。

saveUninitialized は未初期化状態のセッションも保存します。

httpOnly は、クライアント側でクッキー値を見れない、書きかえれないようにします。

secure は、secure属性の設定です。

Cookie の Secure属性とは、「 HTTPS 通信時のみ Cookie を送信する 」という設定です。

maxage は、セッションを破棄する時間です。

セッションを使ってみる

「 Express Generator 」でアプリケーションを作成し、以下のようにファイルを変更します。

app.js

var session = require('express-session');
var session_opt = {
  secret: 'keyword',
  resave: false,
  saveUninitialized: false,
  cookie: { maxAge: 60 * 60 * 1000}
}

app.use(session(session_opt));

pp.use('/', indexRouter);
app.use('/users', usersRouter);
app.use('/form', formRouter);

「 app.use(session(session_opt)); 」は、ルーターの記述よりも前に記述する必要があります。

app.js

app.use('/', indexRouter);
app.use('/users', usersRouter);
app.use('/form', formRouter);

routes/index.js

var express = require('express');
var router = express.Router();

/* GET home page. */
router.get('/', function(req, res, next) {
  if(req.session.message != undefined) {
    msg = req.session.message;
  }
  res.render('index', { title: 'Express', msg: msg });
});

module.exports = router;

routes/form.js

var express = require('express');
var router = express.Router();

router.get('/', (req, res, next) => {
  var msg = "送信してください。";
  if(req.session.message != undefined) {
    msg = req.session.message;
  }
  let data = {
    title: 'Hello',
    content: msg
  };
  res.render('form', data);
});

router.post('/post', (req, res, next) => {
  let msg = req.body['message'];
  req.session.message = msg;
  let data = {
    title: 'Hello',
    content: '送信されたデータ：' + msg
  };
  res.render('form', data);
})

module.exports = router;

views/index.ejs

<!DOCTYPE html>
<html>
  <head>
    <title><%= title %></title>
    <link rel='stylesheet' href='/stylesheets/style.css' />
  </head>
  <body>
    <h1><%= title %></h1>
    <p><%- msg %></p>
  </body>
</html>

views/form.ejs

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title><%- title %></title>
</head>
<body>
  <p><%- content %></p>
  <form action="/form/post" method="post">
    <input type="text" name="message">
    <input type="submit" value="送信">
  </form>
</body>
</html>

「 http://localhost:3000/form 」をブラウザで開きフォームからデータを送信します。

その後、「 http://localhost:3000 」のページを開きます。

フォームから送信されたデータがセッションに保存されているため、画面にフォームから送信された値が表示されます。

ページ遷移での利用

app.js

var createError = require('http-errors');
var express = require('express');
var path = require('path');
var cookieParser = require('cookie-parser');
var logger = require('morgan');
const session = require("express-session"); // +

var indexRouter = require('./routes/index');
var usersRouter = require('./routes/users');
var sessionRouter = require('./routes/session'); // +

var app = express();

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');

app.use(logger('dev'));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

app.use(session({
  secret: "secret",
  resave: false,
  saveUninitialized: true,
}));

app.use('/', indexRouter);
app.use('/users', usersRouter);
app.use('/session', sessionRouter); // +

routes/session.js

var express = require('express');
var router = express.Router();

router.get('/', function(req, res, next) {
  req.session.message = "hello, world";
  res.render('session/index');
});

router.get('/sub', function(req, res, next) {
  res.render('session/sub', { message : req.session.message });
});

module.exports = router;

views/session/index.ejs

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <title>index.ejs</title>
</head>
<body>
  <p><a href="/session/sub">sub</a></p>
</body>
</html>

views/session/sub.ejs

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <title>sub.ejs</title>
</head>
<body>
  <p><%=message %></p>
</body>
</html>

セッションの削除

delete(req.session.message)