和屌丝一起学Node.js—web开发2

上节我们简单的了解了Node.js里的web创建方法.这节我们继续一起来看web.

首先我们先看一下generator工具生成的站点结构.

• bin目录:用来放系统文件.

• public目录:用来放资源文件,如js,css文件

• routes目录:用来放控制器文件

• views目录:用来放模板文件

我们来看看简单的使用.

//routes/index.js文件
var express = require('express');
var router = express.Router();
/* GET home page. */
router.get('/', function(req, res, next) {
  res.render('index', { title: 'Express' });
});
module.exports = router;

这里我们看到实例化了一个router,然后用router去get调用.用法就是我们常见的get和post

app.METHOD(PATH, HANDLER)

METHOD:请求方式

PATH:服务器上的地址

HANDLER:回调函数

app.render(view, [locals], callback)

render方法使用来显示HTML的,同时还能传参和回调.其中参数为json格式

更多generatorAPI:http://expressjs.com/en/4x/api.html

例如我们修改下routes/index.js文件

//routes/index.js文件
var express = require('express');
var router = express.Router();
router.get('/', function(req, res, next) {
res.render('one', {url:req.hostname,name:'孤狼',contents:'node.js学习中....'});
});
module.exports = router;

同时我们调用了一个one的模板,我么去增加一个one.ejs.

views/one.ejs

然后重启下服务器

TIP:node.js并不是向php那样可以实时刷新加载,所以必须重启.

我们看到,这样就可以正常使用网页来显示我们想用的东西了.很类似于是MVC的一种用法.

TIP:模板可以先用html格式制作好之后,在替换成ejs格式.

GET和POST.

我们常用来接收数据的get和post怎么用呢?

//routes/index.js文件
var express = require('express');
var router = express.Router();
router.get('/', function(req, res, next) {
var name=req.param('name');
res.render('one', {url:req.hostname,name:name,contents:'node.js学习中....'});
});
module.exports = router;

这里我们用req来接收提取数据.

然后我们访问http://127.0.0.1:3000/?name=123

可以看到已经接收成功了.

param方法可以接收post,get都可以.

ejs模板规则:

：JavaScript 代码。
：显示替换过 HTML 特殊字符的内容。
：显示原始 HTML 内容。

路由控制

我们刚才看到了如何用render来指定模板显示,那么我们怎么切换控制器呢?很简单

我们在routes目录下新建一个one.js文件

//routes/one.js
var express = require('express');
var router = express.Router();
router.get('/', function(req, res, next) {
//注意这里用的的send发送方法.
res.send('通过one.js调用');
});
module.exports = router;

然后修改一下项目目录里的app.js引导文件,在里面增加one的调用

var one = require('./routes/one');
app.use('/one', one);

然后重启服务器,访问http://127.0.0.1:3000/one

本节代码下载:链接: https://pan.baidu.com/s/1slhVqtn 密码: 37vi