设为首页收藏本站
开启辅助访问
Node.js开发HTTP服务端 您所在的位置：网站首页 › http请求头和请求体 › Node.js开发HTTP服务端

Node.js开发HTTP服务端

#Node.js开发HTTP服务端| 来源: 网络整理| 查看: 265

一、创建一个简单的HTTP服务器 第一步：导入http模块。 第二步：创建服务对象，createServer()方法的参数是回调函数，回调函数有两个参数，分别是request和response对象。 第三步：启动http服务，listen()方法的第一个参数是端口号，第二个参数是回调函数，当服务启动时，执行回调函数。

示例：

const http = require('http'); //创建服务对象 const server = http.createServer((request,response)=>{     //当服务接收到http请求后执行回调函数     response.end('Hello HTTP Server'); //设置响应体，并返回响应内容 }); //监听端口，启动服务器 server.listen(9000,()=>{     //服务启动成功后执行回调函数     console.log('服务启动成功'); });

注意事项：

使用Ctrl + c停止服务 中文乱码的解决方法 response.setHeader('content-type','text/html;'); //设置响应头 端口被占用的解决方法：杀死占用端口的进程或者换一个端口号 HTTP的默认端口是80 二、HTTP请求 1、获取请求行和请求头

服务端代码

const server = http.createServer((request,response)=>{     console.log(request); });

获取请求的方法

requesthod

获取请求的URL

request.url

获取请求头

requrest.headers

请求头的内容如下

{ host: 'localhost:9000', connection: 'keep-alive', 'cache-control': 'max-age=0', 'sec-ch-ua': '"Not.A/Brand";v="8", "Chromium";v="114", "Google Chrome";v="114"', 'sec-ch-ua-mobile': '?0', 'sec-ch-ua-platform': '"Windows"', 'upgrade-insecure-requests': '1', 'user-agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/114.0.0.0 Safari/537.36', accept: 'text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.7', 'sec-fetch-site': 'none', 'sec-fetch-mode': 'navigate', 'sec-fetch-user': '?1', 'sec-fetch-dest': 'document', 'accept-encoding': 'gzip, deflate, br', 'accept-language': 'zh-CN,zh;q=0.9', cookie: 'Idea-8525aa25f9=d3805295-ca45-4555-9a3f-37900fb1ec59' } 2、获取请求体

创建一个 HTTP 服务器，并在 request 对象上监听 data 和 end 事件。当浏览器发送请求时，将请求体分块发送。在每个分块被接收时，都会触发一次data事件，需要将其转换为字符串并将其附加到 body 变量中。当请求体接受完毕后， end 事件被触发，此时打印出请求体，并向浏览器发送响应。

