//tips
//smart contract
Hello.jsのroute設定についても確認。これはすでにapp.jsにてapp.use('/hello',hello)と設定しているので、その先のアドレスを定義するものとなっている。
var express = require('express');
var router = express.Router();
//'/'は/hello以下に続くものを定義している
//すでにapp.use('/hello',hello)としているのでhelloは必要ない
router.get('/', function(req, res, next) {
var data={
title:'Hello!',
content:'これは、サンプルのコンテンツです。<br>this is sample content.'
};
res.render('hello', data);
});
module.exports = router;
こちらを一部修正し、URLのパラメータからページの表記を変更できるようにする。
var express = require('express');
var router = express.Router();
//'/'は/hello以下に続くものを定義している
//すでにapp.use('/hello',hello)としているのでhelloは必要ない
router.get('/', function(req, res, next) {
var name= req.query.name;
var mail=req.query.mail;
var data={
title:'Hello!',
content:'あなたの名前は、'+name+'。<br>'+'メールアドレスは、'+mail+'です。'
};
res.render('hello', data);
});
module.exports = router;
ページ表示アドレスに以下を与えると、
http://localhost:3000/hello?name=hanako&mail=hanako@flower.com
あなたの名前は、hanako。
メールアドレスは、hanako@flower.comです。
と表示されるようになった。
router.get('/', function(req, res, next) {
var name= req.query.name;
var mail=req.query.mail;
で取り出せるようにしている。
続けてフォームの送信も行う。
Expressではbody parserというパッケージを利用するのが基本でexpress generator プロジェクトでは標準で組み込まれている。expressフォルダのlibにあるexpress.jsというファイルに記載されている。
これでフォームの内容がそのまま取り出せる。
これらの機能を実際に試していく。
Ejsに下記を追加。
<form method="post" action="/hello/post">
/hello/postへのpostを実行。
<div class="form-group">
<label for ="msg">と<nput typeのidはセットで記載。form-controlはbootstrapの機能。
<label for ="msg">Message:</label>
<input type="text" name="message" id="msg" class="form-control">
</div>
<input type="submit" value="送信" class="btn btn-primary">
</form>
このようにhello/postに対して送信することになるので、それを取得してhelloに表示させる。
var express = require('express');
var router = express.Router();
//'/'は/hello以下に続くものを定義している
//すでにapp.use('/hello',hello)としているのでhelloは必要ない
router.get('/', (req, res, next) =>{
var data={
title:'Hello!',
content:'※何か書いて送信してください。'
};
res.render('hello', data);
});
router.post('/post', (req, res, next) =>{
var msg=req.body['message'];
var data={
title:'Hello!',
content:'あなたは、「'+msg+'」と送信しました。'
};
res.render('hello', data);
});
module.exports = router;
きちんと表示できた。router.post('/post’となるので間違えない。
//postアクセスの処理を行うためのもの
router.post('/post', (req, res, next) =>{
//post送信内容はreq.bodyにまとめられている
//req.body.[inputのnameに指定した値]
//idではない点に注意
//これがbody parserの重要な機能
var msg=req.body['message'];
var data={
title:'Hello!',
content:'あなたは、「'+msg+'」と送信しました。'
};
res.render('hello', data);
});
次に、アクセスしたクライアントを特定し、それぞれのクライアントごとに、購入した商品の情報を保管し続けている必要がある。
これを実装するにはセッション機能を使う必要がある。セッションはクライアントごとに値を保管する仕組み。クッキー機能とサーバー機能を融合させたもの。
express sessionパッケージでこれを実現していく。
npm install express-session
ちなみにパッケージはnpm installでインストールするプログラムのパッケージ、モジュールはnode.jsの中でロードされるスクリプトの塊。
Express sessionパッケージにはexpress-sessionというモジュールがあり、それをrequireでロードして使うことになる。これらはapp.jsに追加される。
const session=require('express-session');
var session_opt={
//秘密キー。ハッシュ計算のキーとなる
secret:'keyboard cat',
//セッションストアに強制的に値を保存するため
resave:false,
//初期化されていない値を強制的に保存するため
saveUninitialized:false,
//セッションIDを保管するクッキーに関する設定。ここでは保管時間を1時間にしている
cookie:{maxAge:60*60*1000}
};
//値が用意できたらapp.useでsession関数を設定
app.use(session(session_opt));