使用
express-session
和react-router
,后台生成session成功,但是不知道怎么让react-router
使用这个session来判断(或者说如何让react-router
接受各种在server.js的参数,比如判断用户名/是否登陆成功,返回给react
的一个渲染位置,比如title
)
server.js
// session
app.use(cookieParser());
app.use(session({
secret: 'dw4f4fFv4gduf6wSG4hsdb7A',
name: 'IamSession',
cookie: {maxAge: 800000 },
resave: false,
saveUninitialized: true,
}));
// POST /api/login
app.post('/api/login', function(req, res) {
console.log(req.body.email);
// console.log(req.body.password);
// console.log(req.body.captcha);
var email = req.body.email;
console.log(email);
var password = req.body.password;
var captcha = req.body.captcha;
async.waterfall([
function(callback) {
User.findOne({ email: email }, function(err, user) {
if (err) return res.statue(500).send({message: err});
if (user) {
console.log(user);
return res.status(409).send({ message: user.email + ' is already in the database.' });
}
callback(err, email);
});
}
]);
});
//react-router
app.use(function(req, res) {
Router.run(routes, req.path, function(Handler) {
var html = React.renderToString(React.createElement(Handler));
var page = swig.renderFile('views/index.html', { html: html});
res.send(page);
});
});
app/routes.js
import React from 'react';
import {Route} from 'react-router';
import App from './components/App';
import Index from './components/Index';
import Login from './components/Login';
import Regist from './components/Regist';
export default (
<Route handler={App}>
<Route path='/' handler={Index} />
<Route path='/login' handler={Login} />
<Route path='/regist' handler={Regist} />
</Route>
);
app/main.js
import React from 'react';
import Router from 'react-router';
import routes from './routes';
Router.run(routes, Router.HistoryLocation, function(Handler) {
React.render(<Handler />, document.getElementById('app'));
});
views/index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<title>{{title}}</title>
<link rel="stylesheet" href="/css/main.css"/>
</head>
<body>
<div id="app">{{ html|safe }}</div>
<script src="/socket.io/socket.io.js"></script>
<script src="/js/vendor.js"></script>
<script src="/js/vendor.bundle.js"></script>
<script src="/js/bundle.js"></script>
</body>
</html>
既然选择了react 之类的mvvm,就应抛弃session等概念
打个比方,如果你开发一个android app 你会用session吗,
用开发android或ios客户端的方法去开发react vue 之类的应用,
以上是初学mvvm的我个人理解,不到之处还望海涵?