MP 新版本[1 express框架 ]

* express框架搭建*

1 http://itbilu.com/nodejs/npm/EJUJrGVsg.html

2 使用一下命令进行全局安装

npm install -g express

之后。执行express相关命令，失败。是因为需要再安装 Express 应用生成器 。这样才可以快速创建一个应用的骨架

npm install -g express-generator

才可以使用

3 express -e 你创建的文件名字
创建一个应用的骨架出来，文档结构如下

在命令行 npm start 可以将文件运行起来
这个运行的原理是：
在package.json中有

看到那个scripts [脚本] 属性值了吗，所以npm start 就是相当于执行node bin/www 这个操作

我们详细看一下Express4项目的结构、配置和使用。

bin, 存放启动项目的脚本文件
node_modules, 存放所有的项目依赖库。
public，静态文件(css,js,img)
routes，路由文件(MVC中的C,controller)
views，页面文件(默认是Ejs模板)
package.json，项目依赖配置及开发者信息
app.js，应用核心配置文件

---

Ejs模板使用：
这样最基础的express使用的是ejs,按照平时的代码习惯，我们需要将其更改为html的文件

修改app.js，增加如下代码

var ejs = require('ejs'); app.set('view engine', 'html'); app.engine('.html', ejs.__express);  // 使用ejs的__express方法渲染模板

切分页面，这个使用了一个依赖库，需要安装一下npm install express-ejs-layouts --save 你也可以全局安装
同时在app.js 写入以下代码：

var ejsLayout = require('express-ejs-layouts'); // 用来进行文件拆分app.set('layout', 'layout');app.use(ejsLayout);

然后在view文件夹中新建一个layout.html
内容如下

<% include shared/head.html %><%-body%><% include shared/foot.html%>

路由功能：
设计有以下需求，当访问localhost:3000/contact 时，页面打开的是contact.html对应内容

打开
routes文件夹下面的index.js 文件

写入依赖 var about = require('../controller/about');
增加路由配置 app.get('/about', about.about);

然后对应的是写入controller下面about.js

---

补充关于layout
注意这个布局文件，当你的view中有多个文件，
比如分为后台和前端

通过不同的地址处理不同的 layout布局文件

app.use(function(req, res, next){    if(req.url.indexOf('/manage')>-1){        app.set('layout', 'manager/layout');    } else {        app.set('layout', 'web/layout');    }    next();});

---

---

文档正在学习中

以下是本人的胡言乱语，不成系统

之后是使用它进行服务器文件配置，从而实现视图渲染。

关于路由
路由（Routing）是由一个 URI（或者叫路径）和一个特定的 HTTP 方法（GET、POST 等）组成的，涉及到应用如何响应客户端对某个网站节点的访问。
路由是指如何定义应用的端点（URIs）以及如何响应客户端的请求。
路由是由一个 URI、HTTP 请求（GET、POST等）和若干个句柄组成。

// respond with "hello world" when a GET request is made to the homepageapp.get('/', function(req, res) {  res.send('hello world');});

如上例所示，get 是路由方法。 / 是路由路径。 res.send('hello world');
是路由句柄。
如下代码展示了路由的一个例子

// 对网站首页的访问返回 "Hello World!" 字样app.get('/', function (req, res) {  res.send('Hello World!');});

或者是

/*  进行主页的访问. */router.get('/', function(req, res, next) {  res.render('index', { title: 'Express' });});

通过 Express 内置的 express.static 可以方便地托管静态文件，例如图片、CSS、JavaScript 文件等。

app.use(express.static('public'));

然后你可以访问public中的css,在浏览器中输入

http://localhost:3000/css/animate.css

中间件

Express 是一个自身功能极简，完全是由路由和中间件构成一个的 web 开发框架：从本质上来说，一个 Express 应用就是在调用各种中间件。

---

终于渲染出来一个页面 了

一展示一个关于我们的页面为例子。

首先，读到路由文件，

index.js.

var about = require('../controller/about');router.get('/about', about.action);

将会根据这两行，寻找到位于controller下面的about文件

执行其action 函数

这样，一个页面就渲染出来了。哈哈。

1 路由中使用 /about 和 /about/join 两种方式，第二种失败

当时用的是router.get('/about', about.action); ，外部文件的引用地址是 localhost/about/css/mystyle.css 这样方式渲染的页面可以完整渲染出来
但是router.get('/about/join', about.join);
这样的方式的时候，发现页面引用的css , js外部文件没有被正常读到，查看其存在，发现路径是 localhost/about/css/mystyle.css 但是实际应该是 localhost/css/mystyle.css
所以将头部文件head的引用路径变为绝对路径，就okay了

参考文档1

参考文档2

---

补充参考资料
1 node express 实现文件 上传
http://blog.csdn.net/a1126238643/article/details/49945031

2

---