我们打开浏览器浏览网页时,点击上面不同的模块,地址栏中的路由会发生相应的变化,从而,浏览器向服务器发起请求的内容也会发生改变,那么服务端,是如何来做的呢?

服务端也是,通过路由来做出不同的响应的,我们已经知道,服务器对象的参数有request,和response两个参数。request里就携带了,浏览器请求所携带的值。

request.url返回的是浏览器中路由的值

我们可以根据这个值来判断,服务器需要返回给浏览器什么内容,

下面来看一下server.js的代码:

var http = require("http");
var fs = require("fs"); var startServer = function(){
var onRequest = function(request,response){
console.log("request received"+request.url);
if(request.url==="/"||request.url==="/home"){
response.writeHead(200,{"Content-Type":"text/html"});
fs.createReadStream(__dirname+"/index.html","utf8").pipe(response);
}else if(request.url==="/review"){
response.writeHead(200,{"Content-Type":"text/html"});
fs.createReadStream(__dirname+"/review.html","utf8").pipe(response);
}else if(request.url==="/api"){
response.writeHead(200,{"Content-Type":"application/json"});
var jsonObj={name:"lili",job:"coder",age:18};
response.end(JSON.stringify(jsonObj));
}else{
response.writeHead(200,{"Content-Type":"text/html"});
fs.createReadStream(__dirname+"/404.html","utf8").pipe(response);
} } var server = http.createServer(onRequest);
//最后让服务器监听一个端口
server.listen(3000,"127.0.0.1");//还可以加第二个参数 127.0.0.1代表的是本地 console.log("server started on localhost port 3000");//加一个服务器启动起来的提示
} module.exports.startServer=startServer;

上面server.js中,根据不同的路由,让服务器返回给浏览器不同的内容,当找不到内容时,返回一个404页面

把server.js引入到app.js中

var server = require("./server");

server.startServer();

执行node app

在浏览器中 localhost:3000

后面跟上不同的路由,会显示不同的页面,当匹配不到路由时,会显示404页面!!!

路由重构过程

上面的代码又显的有些臃肿,需要来重构一下,怎么来重构呢?页面中许多路由路径,还有if判断显得有些臃肿,所以就重构它:

先从server.js开始,我们可以将这些if else判断语句注释掉,用一个函数代替