const http = require('http'); const server = http.createServer((request,response)=>{     //当服务接收到http请求后执行回调函数     response.setHeader('content-type','text/html;charset=utf-8'); //设置响应头         let body = '';         request.on('data',chunk=>{         body += chunk.toString();     });         request.on('end',()=>{         console.log(body);         response.end('Hello HTTP Server'); //设置响应体，并返回响应内容     }); }); //监听端口，启动服务器 server.listen(9000,()=>{     //服务启动成功后执行回调函数     console.log('服务启动成功'); }); 3、获取请求路径和请求参数 （1）方式一：

请求URL：http://localhost:9000/search?param=hello 使用url模块解析请求路径和参数

const url = require('url');

1.解析前的URL

console.log(request.url);

结果是"请求路径 + 请求参数"

/search?param=hello

2.解析request.url，url.parse()不传第二个参数

let res = url.parse(request.url); //解析URL console.log(res);

解析后的res对象，请求路径是pathname属性，请求参数query属性被解析成字符串。

Url { protocol: null, slashes: null, auth: null, host: null, port: null, hostname: null, hash: null, search: '?param=hello', query: 'param=hello', pathname: '/search', path: '/?param=hello', href: '/?param=hello' }

注意：请求参数query属性是一个字符串

3.解析request.url，url.parse()的第二个参数是true

let res = url.parse(request.url,true); //获取请求路径，第二个参数为true表示解析请求参数

解析后的res对象，请求参数被解析成对象

Url { protocol: null, slashes: null, auth: null, host: null, port: null, hostname: null, hash: null, search: '?param=hello', query: [Object: null prototype] { param: 'hello' }, pathname: '/search', path: '/?param=hello', href: '/?param=hello' }

注意：请求参数query属性是一个对象，请求参数被拆成了键值对的形式

4.完整示例

const http = require('http'); const url = require('url'); const server = http.createServer((request,response)=>{     let res = url.parse(request.url,true); //获取请求路径，第二个参数为true表示解析请求参数         let pathname = res.pathname; //请求路径     let param = res.query.param; //请求参数     console.log(pathname,param);         //当服务接收到http请求后执行回调函数     response.setHeader('content-type','text/html;charset=utf-8'); //设置响应头     response.end('Hello HTTP Server'); //设置响应体，并返回响应内容 }); //监听端口，启动服务器 server.listen(9000,()=>{     //服务启动成功后执行回调函数     console.log('服务启动成功'); });

请求http://localhost:9000/search?param=hello的执行结果

/search hello （2）方式二（推荐使用）：

使用URL对象解析请求路径

//第一个参数是请求路径和参数，第二个参数是请求的IP和端口 let url = new URL(request.url,'http://localhost:9000'); console.log(url);

打印结果

URL { href: 'http://localhost:9000/search?param=hello', origin: 'http://localhost:9000', protocol: 'http:', username: '', password: '', host: 'localhost:9000', hostname: 'localhost', port: '9000', pathname: '/search', search: '?param=hello', searchParams: URLSearchParams { 'param' => 'hello' }, hash: '' }

注：pathname属性是请求路径，searchParams属性是请求参数

完整实例

const http = require('http'); const server = http.createServer((request,response)=>{     let url = new URL(request.url,'http://localhost:9000');         console.log(url.pathname); //使用get方法获取请求参数的value，参数是key     console.log(url.searchParams.get('param'));     //当服务接收到http请求后执行回调函数     response.setHeader('content-type','text/html;charset=utf-8'); //设置响应头     response.end('Hello HTTP Server'); //设置响应体，并返回响应内容 }); //监听端口，启动服务器 server.listen(9000,()=>{     //服务启动成功后执行回调函数     console.log('服务启动成功'); });

访问http://localhost:9000/search?param=hello的执行结果

/search hello 三、HTTP响应 1、设置响应行和响应头 （1）设置响应状态码和状态描述 const http = require('http'); const server = http.createServer((request,response)=>{     //当服务接收到http请求后执行回调函数     response.statusCode = 202;  //设置响应状态码 response.statusMessage = 'hello,world!'; //设置响应状态描述     response.end('Hello HTTP Server'); //设置响应体，并返回响应内容 }); //监听端口，启动服务器 server.listen(9000,()=>{     //服务启动成功后执行回调函数     console.log('服务启动成功'); });

image.png

（2）设置响应头

使用response.setHeader(key,value)方法，第一个参数是响应头名称，第二个参数是响应头的值

response.setHeader('content-type','text/html;charset=utf-8'); //设置响应头 response.setHeader('Server','Node.js'); //设置服务器名称 response.setHeader('Customer-Header','hello,world!'); //设置自定义响应头

image.png

（3）设置多个响应头 response.setHeader('multiple-header',['first-header','second-header','third-header']);

image.png

2、设置响应体 （1）使用response.write(内容);设置响应体 response.write('hello,'); response.write('world!\n'); response.end();

页面显示“hello,world!”

（2）使用response.end(内容);设置响应体

response.end()方法会在设置响应体之后，将响应返回给浏览器。

response.end('Hello HTTP Server'); //设置响应体，并返回响应内容

页面显示“Hello HTTP Server”

3、静态资源 （1）获取静态资源

如果一个HTML页面引用了静态资源，则浏览器会发送多个请求，每个请求都会获取一个静态资源，例如：css、javascript、图片等。

image.png

浏览器发送的请求

image.png

（2）处理静态资源请求

因为每个静态资源都对应一个请求路径（http://localhost:9000/请求路径/静态资源名称），因此需要对静态资源请求进行处理，当请求到达时，读取对应的静态资源文件，然后将静态资源的内容返回给浏览器。

（3）编写一个静态资源服务

为了演示静态资源请求和普通的请求一样，下面的代码直接将请求路径写死在程序中，在实际开发中不应该这样写。

目录结构

image.png

index.html

            Document                                                                                                                                                                                                                                

index.css

td {     padding: 20px 40px; } table tr:nth-child(odd){     background: #aef; } table tr:nth-child(even){     background: #fcb; } table,td{     border-collapse: collapse; }

index.js

let tds = document.querySelectorAll('td'); tds.forEach(item => {     item.onclick = function(){         this.style.background = '#222';     } });

10_响应练习.js

const http = require('http'); const fs = require('fs'); const server = http.createServer((requrest,response)=>{     //获取请求URL的路径     let {pathname} = new URL(requrest.url,'http://localhost:9000');     if(pathname === '/'){         let html = fs.readFileSync(__dirname + '/index.html');         response.end(html); //end方法的参数可以是字符串，也可以是buffer     }else if(pathname === '/index.css'){         let css = fs.readFileSync(__dirname + '/index.css');         response.end(css);     }else if(pathname === '/index.js'){         let js = fs.readFileSync(__dirname + '/index.js');         response.end(js);     }else{         response.statusCode = 404;         response.end('404 Not Found');     } }); server.listen(9000,()=>{     console.log('服务已启动......'); });


【本文地址】

公司简介

联系我们

今日新闻

    推荐新闻

    专题文章
      CopyRight 2018-2019 实验室设备网 版权所有