继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

《Node.js开发指南》microblog手动代码一

startitunderground
关注TA
已关注
手记 58
粉丝 99
获赞 931

开发一个微博网站
在开发之前我们熟悉一下Node.js实现网站的工作原理,node.js和php,jsp等一样,实现动态网页,也就是说由服务器生成HTML页面,因为静态页面html扩展性非常有限,无法实现与用户有效的交互,例如产品介绍页面:1000个产品就需要1000个HTML静态页面,维护这1000个静态页面就是一场灾难,因此动态生成html页面的技术应运而生;

(1)在90年代:实现动态网页的方式是使用Perl和CGI,在Perl程序中输出html内容,由HTTP服务器调用Perl程序,将结果返回给客户端;但是HTML内容比较多维护不方便;
(2)在00年代ASP,PHP,JSP的代表的以模板为基础的语言出现;在以html为主的模板中插入程序代码;但是页面和程序逻辑耦合紧密;
(3)兴起的MVC(model-view-controller,模型-视图-控制器)架构为基础的平台模式逐渐兴起;

model模型是对象及数据结构的实现,通常包含数据库操作
view视图表示用户界面,在网站中通常是HTML的组织结构
control控制器用于处理用户请求和数据流,复杂模型,将输出传递给视图

Express框架
Express是node官方推荐的web开发框架;
Express(http://expressjs.com/) 除了为http模块提供了更高层的接口外,还实现了许多功能:

路由控制
模板解析支持
动态视图
用户会话
CSRF保护
静态文件服务
错误控制器
访问日志
缓存
插件支持

Express是一个轻量级的web框架,多数功能只是对HTTP协议中常用操作的封装,更多功能需要插件和整合其他模块来实现;

//利用express框架的实现http服务器
var express = require("express");
var app = express.createServer();
app.use(express.bodyParser() )
app.all("/",function(req,res){
       res.send( req.body.title + req.body.text );
})
app.listen(3000);

一,安装express
如果一个包是某个工程的依赖,那么使用本地模式安装这个包,如果要通过命令行调用这个包,那么使用全局模式安装,但是Express像很多框架一样提供了quick start(快速开始)工具,因此可以在全局模式安装Express,在命令行中使用:

npm install -g express

安装完成后,可以通过Express命令行快速创建一个项目了;在这之前使用,experss在初始化一个项目时候需要制定模板引擎,默认是Jade和ejs,这里使用的是ejs;

Express --help
//查看帮助信息;

二,建立工程
通过命令建立网站基本结构:

Express -e microblog

在当前目录下出现了子目录microblog,产生了一些文件:

图片描述

然后按照提示 进入microblog,在命令行中输入

//无参数的npm install 就是检查检查当前下的package.json,并自动安装所有指定的依赖;
npm  install

就自动安装了依赖ejs和Express;

三,启动服务器
先安装supervsior

npm install -g supervisor

安装完之后,启动方式为:

supervisor bin/www

接下来时倒入bootstrap和添加ayout.ejs,但是Express不支持ejs模块的partials方法,所以需要自己额外安装模块:

npm install express-partials

在app.js中添加

var partials =require("express-partials");
app.use(partials() );

四,工程的结构

1,app.js是工程的入口:

var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');

var index = require('./routes/index');
var users = require('./routes/users');

var app = express();

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

// uncomment after placing your favicon in /public
//app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

app.use('/', index);
app.use('/users', users);

// catch 404 and forward to error handler
app.use(function(req, res, next) {
  var err = new Error('Not Found');
  err.status = 404;
  next(err);
});

// error handler
app.use(function(err, req, res, next) {
  // set locals, only providing error in development
  res.locals.message = err.message;
  res.locals.error = req.app.get('env') === 'development' ? err : {};

  // render the error page
  res.status(err.status || 500);
  res.render('error');
});

var partials = require('express-partials');
app.use(partials());

module.exports = app;

通过:

//app.js中的
var express = require("express");
var app = express();

创建一个应用实例,后面的所有操作都是针对这个实例进行的。app.js中的app.set是Express的参数设置工具:接受一个键(key)和一个(value),可用参数为:

basepath              基础地址,通常是res.redirect()跳转。
views                 视图文件的目录,存放模板的文件
view  engine          视图模板引擎
view options          全局视图参数对象
view cache            启用视图缓存
case sensitive routes 路径区分大小写
strict   routing      严格路径,启用后不会忽略路径末尾的“/”
jsonp callback        开启透明的jsonp支持

express依赖的connect提供了大量的中间件,通过app.use启用:
bodyParser的功能是解析客户端请求,router是项目的路由支持,static提供了静态文件支持,cookieParser,等等;

var index = require('./routes/index');
var users = require('./routes/users');

app.use('/', index);
app.use('/users', users);

app.use('/', index);是一个路由控制器,用户如果访问“/”路径,则由index来控制。

2,routes/index.js

routes是一个文件夹形式的本地模块,即./routes/index.js,它的功能是为指定路径组织返回内容,相当于MVC架构中的控制器。routes/index.js是路由文件,用于组织展示的内容:

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

/* GET home page. */
router.get('/', function(req, res, next) {
  res.render('index', { title: 'MGT360124' });
});

module.exports = router;

app.js中通过app.use('/', index);将 “/”路径映射到index下,在routes/index.js中,res.render("index",{title:"Express"} );功能是调用模板解析引擎,翻译名为index的模板,并传入一个对象只有一个属性title为Express

3,index.ejs
index.ejs是模板文件,即routes/index.js中调用的模板,内容是:

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

他的基础是html标记语言,其中包含形如<%= title %>的标签,功能是引用变量,即res.render函数第二个参数传入的对象属性title;

打开App,阅读手记
5人推荐
发表评论
随时随地看视频慕课网APP