使⽤nodejs进⾏WEB开发
这⾥,准备从零开始⽤nodejs实现⼀个微博系统。功能包括路由控制、页⾯模板、数据库访问、⽤户注册、登录、⽤户会话等内容。
将会介绍Express框架、MVC设计模式、ejs模板引擎以及MongoDB数据库的操作。
准备⼯作
使⽤http模块,Express框架,
nodejs的抽象如此之差,把不该有的细节暴露给开发者。你可以⽤它做任何HTTP服务器能做的事情,不仅仅是做⼀个⽹站,甚⾄实现⼀个HTTP代理服务器都⾏。
Express是WEB开发框架。
实现:
为HTTP模块提供了更⾼层的接⼝,
路由控制,
模板解析⽀持,
动态视图,
⽤户会话,
CSRF保护,
静态⽂件服务,
错误控制器,
访问⽇志,
缓存,
插件⽀持。
多数功能只是对HTTP协议中常⽤操作的封装,更多的功能需要插件或者整合其他模块来完成。
快速开发
安装Express
在项⽬⽬录下
npm install -g express-generator
express --help
建⽴⼯程
express -t ejs microblog 由于新版本没有-t命令
1.如何在项⽬中安装ejs模板引擎
在NodeJS指南中利⽤利⽤以下命令建⽴⽹站的基本结构:
express -t ejs microblog
运⾏这个命令后继续运⾏
cd microblog && npm install(安装项⽬的依赖属性),
发现安装的模板引擎是jade,⽽不是ejs。原因是现在的版本已经没有-t这个命令了,改为
express -e microblog
运⾏完这个命令,继续运⾏cd microblog && npm install,ejs模板引擎就安装好了
但是express3以上的版本把layout默认给取消了,所以现在在views⽂件夹下并没有⽣成layout.ejs。
2.安装了ejs后,如何使⽤ejs的layout模板
安装express-partials
在cmd中切换到项⽬⽬录,运⾏
(1)npm install express-partials或者
(2)在package.json⾥⾯的dependencies添加"express-partials": "*"。然后在项⽬⽬录下运⾏npm install。
(3)然后在app.js⾥⾯引⽤express-partials,引⽤⽅法:
1.在path = require('path')后,添加引⽤var partials = require('express-partials');
2.在app.set('view engine', 'ejs')后,添加app.use(partials());
3.增长端⼝,
app.listen(8100,function(){
console.log("Server Start!");
});
/topic/515b009a6d38277306192e4e
启动服务器
localhost:8100
⼯程的结构
package.json
js⽂件: app.js, routes/index.js
模板引擎ejs也有2个⽂件index.ejs, layout.ejs
style.css
路由控制
⼯作原理
浏览器会向服务器发送请求,
app.js有⼀⾏('/',routes.index),规定路径"/"的GET请求由routes.index函数处理。
最终视图模板⽣成HTML页⾯,返回给浏览器,
浏览器发现要获取style.css会再次向服务器发起请求,app.use()配置了静态⽂件服务器,到⽂件,向客户端返回信息。MVC架构,浏览器发起请求,由路由控制器接受,根据不同的路径定向到不同的控制器。
创建路由规则
<('/hello', routes.hello);
<是路由规则创建函数,接受2个参数,⼀个是请求的路径,⼀个是回调函数。
路径匹配
REST风格的路由规则
REST表征状态转移
GET (path, callback);
POST app.post(path, callback);
PUT app.put(path, callback);
DELETE app.delete(path, callback);
控制权转移
同⼀路径绑定多个路由响应函数,
通过调⽤next(),会将路由控制权转移给后⾯的规则。
什么是模板引擎
是⼀个从页⾯模板根据⼀定的规则⽣成HTML的⼯具。
功能是将页⾯模板和要显⽰的数据结合起来⽣成HTML页⾯。⽬前的主流还是由服务器运⾏模板引擎。
使⽤模板引擎
推荐使⽤ejs
app.js中设置了模板引擎和页⾯模板的位置
app.set('views', __dirname + '/views');
app.set('view engine', 'ejs');
调⽤模板routes/index.js注册页面js特效
模板⽂件index.ejs
<h1><%= title %></h1>
<p>Welcome to <%= title %></p>
页⾯布局
layout.ejs
⽚段视图
partials接受2个参数,第⼀个是⽚段视图的名称,第⼆个是⼀个对象或⼀个数组。
<%- partial('listitem', items)%>
视图助⼿
允许在视图中访问⼀个全局的函数或对象,不⽤每次调⽤视图解析的时候单独传⼊。partial就是视图助⼿。两类,静态(对象)和动态(函数,不接受参数,可以访问req res对象)。
建⽴微博⽹站
功能分析
路由规划
界⾯设计
使⽤Bootstrap
⽤户注册和登录
访问数据库
NoSQL⾮关系型数据库
MongoDB对象数据库,没有表⾏等概念,没有固定的模式和结构。
链接数据库
(
开启服务器
C:\Program Files\mongodb\bin
> -dbpath "E:\mongodbfiles"
打开浏览器输⼊:127.0.0.1:27017/
<
> db.users.insert({'name':'xumingxiang','sex':'man'})在shell 命令窗⼝键⼊如下命令:
> show dbs // 显⽰所有数据库
>show collections // 显⽰当前数据库下的所有集合>db.users.find() // 显⽰users集合下的所有数据⽂档
)
会话⽀持
注册和登⼊
注册页⾯
注册响应
⽤户模型
视图交互
登⼊和登出
页⾯权限控制
发表微博
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论