node服务器的页面文件respond,如何创建一个基于Node的HTTP服务器

首先创建一个HTTP服务器。

AAffA0nNPuCLAAAAAElFTkSuQmCCvar http = require('http');function serve(request,response) {

console.log(request.method);    //请求的方法

console.log(request.url);  //请求里的url,只含有路径名,并不是完整的url

console.log(request.header) //获取请求头

response.statusCode = 200;

//设置响应类型,编码为utf-8。

//服务器返回资源给浏览器时,还应该告诉浏览器这是什么类型的文件,以什么方式解析。不指定的话可能会造成乱码

response.setHeader('Content-Type','text/html;charset=utf-8');

response.setHeader('name','zfpx');

response.write(new Date().toString());

response.end();

}var server = http.createServer(serve);

server.listen(3000);

AAffA0nNPuCLAAAAAElFTkSuQmCC

如果我们希望读取其他文件的内容,则需要先导入fs模块,该模块是读取文件的模块。

AAffA0nNPuCLAAAAAElFTkSuQmCCvar fs = require('fs');

function serve(request,response) {    var url = request.url;//设置响应类型,编码为utf-8。

//服务器返回资源给浏览器时,还应该告诉浏览器这是什么类型的文件,以什么方式解析

response.setHeader('Content-Type','text/html;charset=utf-8');    //如果我们希望返回的是其他文件的内容,则需要先读取其他文件,这时需要fs模块来读取文件

fs.readFile('index.html',function(err,data) {

response.write(data);

response.end();

})

}

AAffA0nNPuCLAAAAAElFTkSuQmCC

但是这样又有一个问题,就是:在对返回的HTML代码开始解析时,解析过程中如果遇到引用的服务器上的资源(额外的CSS,JS代码,图片等资源),需要再次向服务器发送请求,但是不管是发送什么请求,服务器返回的都是index.html文件。这时,我们就需要对不同的请求资源做一个判断,让其返回不同类型的资源。

AAffA0nNPuCLAAAAAElFTkSuQmCCfunction serve(request,response) {    var url = request.url;    if (url == '/') {        //设置响应类型,编码为utf-8。

//服务器返回资源给浏览器时,还应该告诉浏览器这是什么类型的文件,以什么方式解析

response.setHeader('Content-Type','text/html;charset=utf-8');        //如果我们希望返回的是其他文件的内容,则需要先读取其他文件,这时需要fs模块来读取文件

fs.readFile('index.html',function(err,data) {

response.write(data);

response.end();

})

}else if (url == '/style.css') {

response.setHeader('Content-Type','text/css;charset=utf-8');        //如果我们希望返回的是其他文件的内容,则需要先读取其他文件,这时需要fs模块来读取文件

fs.readFile('style.css',function(err,data) {

response.write(data);

response.end();

})

}

AAffA0nNPuCLAAAAAElFTkSuQmCC

一个页面里,我们可能会请求非常多的静态资源,如果每次都加一个else if 显然让页面更复杂,且不利于维护。所以我们希望将所有的静态资源请求都封装在一个函数里。

AAffA0nNPuCLAAAAAElFTkSuQmCCfunction parseMime(pathname) {    var reg = /\.(HTML|JS|CSS|JSON|TXT|ICO|JPG)/i;    if (reg.test(pathname)) {        //获取请求文件的后缀名

var suffix = reg.exec(pathname)[1].toUpperCase();        //根据请求文件的后缀名获取到当前文件的MIME类型

var suffixMIME = "text/plain";        switch(suffix) {            case "HTML":

suffixMIME = "text/html";                break;            case "CSS":

suffixMIME = "text/css";                break;            case "JS":

suffixMIME = "text/javascript";                break;            case "JSON":

suffixMIME = "application/json";                break;            case "ICO":

suffixMIME = "application/octet-stream";                break;            case "JPG":

suffixMIME = "image/jpg";                break;

}

}    return suffixMIME;

}

AAffA0nNPuCLAAAAAElFTkSuQmCC

实际上,Node中还提供了一个第三方的模块能够自动帮我们判断文件的MIME类型,我们这里还需要用到一个第三方的模块"mine"。

AAffA0nNPuCLAAAAAElFTkSuQmCCvar mime = require('mime');function serve(request,response) {    var url = request.url;    if (url == '/') {        //设置响应类型,编码为utf-8。

//服务器返回资源给浏览器时,还应该告诉浏览器这是什么类型的文件,以什么方式解析

response.setHeader('Content-Type','text/html;charset=utf-8');        //如果我们希望返回的是其他文件的内容,则需要先读取其他文件,这时需要fs模块来读取文件

fs.readFile('index.html',function(err,data) {

response.write(data);

response.end();

})

}else{

static(url,response)

}

}function static(url,response) {

response.setHeader('Content-Type',mime.lookup(url) + ';charset=utf-8');    //如果我们希望返回的是其他文件的内容,则需要先读取其他文件,这时需要fs模块来读取文件

fs.readFile(url.slice(1),function(err,data) {

response.write(data);

response.end();

})

}

AAffA0nNPuCLAAAAAElFTkSuQmCC

现在我们的url都是类似http://localhost:3000/index.html这样的,就是客户端只是单纯的获取数据,并不涉及向服务器端发送数据。

前面我们说过,request.url获取的是'3000:'之后的内容,那么当我们需要向服务器传一些内容的时候,比如说http://localhost:3000/index.html/?name="xiaoyu"。这时request.url获取的就是/index.html/?name="xiaoyu"。

这样的url显然不能再作为我们判断路径的依据,所以我们得进一步处理这个url。其实node提供了一个更加强大的url解析库给我们,这个库就是”url“。这个库能够解析整个完整的url路径。

原文出处:https://www.cnblogs.com/yuliangbin/p/9429062.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值