nodejs中的路由
一、路由初步
url.parse(string).query
|
url.parse(string).pathname |
| |
| |
------ -------------------
http://localhost:8888/start?foo=bar&hello=world
--- -----
| |
| |
querystring.parse(string)["foo"] |
|
querystring.parse(string)["hello"]
创建一个router_1.js
var http = require('http')
var url = require('url')
http.createServer(function(req, res){
res.writeHead(200, {'Content-Type': 'text/html; charset=utf-8'})
if(req.url !== '/favicon.ico') {
var pathName = url.parse(req.url).pathname
console.log(pathName)
}
res.end()
}).listen(8000)
console.log('Server running at http://localhost:8000')
安装supervisor模块，可以不用每次启动js，使用命令supervisor route_1.js
创建一个modules/routers.js
module.exports = {
home: function(req, res) {
res.write('首页')
},
login: function(req, res) {
res.write('登录页面')
},
registor: function (req, res) {
res.write('注册页面')
}
}
修改router_1.js
var router = require('./modules/router')
var pathName = url.parse(req.url).pathname.replace(/\//, '')
console.log(pathName)
try {
router[pathName](req, res)
} catch(err) {
router['home'](req, res)
}
二、读取图片文件
将router_1.js另存为router_2.js
更改头部信息如下
res.writeHead(200,{"Content-Type":"image/jpeg"})；
在modules/router.js中添加读取文件路由
img:function(req,res){
file.readImg('./images/pet.jpg', res)
}
创建modules/file.js
var fs = require('fs')
readImg: function (file, res) {
fs.readFile(file, 'binary', function (err, data) {
if (err) throw err
res.writeHead(200, {'Content-Type': 'image/jpeg'})
res.write(data, 'binary')
res.end()
})
}
此时可以删除router_2.js中的res.end()
在router.js中导入file.js
var file = require('./file')
此时发现如果在输出图片时没法正确显示
res.write('test');
res.write(data, 'binary')
三、路由改造
在file.js删除
res.write('test');
创建文件views/home.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
首页
<!-- ./img为一个图片请求 -->
<img src="./img" alt="">
</body>
</html>
在file.js中创建一个模块readFile方法
readFile: function (file, res, req) {
fs.readFile(file, 'utf-8', function (err, data) {
if (err) throw err
res.writeHead(200, {'Content-Type': 'text/html; charset=utf-8'})
res.write(data)
res.end()
})
},
更改touter2_.js中的代码，保证是一个干净的路由请求
if(req.url !== '/favicon.ico') {
var pathName = url.parse(req.url).pathname.replace(/\//, '')
try {
router[pathName](req, res)
} catch(err) {
router['home'](req, res)
}
}
在router.js中的home路由中设置
home: function(req, res) {
file.readFile('./views/home.html', res, req)
},
四、参数接收
创建文件views/login.html
<form action="./login" method="get" >
<label for="email">
E-mail: <input type="text" name="email" value="" />
</label>
<label for="password">
密码：<input type="password" name="password" value="" />
</label>
<label for="submit">
<input type="submit" value="提交" />
</label>
</form>
更改路由router.js中的login方法
login:function(req,res){
var urlObject = url.parse(req.url,true).query;
console.log(urlObject.email)
console.log(urlObject.password)
file.readFile("./views/login.html",res,req);
}
post请求
修改files.js
引入querystring;
var queryString = require('querystring')
更改login方法
login: function(req, res) {
var post = ''
req.on('data', function(chunk){
post += chunk
})
req.on('end', function() {
var urlObject = queryString.parse(post);
console.log(urlObject.email)
console.log(urlObject.password)
file.readFile("./views/login.html",res,req);
})
},
更改views/login.html中请求的方法
action="./login" method="POST"
如果需要将提交的数据显示到页面
在file.js中添加一个方法
postReadFile: function (file, res, req, post) {
var urlObject = queryString.parse(post)
var array = ['email', 'password']
var reg;
fs.readFile(file, 'utf-8', function(err, data){
if(err) throw err
res.writeHead(200, {'Content_Type': 'text/html; charset=utf-8'})
for(var i = 0; i < array.length; i++) {
reg = new RegExp('{' + array[i] + '}', 'gi')
data = data.replace(reg, urlObject[array[i]])
}
res.write(data)
res.end()
})
},
更改router.js中的login方法
req.on('end', function() {
file.postReadFile('./views/login.html', res, req, post)
})
在login.html中添加显示信息
<div >
Email:{email}, 密码：{password}
</div>
如果第一次的时候我们发现显示不友好
可以设置一个样式
.hide{
display:none
}
在div中添加class="{infoClass}"
在form中设置class="{formClass}"
在file.js中postReadFile中添加处理email和password代码，放在for循环之后
if (urlObject.email && urlObject.password) {
data = data.replace(new RegExp('{infoClass}', 'gi'), '')
data = data.replace(new RegExp('{formClass}', 'gi'), 'hide')
} else {
data = data.replace(new RegExp('{infoClass}', 'gi'), 'hide')
data = data.replace(new RegExp('{formClass}', 'gi'), '')
}
nodejs中的路由的更多相关文章
- nodejs中常用加密算法
在常用的nodejs+express工程中,为了安全在登录及表单传输时,应该都需进行加密传输,目前个人常用到的加密方式有下列几种: 1.Hash算法加密: 创建一个nodejs文件hash.js,输入 ...
- NodeJS中使用swig模板引擎
NodeJS中的默认引擎是jade有点过于复杂,而且不是以HTML为基础的,学习成本和前端适应成本都很大.而ejs虽然简单,但不支持模板导入,而且效率一般. swig的语法简单,学习成本很低,符合常规 ...
- 在Nodejs中贯彻单元测试
在团队合作中,你写好了一个函数,供队友使用,跑去跟你的队友说,你传个A值进去,他就会返回B结果了.过了一会,你队友跑过来说,我传个A值却返回C结果,怎么回事?你丫的有没有测试过啊? 大家一起写个项目, ...
- NodeJs中require use get typescript及其他知识点集合
NodeJs的Express使用 nodejs事件的监听与事件的触发 TypeScript学习笔记 深入浅出Node.js Nodejs开发Office插件 类百度文库文档上传.转换和展示功能项目开源 ...
- NodeJS中常见异步接口定义（get、post、jsonp）
越来越多的人在使用nodeJS,作为一门服务端语言,我们不可避免的要写异步接口(ajax和jsonp).再次强调ajax和jsonp是两个概念,但是由于jquery的封装,使这两种异步接口的调用方式, ...
- .NetCore MVC中的路由（2）在路由中使用约束
p { margin-bottom: 0.25cm; direction: ltr; color: #000000; line-height: 120%; orphans: 2; widows: 2 ...
- .NetCore MVC中的路由（1）路由配置基础
.NetCore MVC中的路由(1)路由配置基础 0x00 路由在MVC中起到的作用 前段时间一直忙于别的事情,终于搞定了继续学习.NetCore.这次学习的主题是MVC中的路由.路由是所有MVC框 ...
- nodejs中获取时间戳、时间差
Nodejs中获取时间戳的方法有很多种,例如: new Date().getTime() Date.now() process.uptime() process.hrtime() 平时想获取一个时间戳 ...
- 在Nodejs中如何调用C#的代码
最近需要在Nodejs中用到C#的代码,从网上了解到可以采用Edgejs来实现Nodejs与C#的代码交互, 直接复制网上的代码运行总是出各种错,填了不少坑,现在把自己的案例代码大致整理一下,方便以后 ...
随机推荐
- PHP 单态设计模式复习
单态设计模式,也可以叫做单例设计模式, 就是一个类只能让它生成一个对象,避免重复的NEW,影响运行效率(每NEW一个对象都会在内存中开辟一块空间) 示例代码 <?php /* * 单态设计模式 ...
- inheritprototype原型继承封装及综合继承最简实例
1.inheritprototype.js ;(function(){ var s = { inheritObject:function(o){//对象继承封装 ...
- Angular - - ngCloak、ngController、ngInit、ngModel
ngCloak ngCloak指令是为了防止Angular应用在启动加载的时候html模板将会被短暂性的展示.这个指令可以用来避免由HTML模板显示造成不良的闪烁效果. 格式: ng-cloak ...
- GCD教程（三）：Dispatch Sources
接上一篇,原帖地址:http://www.dreamingwish.com/dream-2012/intro-to-grand-central-dispatch-part-iii-the-dispat ...
- 建立、配置和使用Activity——使用Bundle在Activity之间交换数据
当一个Activity启动另一个Activity时,常常会有一些数据需要传过去——这就像Web应用从一个Servlet跳到另一个Serlvet时,Web应用习惯把需要交换的数据放入requestSco ...
- 使用ActionBar实现下拉式导航
ActionBar除可提供Tab导航支持之外,还提供了下拉式(DropDown)导航方式.下拉式导航的ActionBar在顶端生成下拉列表框,当用户单击某个列表项时,系统根据用户单击事件导航指定Fra ...
- HTML5 Canvas、内联 SVG、Canvas vs. SVG
canvas 元素用于在网页上绘制图形. 什么是 Canvas? HTML5 的 canvas 元素使用 JavaScript 在网页上绘制图像. 画布是一个矩形区域,您可以控制其每一像素. canv ...
- oracle 查询哪些表分区
如果查询当前用户下得分区表:select * from user_tables where partitioned='YES'如果要查询整个数据库中的分区表:select * from dba_tab ...
- S2SH框架整合(注解)Struts2+Spring+Hibernate+MySql
整合简介 Struts2+Spring4+hibernate4整合,Maven管理jar包,Eclipse工具.注解方式 架构截图 1.Spring整合Hibernate 1.1.创建Hibern ...
- ASP.Net数据库如何存取图片
当我们有大量的图片或者图片比较大时,我们常规的做法可能是保存图片路径,但是也不排除需要将图片直接存放到数据库的情况,此时就需要保存图片到数据库了.这篇文章我会向大家介绍: 如何通过FileUpLoad ...