var http = require("http");
var fs = require("fs"); var startServer = function(route){
var onRequest = function(request,response){
console.log("request received"+request.url);
route(request.url);
// if(request.url==="/"||request.url==="/home"){
// response.writeHead(200,{"Content-Type":"text/html"});
// fs.createReadStream(__dirname+"/index.html","utf8").pipe(response);
// }else if(request.url==="/review"){
// response.writeHead(200,{"Content-Type":"text/html"});
// fs.createReadStream(__dirname+"/review.html","utf8").pipe(response);
// }else if(request.url==="/api"){
// response.writeHead(200,{"Content-Type":"application/json"});
// var jsonObj={name:"lili",job:"coder",age:18};
// response.end(JSON.stringify(jsonObj));
// }else{
// response.writeHead(200,{"Content-Type":"text/html"});
// fs.createReadStream(__dirname+"/404.html","utf8").pipe(response);
// } } var server = http.createServer(onRequest);
//最后让服务器监听一个端口
server.listen(3000,"127.0.0.1");//还可以加第二个参数 127.0.0.1代表的是本地 console.log("server started on localhost port 3000");//加一个服务器启动起来的提示
} module.exports.startServer=startServer;

那么响应的app.js中startServer函数也要传进去对应的参数

var server = require("./server");
var router = require("./router"); server.startServer(router.route);

那么app.js中传给startServer函数的route,从哪来呢?

我们重新建立一个模块,叫router.js,它里面应该导出一个route函数

route需要有一个request.url参数

如下:

function route(pathname){
console.log("Routing request for"+pathname);
} module.exports.route=route;

上面route函数的pathname参数是在server.js里调用这个函数时传进去的,而api调用startServer时,传进去的是route函数本身,并不需要传参数。

做完上面的,服务器的请求,就到route.js中了,我们需要在route.js中对服务器请求做一些响应,当然如果直接在route.js中把一些if else写进去,还是比较乱,没多大意义,我们可以再重新建立一个模块:handler.js来写这些响应代码:

重构的目的肯定是想,让代码更整洁,更“智能化”,所谓的智能化,就是你只需要改变一小点地方,代码会把相应的改变,帮自己改变,不用自己去改变更多的代码。在代码中的体现,就是封装方法,传入不一样的参数,这个方法做出不一样的操作。那么,在现在的路由中,改变的是request.url,我们需要封装一个方法,根据request.url的不同,而做出对应的响应。下面的handler.js里面,盛放的是一些,对应的函数方法。

handler.js:

function home(){
console.log("Executing 'home' handler");
} function review(){
console.log("Executing 'review' handler");
} function api_records(){
console.log("Executing 'api_records' handler");
} module.exports={
home,
review,
api_records
}

现在方法有了,需要与request.url发生对应关系,我们打算把这些对应关系放在api.js中:

api.js:

var server = require("./server");
var router = require("./router");
var handler = require("./handler"); var handle = {}; handle["/"]=handler.home;
handle["/home"]=handler.home;
handle["/review"]=handler.review;
handle["/api_records"]=handler.api_records; server.startServer(router.route,handle);

我们把路径与方法的对应关系,写在了一个handle对象中,然后传给了startServer方法内

那么,stratServer方法需要作出响应更改:

server.js:

var http = require("http");
var fs = require("fs"); var startServer = function(route,handle){
var onRequest = function(request,response){
console.log("request received"+request.url);
route(handle,request.url);
// if(request.url==="/"||request.url==="/home"){
// response.writeHead(200,{"Content-Type":"text/html"});
// fs.createReadStream(__dirname+"/index.html","utf8").pipe(response);
// }else if(request.url==="/review"){
// response.writeHead(200,{"Content-Type":"text/html"});
// fs.createReadStream(__dirname+"/review.html","utf8").pipe(response);
// }else if(request.url==="/api"){
// response.writeHead(200,{"Content-Type":"application/json"});
// var jsonObj={name:"lili",job:"coder",age:18};
// response.end(JSON.stringify(jsonObj));
// }else{
// response.writeHead(200,{"Content-Type":"text/html"});
// fs.createReadStream(__dirname+"/404.html","utf8").pipe(response);
// } } var server = http.createServer(onRequest);
//最后让服务器监听一个端口
server.listen(3000,"127.0.0.1");//还可以加第二个参数 127.0.0.1代表的是本地 console.log("server started on localhost port 3000");//加一个服务器启动起来的提示
} module.exports.startServer=startServer;

我们把handle对象传给了stratServer方法,然后又传给了,route方法,那么route方法,需要更改:

route.js:

function route(handle,pathname){
console.log("Routing request for"+pathname);
if(typeof handle[pathname] === 'function'){
handle[pathname]();
}else{
console.log("No handle for" + pathname);
}
} module.exports.route=route;

route方法内,判断当前路径对应的值是否是一个函数,是的话,执行这个函数,不是的话,后面处理,应该是跳转404页面,到后面处理

下一步,我们需要让handle方法做出相应,也就是响应给页面对应的内容,那么,我们就需要用到response对象,我们可以在stratServer中传给route方法:

var http = require("http");
var fs = require("fs"); var startServer = function(route,handle){
var onRequest = function(request,response){
console.log("request received"+request.url);
route(handle,request.url,response);
// if(request.url==="/"||request.url==="/home"){
// response.writeHead(200,{"Content-Type":"text/html"});
// fs.createReadStream(__dirname+"/index.html","utf8").pipe(response);
// }else if(request.url==="/review"){
// response.writeHead(200,{"Content-Type":"text/html"});
// fs.createReadStream(__dirname+"/review.html","utf8").pipe(response);
// }else if(request.url==="/api"){
// response.writeHead(200,{"Content-Type":"application/json"});
// var jsonObj={name:"lili",job:"coder",age:18};
// response.end(JSON.stringify(jsonObj));
// }else{
// response.writeHead(200,{"Content-Type":"text/html"});
// fs.createReadStream(__dirname+"/404.html","utf8").pipe(response);
// } } var server = http.createServer(onRequest);
//最后让服务器监听一个端口
server.listen(3000,"127.0.0.1");//还可以加第二个参数 127.0.0.1代表的是本地 console.log("server started on localhost port 3000");//加一个服务器启动起来的提示
} module.exports.startServer=startServer;

在router.js中也要穿进去:再传给handle方法:

function route(handle,pathname,response){
console.log("Routing request for"+pathname);
if(typeof handle[pathname] === 'function'){
handle[pathname](response);
}else{
console.log("No handle for" + pathname);
}
} module.exports.route=route;

这样就可以在handle中,用response对象,响应给页面内容了

var fs = require("fs");

function home(response){
response.writeHead(200,{"Content-Type":"text/html"});
fs.createReadStream(__dirname+"/index.html","utf8").pipe(response);
} function review(response){
response.writeHead(200,{"Content-Type":"text/html"});
fs.createReadStream(__dirname+"/review.html","utf8").pipe(response);
} function api_records(response){
response.writeHead(200,{"Content-Type":"application/json"});
var jsonObj={name:"lili",job:"coder",age:18};
response.end(JSON.stringify(jsonObj));
} module.exports={
home,
review,
api_records
}

此时,我们在localhost:3000  分别输入 /     /home    /review    /api_records    都会响应出不同的内容!!

下面处理一下,当没有对应路径的方法时,跳转到404页面:

在router.js中变动:

var fs = require("fs");

function route(handle,pathname,response){
console.log("Routing request for"+pathname);
if(typeof handle[pathname] === 'function'){
handle[pathname](response);
}else{
response.writeHead(200,{"Content-Type":"text/html"});
fs.createReadStream(__dirname+"/404.html","utf8").pipe(response);
}
} module.exports.route=route;

以上就是 重构路由代码的整个过程

成型路由代码

上线的重构过程有些乱,下面把整个路由重构后的代码帖出来:

api.js:

var server = require("./server");
var router = require("./router");
var handler = require("./handler"); var handle = {}; handle["/"]=handler.home;
handle["/home"]=handler.home;
handle["/review"]=handler.review;
handle["/api_records"]=handler.api_records; server.startServer(router.route,handle);

server.js:

var http = require("http");

var startServer = function(route,handle){
var onRequest = function(request,response){
console.log("request received"+request.url);
route(handle,request.url,response); } var server = http.createServer(onRequest);
//最后让服务器监听一个端口
server.listen(3000,"127.0.0.1");//还可以加第二个参数 127.0.0.1代表的是本地 console.log("server started on localhost port 3000");//加一个服务器启动起来的提示
} module.exports.startServer=startServer;

router.js:

var fs = require("fs");

function route(handle,pathname,response){
console.log("Routing request for"+pathname);
if(typeof handle[pathname] === 'function'){
handle[pathname](response);
}else{
response.writeHead(200,{"Content-Type":"text/html"});
fs.createReadStream(__dirname+"/404.html","utf8").pipe(response);
}
} module.exports.route=route;

handler.js:

var fs = require("fs");

function home(response){
response.writeHead(200,{"Content-Type":"text/html"});
fs.createReadStream(__dirname+"/index.html","utf8").pipe(response);
} function review(response){
response.writeHead(200,{"Content-Type":"text/html"});
fs.createReadStream(__dirname+"/review.html","utf8").pipe(response);
} function api_records(response){
response.writeHead(200,{"Content-Type":"application/json"});
var jsonObj={name:"lili",job:"coder",age:18};
response.end(JSON.stringify(jsonObj));
} module.exports={
home,
review,
api_records
}

上面就是成型的路由代码了,以后再添加新的路由,我们只需要该两处地方,1是,api中路径与handle方法的对应关系,2是,在handler.js中新增对应的方法!!!

比如说,我们加个text的路由,让它响应文本内容

api.js中:

var server = require("./server");
var router = require("./router");
var handler = require("./handler"); var handle = {}; handle["/"]=handler.home;
handle["/home"]=handler.home;
handle["/review"]=handler.review;
handle["/api_records"]=handler.api_records;
handle["/text"]=handler.text; server.startServer(router.route,handle);

handler.js中:

var fs = require("fs");

function home(response){
response.writeHead(200,{"Content-Type":"text/html"});
fs.createReadStream(__dirname+"/index.html","utf8").pipe(response);
} function review(response){
response.writeHead(200,{"Content-Type":"text/html"});
fs.createReadStream(__dirname+"/review.html","utf8").pipe(response);
} function api_records(response){
response.writeHead(200,{"Content-Type":"application/json"});
var jsonObj={name:"lili",job:"coder",age:18};
response.end(JSON.stringify(jsonObj));
} function text(response){
response.writeHead(200,{"Content-Type":"text/plain;charset=UTF-8"});
response.end("文本内容");
} module.exports={
home,
review,
api_records,
text
}

ok!!!

nodejs 用http模块搭建的服务器的路由,以及路由代码的重构过程的更多相关文章

  1. 使用nodejs的net模块创建TCP服务器

    使用nodejs的net模块创建TCP服务器 laiqun@msn.cn Contents 1. 代码实现 2. 使用telnet连接服务器测试 3. 创建一个TCP的client 1. 代码实现 ; ...

  2. 使用nodejs的http模块创建web服务器

    使用nodejs的http模块创建web服务器 laiqun@msn.cn Contents 1. web服务器基础知识 2. Node.js的Web 服务器 3. 代码实现 1. web服务器基础知 ...

  3. Node.js 蚕食计划(二)—— 使用 http 模块搭建 Web 服务器

    Node.js 开发的目的就是为了用 JavaScript 编写 Web 服务器程序 这次就来介绍用 http 模块搭建服务器 一.项目构建 每个 Node 程序都可以看作一个模块,而每个模块都应该有 ...

  4. ubuntu 搭建samba服务器&挂载(mount)代码到本地

    一.搭建samba服务器 1.下载: sudo apt-get install samba samba-common 2.创建共享文件夹MyShare: mkdir /home/user/MyShar ...

  5. eventlet 模块搭建 WEB 服务器

    eventlet这个强悍的东东,看到我同事的一些整理.故贴出来,大家一起分享~ motivation 114.113.199.11服务器上nova服务中基于python eventlet实现的定时任务 ...

  6. Centos7.2 搭建Lamp服务器以及迁移WordPress个人博客详细过程

    其实自己的博客搭了有段时间了,但是由于自己不太确定是不是一定要用wd的框架,以及实验室公网服务器的不稳定,就一直荒废着. 今天偶然间看到了腾讯云对于学生的优惠活动,毕业之前每月只要8元的云服务器(就算 ...

  7. linux文件映射到windows(方便用虚拟机搭建linux服务器,用本地windows代码编辑)

    1,安装docker: https://docs.docker.com/install/linux/docker-ce/centos/ 2,linux上创建好需要共享的目录 /data/share(可 ...

  8. pm2命令,端口查询,mongodb服务启动,nginx服务启动,n模块的使用,搭建nodejs服务器环境,搭建oracledb服务器环境 linux的环境搭建

    pm2命令 pm2 ls //查询pm2 启动的列表 pm2 start app.js //启动文件 pm2 restart app //重启项目 pm2 logs app //监控项目执行日志打印 ...

  9. nodejs基础 用http模块 搭建一个简单的web服务器 响应JSON、html

    前端在开发中,大多会想浏览器获取json数据,下面来用nodejs中的http模块搭建一个返回json数据的服务器 var http = require("http"); var ...

随机推荐

  1. awr报告没有数据11.2.0.3

    有个朋友,反馈AWR没有数据: 咨询版本:oracle企业版本11.2.0.3 SQL> select * from v$version; BANNER -------------------- ...

  2. Django2.0 开始一个项目

    python项目运行环境: 安装虚拟环境工具   pip install virtualenv 使用虚拟环境: 创建虚拟环境: virtualenv  <虚拟环境名称> 进去虚拟环境: S ...

  3. Linux查看系统及版本信息

    1.查看操作系统版本cat /proc/version 2.查看系统发行版cat /etc/issue 或cat /etc/redhat-release 3.查看系统内核信息uname -a

  4. linux内核过高导致vm打开出错修复脚本

    #!/bin/bashVMWARE_VERSION=workstation-15.1.0TMP_FOLDER=/tmp/patch-vmwarerm -fdr $TMP_FOLDERmkdir -p ...

  5. 关于Vue中,checkBox等组件在赋值后,点击切换页面未及时更新问题

    我们经常碰到这样的问题,在v-for循环中,给某些组件(此处以checkBox为例)赋值后,组件并不能正常切换, 这是因为数据层太多,render函数没有自动更新,需手动强制刷新. 解决方法:在切换c ...

  6. React/组件通信

    组件通信可以分为以下几种: 父组件向子组件通信 子组件向父组件通信 跨级组件的通信及context 没有嵌套关系的组件通信 父组件向子组件通信   父组件通过props向子组件传递需要的信息.   子 ...

  7. K2 BPM_“选BPM还是RPA?”,这不是一道单选题_全业务流程管理专家

    在我们和企业讨论流程自动化的时候,经常会被问到一个问题,“公司目前正在调研市面上的业务流程自动化产品,我们已经把选择范围缩小到了BPM和RPA之间.我们应该怎么选择?BPM能做的好像RPA都能做到.” ...

  8. Hibernate入门第一讲——Hibernate框架的快速入门

    Hibernate框架的概述 什么是框架? 框架指的是软件的半成品,已经完成了部分功能. JavaEE开发的三层架构 了解框架的基本概念之后,我们就来看看Hibernate框架处于JavaEE开发的经 ...

  9. vue嵌套数据多层级里面的数据不自动更新渲染dom

    可以尝试手动调用更新 主要代码: vm.$forceUpdate() 官网

  10. Microsoft 中间语言