文章目录
- [创建 HTTP 服务](#创建 HTTP 服务)
- [创建 HTTP 服务注意事项:](#创建 HTTP 服务注意事项:)
- [获取 HTTP 请求报文参数](#获取 HTTP 请求报文参数)
- [获取 URL 请求路径以及请求路径查询字符串](#获取 URL 请求路径以及请求路径查询字符串)
- [获取 URL 请求路径以及请求路径查询字符串(`推荐使用`)](#获取 URL 请求路径以及请求路径查询字符串(
推荐使用
)) - 注意事项
- [设置返回的 HTTP 响应报文](#设置返回的 HTTP 响应报文)
- [网页中的 URL](#网页中的 URL)
- [设置资源类型(mime类型 【Content-Type:)](#设置资源类型(mime类型 【Content-Type:))
创建 HTTP 服务
javascript
//1. 导入 http 模块
const http = require('http');
//2. 创建服务对象 create 创建 server 服务
// request 是一个包裹了请求报文的对象, 通过 request 对象可以获得请求报文的数据
// response 是一个包裹了响应报文的对象, 通过 response 对象可以设置响应报文
const server = http.createServer((request, response) => {
response.setHeader('content-type', 'text/html;charset=utf-8'); //设置响应体解码规则
response.end('你好,欢迎请求服务'); //返回响应体内容
});
//3. server.listen 方法 监听端口, 启动服务
server.listen(8080, () => {
console.log('服务已经启动, 端口 8080 监听中...');
});
创建 HTTP 服务注意事项:
- 命令行
ctrl + c
用来停止服务 - 当服务启动后,更新代码 必须
重启服务
才能生效 - 响应内容
中文乱码的解决办法
javascript
response.setHeader('content-type','text/html;charset=utf-8');
- 端口号被占用时
- 关闭当前正在运行监听端口的服务 ( 使用较多 )
- 修改其他端口号
- HTTP 协议
默认端口是 80
。HTTPS 协议的默认端口是 443
, HTTP 服务开发常用端口有3000,8080,8090,9000
等
获取 HTTP 请求报文参数
描述 | 语法 |
---|---|
获取请求方法 |
request.method |
获取请求http协议版本 |
request.httpVersion |
设置响应响应头 信息 |
response.setHeader('key键名', '键值') |
获取请求路径 |
request.url (包含请求路径和查询字符串) |
获取URL 路径 |
require('url').parse(request.url).pathname |
获取请求URL 查询字符串 |
require('url').parse(request.url, true).query |
获取请求头 |
request.headers |
获取请求体 |
request.on('data', function(chunk){}) request.on('end', function(){}); |
javascript
//1. 导入 http 模块
const http = require('http');
//2. 创建服务对象 create 创建 server 服务
// request 是一个包裹了请求报文的对象, 通过 request 对象可以获得请求报文的数据
// response 是一个包裹了响应报文的对象, 通过 response 对象可以设置响应报文
const server = http.createServer((request, response) => {
response.setHeader('content-type', 'text/html;charset=utf-8'); //设置响应体解码规则
// console.log(request.method); //获取请求方法
// console.log(request.httpVersion); //获取HTTP协议版本
// console.log(request.url); //获取请求路径 (不包含IP/域名/端口)
// console.log(request.headers); //获取请求头报文
// response.end('你好,欢迎请求服务'); //返回响应体内容
//获取请求体
let datablock = "";
/** @绑定data事件 ***/
request.on('data', (chunk) => {
datablock += chunk.toString()
})
/** @绑定end事件 **/
request.on('end', () => {
console.log("获取到完整的请求体数据", datablock);
response.setHeader('content-type', 'text/html;charset=utf-8'); //设置响应体解码规则
response.end('你好,欢迎请求服务'); //返回响应体内容
})
});
//3. server.listen 方法 监听端口, 启动服务
server.listen(8080, () => {
console.log('服务已经启动, 端口 8080 监听中...');
});
获取 URL 请求路径以及请求路径查询字符串
javascript
// 导入 http 模块
const http = require('http');
//导入 url 模块
const url = require('url');
// 创建服务对象 create 创建 server 服务
// request 是一个包裹了请求报文的对象, 通过 request 对象可以获得请求报文的数据
// response 是一个包裹了响应报文的对象, 通过 response 对象可以设置响应报文
const server = http.createServer((request, response) => {
let res = url.parse(request.url).pathname; //获取到请求路径
//第二个参数传为true,可进行对请求路径查询字符串解包成对象键值对
let queryData = url.parse(request.url, true);
//{ num: '"你好呀"', name: '"我很好"' },
console.log(queryData);
response.setHeader('content-type', 'text/html;charset=utf-8'); //设置响应体解码规则
response.end('你好,欢迎请求服务'); //返回响应体内容
});
// server.listen 方法 监听端口, 启动服务
server.listen(8080, () => {
console.log('服务已经启动, 端口 8080 监听中...');
});
获取 URL 请求路径以及请求路径查询字符串(推荐使用
)
new URL
javascript
// 导入 http 模块
const http = require('http');
// 创建服务对象 create 创建 server 服务
// request 是一个包裹了请求报文的对象, 通过 request 对象可以获得请求报文的数据
// response 是一个包裹了响应报文的对象, 通过 response 对象可以设置响应报文
const server = http.createServer((request, response) => {
let url = new URL(request.url, "http://127.0.0.1:8080/");
/** @获取请求路径 **/
console.log(url.pathname);
/*** @获取查询字符串 **/
console.log(url.searchParams.get("num")); //传入key
response.setHeader('content-type', 'text/html;charset=utf-8'); //设置响应体解码规则
response.end('你好,欢迎请求服务'); //返回响应体内容
});
// server.listen 方法 监听端口, 启动服务
server.listen(8080, () => {
console.log('服务已经启动, 端口 8080 监听中...');
});
注意事项
- request.url 只能获取路径以及查询字符串,无法获取 URL 中的域名以及协议的内容
- request.headers 将请求信息转化成一个对象,并将属性名都转化成了
『小写』
- 关于路径:如果访问网站的时候,只填写了 IP 地址或者是域名信息,此时请求的路径为
『 / 』
- 关于 favicon.ico:这个请求是属于浏览器自动发送的请求
设置返回的 HTTP 响应报文
javascript
// 导入 http 模块
const http = require('http');
const server = http.createServer((request, response) => {
response.statusCode = "505"; /*** @设置响应状态码 ***/
response.statusMessage = 'no-0isok'; /*** @设置响应状态描述 ***/
response.setHeader('content-type', 'text/html;charset=utf-8'); //设置响应头配置参数
response.write('你好,欢迎请求服务'); /** @设置响应体 ***/
response.write('我很好'); /** @设置响应体 ***/
response.write('天气好'); /** @设置响应体 ***/
response.end(); //返回响应体内容
});
// server.listen 方法 监听端口, 启动服务
server.listen(8080, () => {
console.log('服务已经启动, 端口 8080 监听中...');
});
描述 | 语法 |
---|---|
设置响应状态码 |
response.statusCode |
设置响应状态描述 |
response.statusMessage ( 用的非常少 ) |
设置响应响应头 信息 |
response.setHeader('key键名', '键值') |
设置响应体 |
response.write('xx') response.end('xxx') |
网页中的 URL
绝对路径
形式 | 举例 | 描述 |
---|---|---|
完整绝对路径 | https://www.baidu.com/web |
直接向目标资源发送请求,容易理解。网站的外链会用到此形式 |
次完整绝对路径 | //www.baidu.com/web |
与页面 URL 的协议 拼接形成完整 URL 再发送请求。大型网站用的比较多 |
常用绝对路径 |
/web |
与页面 URL 的协议、主机名、端口 拼接形成完整 URL 再发送请求。中小型网站 |
相对路径
相对路径在发送请求时,需要与当前页面 URL 路径进行
计算
,得到完整 URL 后,再发送请求,实际项目中使用较少,项目中大多数采用绝对路径
设置资源类型(mime类型 【Content-Type:)
描述
媒体类型(通常称为 Multipurpose Internet Mail Extensions 或 MIME 类型 )是一种标准,用来表示文档、文件或字节流的性质和格式。
HTTP 服务可以设置响应头
Content-Type
来表明响应体的 MIME 类型,浏览器会根据该类型决定如何处理资源
下面是常见文件对应的 mime 类型
资源类型 | 描述 |
---|---|
html | text/html |
css | text/css |
js | text/javascript |
png | image/png |
jpg | image/jpg |
gif | image/gif |
mp4 | video/mp4 |
mp3 | audio/mpeg |
json | application/json |
🚵♂️ 博主座右铭:向阳而生,我还在路上!
🚴博主想说:将持续性为社区输出自己的资源,同时也见证自己的进步!
🤼♂️ 如果都看到这了,博主希望留下你的足迹!【📂收藏!👍点赞!✍️评论!】