目录

  • 1、HTTP 协议
    • 1.1 概念
    • 1.2 请求报文的组成
    • 1.3 HTTP 的请求行
    • 1.4 HTTP 请求头
    • 1.5 HTTP 的请求体
    • 1.6 响应报文的组成
  • 2、创建 HTTP 服务
    • 2.1 操作步骤
    • 2.2 测试
    • 2.3 注意事项
  • 3、获取 HTTP 请求报文
    • 3.1 请求方法 request.method
    • 3.2 请求版本 request.httpVersion
    • 3.3 请求路径 request.url
    • 3.4 URL 路径 require('url').parse(request.url).pathname
    • 3.5 URL 查询字符串 require('url').parse(request.url, true).query
    • 3.6 实例化 URL 的对象
    • 3.7 请求版本 request.headers
    • 3.8 请求体
    • 3.9 小案例
  • 4、设置 HTTP 响应报文
    • 4.1 设置响应状态码 response.statusCode
    • 4.2 设置响应状态描述 response.statusMessage ( 用的非常少 )
    • 4.3 设置响应头信息 response.setHeader('头名', '头值')
    • 4.4 设置响应体response.write('xx')、response.end('xxx')
    • 4.5 小案例
  • 5、网页资源的基本加载过程
  • 6、静态资源服务
    • 6.1 什么是静态资源
    • 6.2 网站根目录或静态资源目录
    • 6.3 网页中的 URL
      • 6.3.1 绝对路径
      • 6.3.2 相对路径
      • 6.3.3网页中使用 URL 的场景小结
    • 6.4 设置资源类型(mime类型)
  • 7、GET 和 POST 请求
    • 7.1 场景小结
    • 7.2 GET和POST请求的区别
  • 参考

在介绍http模块之前先来了解一下什么是HTTP

1、HTTP 协议

1.1 概念

HTTP(hypertext transport protocol)协议;中文叫超文本传输协议
是一种基于TCP/IP的应用层通信协议
这个协议详细规定了 浏览器 和万维网 服务器之间互相通信的规则。
协议中主要规定了两个方面的内容

  • 客户端:用来向服务器发送数据,可以被称之为请求报文
  • 服务端:向客户端返回数据,可以被称之为响应报文

报文:可以简单理解为就是一堆字符串

1.2 请求报文的组成

  • 请求行
  • 请求头
  • 空行
  • 请求体

1.3 HTTP 的请求行

  • 请求方法(getpostputdelete等)
  • 请求 URL(统一资源定位器
    例如:http://www.baidu.com:80/index.html?a=100&b=200#logo

    • http: 协议(https、ftp、ssh等)
    • www.baidu.com 域名
    • 80 端口号
    • /index.html 路径
    • a=100&b=200 查询字符串
    • #logo 哈希(锚点链接)
    • HTTP协议版本号

1.4 HTTP 请求头

  • 格式:『头名:头值』
  • 常见的请求头有:

1.5 HTTP 的请求体

请求体内容的格式是非常灵活的,

  • (可以是空)==> GET请求,
  • (也可以是字符串,还可以是JSON)===> POST请求

例如:

  • 字符串:keywords=手机&price=2000
  • JSON:{“keywords”:“手机”,“price”:2000}

1.6 响应报文的组成

  • 响应行
HTTP/1.1 200 OK
  1. HTTP/1.1:HTTP协议版本号
  2. 200:响应状态码 404 Not Found 500 Internal Server Error
  3. 还有一些状态码,参考:https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Status
    OK:响应状态描述

响应状态码和响应字符串关系是一一对应的。

  • 响应头

Cache-Control: 缓存控制 private 私有的,只允许客户端缓存数据
Connection:链接设置
Content-Type:text/html;charset=utf-8 设置响应体的数据类型以及字符集,响应体为html,字符集utf-8
Content-Length:响应体的长度,单位为字节

  • 空行
  • 响应体
    • 响应体内容的类型是非常灵活的,常见的类型有 HTML、CSS、JS、图片、JSON

2、创建 HTTP 服务

2.1 操作步骤

//1. 导入 http 模块
const http = require('http')
//2. 创建服务对象 create 创建 server 服务
// request 意为请求. 是对请求报文的封装对象, 通过 request 对象可以获得请求报文的数据
// response 意为响应. 是对响应报文的封装对象, 通过 response 对象可以设置响应报文
const server = http.createServer((request, response) => {response.end('hello world')
})
//3. 监听端口, 启动服务
server.listen(9000,()=>{console.log('服务已经启动, 端口 9000 监听中...');
})

http.createServer 里的回调函数的执行时机: 当接收到HTTP 请求的时候,就会执行。

2.2 测试

  • 浏览器请求对应端口

    • http://127.0.0.1:9000

127.0.0.1是 回送地址 ,指本地机,一般用来测试使用。

浏览器返回结果

2.3 注意事项

  1. 命令行 ctrl + c 停止服务
  2. 当服务启动后,更新代码 必须重启服务才能生效
  3. 响应内容中文乱码的解决办法
 //设置响应头response.setHeader('content-type', 'text/html;charset=utf-8')
  1. 端口号被占用
Error: listen EADDRINUSE: address already in use :::9000
  1. 关闭当前正在运行监听端口的服务 ( 使用较多 )
  2. 修改其他端口号
  3. 在资源管理器中的侦听端口中找到9000端口,然后记下它的PID值;打开任务管理器,在详细信息中找到对应的PID值,右键结束任务

5.HTTP 协议默认端口是 80 。HTTPS 协议的默认端口是 443, HTTP 服务开发常用端口有 3000,8080,8090,9000 等

3、获取 HTTP 请求报文

想要获取请求的数据,需要通过 request 对象

3.1 请求方法 request.method

//1. 导入 http 模块
const http = require('http');
//2. 创建服务对象
const server = http.createServer((request, response) => {//获取请求的方法console.log(request.method);response.end('http'); //设置响应体
});//3. 监听端口, 启动服务
server.listen(9000, () => {console.log('服务已经启动....')
});

返回的结果:

3.2 请求版本 request.httpVersion

//1. 导入 http 模块
const http = require('http');
//2. 创建服务对象
const server = http.createServer((request, response) => {//获取 HTTP 协议的版本号console.log(request.httpVersion);response.end('http'); //设置响应体
});//3. 监听端口, 启动服务
server.listen(9000, () => {console.log('服务已经启动....')
});

返回结果:

3.3 请求路径 request.url

//1. 导入 http 模块
const http = require('http');
//2. 创建服务对象
const server = http.createServer((request, response) => {//获取请求的 urlconsole.log(request.url);// 只包含 url 中的路径与查询字符串response.end('http'); //设置响应体
});//3. 监听端口, 启动服务
server.listen(9000, () => {console.log('服务已经启动....')
});

返回的结果:

测试地址:
http://127.0.0.1:9000/search?name=hh&password=123

注意:

  • request.url 只能获取路径以及查询字符串,无法获取 URL 中的域名以及协议的内容

  • 关于路径:如果访问网站的时候,只填写了 IP 地址或者是域名信息,此时请求的路径为 /

  • 关于 favicon.ico:这个请求是属于浏览器自动发送的请求

3.4 URL 路径 require(‘url’).parse(request.url).pathname

//导入 http 模块
const http = require('http');
//1. 导入 url 模块
const url = require('url');//创建服务对象
const server = http.createServer((request, response) => {let res = url.parse(request.url);console.log(res.pathname);response.end('url');
});//监听端口, 启动服务
server.listen(9000, () => {console.log('服务已经启动....')
});


测试地址:
http://127.0.0.1:9000/search?name=hh&password=123

3.5 URL 查询字符串 require(‘url’).parse(request.url, true).query

我们先来看看url.parse(request.url)不加第二个参数true的结果

//导入 http 模块
const http = require('http');
//1. 导入 url 模块
const url = require('url');//创建服务对象
const server = http.createServer((request, response) => {let res = url.parse(request.url);console.log(res);response.end('url');
});
//监听端口, 启动服务
server.listen(9000, () => {console.log('服务已经启动....')
});

返回的结果:

  • query的值是一个字符串,这样对我们是不友好的。
  • 我们再来看看加上true的结果:
  let res = url.parse(request.url,true);console.log(res);

query的值变成了一个对象,这样我们就可以通过对象.的形式拿到里面对应的值了

  • 比如我们想拿到name的值,可以这样:
  console.log(res.query.name);

返回结果:

3.6 实例化 URL 的对象

  • 这种方法相对于之前的 parse(request.url)来说是优化的。
  • 我们先来看一下它返回的url是怎样的对象。
//导入 http 模块
const http = require('http');
//创建服务对象
const server = http.createServer((request, response) => {//实例化 URL 的对象let url = new URL(request.url, 'http://127.0.0.1');console.log(url);
});//监听端口, 启动服务
server.listen(9000, () => {console.log('服务已经启动....')
});

返回的结果:

URL {href: 'http://127.0.0.1/search?name=hh&password=123',origin: 'http://127.0.0.1',protocol: 'http:',username: '',password: '',host: '127.0.0.1',hostname: '127.0.0.1',port: '',pathname: '/search',search: '?name=hh&password=123',searchParams: URLSearchParams { 'name' => 'hh', 'password' => '123' },hash: ''
}
  • 相比 之前的方法多了一条 searchParams: URLSearchParams
  • 我们就可以通过这个对象来拿到我们的查询字符串路径的获取和之前是一样。
//导入 http 模块
const http = require('http');//创建服务对象
const server = http.createServer((request, response) => {//实例化 URL 的对象let url = new URL(request.url, 'http://127.0.0.1');console.log(url);
//输出路径console.log(url.pathname);//输出 keyword 查询字符串console.log(url.searchParams.get('name')); response.end('url new');
});//监听端口, 启动服务
server.listen(9000, () => {console.log('服务已经启动....')
});

返回结果:

3.7 请求版本 request.headers

//1. 导入 http 模块
const http = require('http');
//2. 创建服务对象
const server = http.createServer((request, response) => {//获取 HTTP 的请求头console.log(request.headers);response.end('http'); //设置响应体
});//3. 监听端口, 启动服务
server.listen(9000, () => {console.log('服务已经启动....')
});

返回的是一个对象

{host: '127.0.0.1:9000',connection: 'keep-alive','cache-control': 'max-age=0','sec-ch-ua': '"Google Chrome";v="107", "Chromium";v="107", "Not=A?Brand";v="24"','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/107.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.9','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'
}
{host: '127.0.0.1:9000',connection: 'keep-alive','sec-ch-ua': '"Google Chrome";v="107", "Chromium";v="107", "Not=A?Brand";v="24"','sec-ch-ua-mobile': '?0','user-agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/107.0.0.0 Safari/537.36', 'sec-ch-ua-platform': '"Windows"',accept: 'image/avif,image/webp,image/apng,image/svg+xml,image/*,*/*;q=0.8','sec-fetch-site': 'same-origin','sec-fetch-mode': 'no-cors','sec-fetch-dest': 'image',referer: 'http://127.0.0.1:9000/search?name=hh&password=123','accept-encoding': 'gzip, deflate, br','accept-language': 'zh-CN,zh;q=0.9'
}
  • 注意事项:
    request.headers 将请求信息转化成一个对象,并将属性名都转化成了小写

    既然返回的是一个对象,我们就可以通过对象.的形式获取其中的值。

  console.log(request.headers.host);

返回的结果:

3.8 请求体

  • request.on('data', function(chunk){})
  • request.on('end', function(){});
//1. 导入 http 模块
const http = require('http');
//2. 创建服务对象
const server = http.createServer((request, response) => {//1. 声明一个变量let body = '';//2. 绑定 data 事件request.on('data', chunk => {body += chunk;})//3. 绑定 end 事件request.on('end', () => {console.log(body);//响应response.end('Hello HTTP');});
});//3. 监听端口, 启动服务
server.listen(9000, () => {console.log('服务已经启动....')
});

返回结果:

由于我们默认是GET请求,所以请求体默认是空的,我们通过form表单设置为POST在请求一次。


3.9 小案例

  • 按照以下要求搭建 HTTP 服务

 //1. 导入 http 模块
const http = require('http');
//2. 创建服务对象
const server = http.createServer((request, response) => {//获取请求的方法let {method} = request;//获取请求的 url 路径let {pathname} = new URL(request.url, 'http://127.0.0.1');response.setHeader('content-type','text/html;charset=utf-8');//判断if(method === 'GET' && pathname === '/login'){//登录的情形response.end('登录页面');}else if(method === 'GET' && pathname === '/reg'){ // register 注册response.end('注册页面');}else{response.end('Not Found');}
});
//3. 监听端口 启动服务
server.listen(9000, () => {console.log('服务已经启动.. 端口 9000 监听中....');
})

案例效果图:

4、设置 HTTP 响应报文

4.1 设置响应状态码 response.statusCode

//导入 http 模块
const http = require('http');
//创建服务对象
const server = http.createServer((request, response) => {//1. 设置响应状态码response.statusCode = 203response.end('hh')
});
//监听端口, 启动服务
server.listen(9000, () => {console.log('服务已经启动....')
});

返回结果:

4.2 设置响应状态描述 response.statusMessage ( 用的非常少 )

//导入 http 模块
const http = require('http');
//创建服务对象
const server = http.createServer((request, response) => {//1. 设置响应状态码response.statusCode = 404;//2. 响应状态的描述 response.statusMessage = 'I love you'response.end('hh')
});
//监听端口, 启动服务
server.listen(9000, () => {console.log('服务已经启动....')
});

返回的结果:

4.3 设置响应头信息 response.setHeader(‘头名’, ‘头值’)

//导入 http 模块
const http = require('http');
//创建服务对象
const server = http.createServer((request, response) => {//1. 设置响应状态码// response.statusCode = 404;// //2. 响应状态的描述 // response.statusMessage = 'I love you'//3. 响应头response.setHeader('content-type', 'text/html;charset=utf-8')response.setHeader('Server','Node,js')response.end('哈哈')
});
//监听端口, 启动服务
server.listen(9000, () => {console.log('服务已经启动....')
});

返回的结果:

  • 注:有时候我们的头名有多个不同的头值,那我们该如何设置呢?

示例:

  response.setHeader('coke','one,tow,three')

这样子设置是不行的,我们必须通过数组的形式来完成。

  response.setHeader('coke',['one','tow','three'])

4.4 设置响应体response.write(‘xx’)、response.end(‘xxx’)

//导入 http 模块
const http = require('http');
//创建服务对象
const server = http.createServer((request, response) => {//1. 设置响应状态码// response.statusCode = 404;// //2. 响应状态的描述 // response.statusMessage = 'I love you'//3. 响应头// response.setHeader('content-type', 'text/html;charset=utf-8')// response.setHeader('Server','Node,js')// response.setHeader('coke',['one','tow','three'])//4. 响应体的设置response.write('I')response.write('love')response.write('you')response.end('hh')
});//监听端口, 启动服务
server.listen(9000, () => {console.log('服务已经启动....')
});

返回结果:

  • 注意:
write 和 end 的两种使用情况:
//1. write 和 end 的结合使用 响应体相对分散
response.write('xx');
response.write('xx');
response.write('xx');
response.end(); //每一个请求,在处理的时候必须要执行 end 方法的
//2. 单独使用 end 方法 响应体相对集中
response.end('xxx');

4.5 小案例

  • 搭建 HTTP 服务,响应一个 4 行 3 列的表格,并且要求表格有 隔行换色效果 ,且 点击 单元格能 高亮显示。
const http = require('http');
//创建服务对象
const server = http.createServer((request, response) => {response.end(`<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>table {border-collapse: collapse;}table td {padding: 20px 60px;}table tr:nth-child(odd) {background-color: rgb(73, 31, 177);}table tr:nth-child(even) {background-color: pink;}.active {background-color: black;}</style>
</head><body><table border="1"><tr><td></td><td></td><td></td></tr><tr><td></td><td></td><td></td></tr><tr><td></td><td></td><td></td></tr><tr><td></td><td></td><td></td></tr></table><script>document.querySelectorAll('td').forEach(item => {item.addEventListener('click', function () {let od = document.querySelector('table .active')if (od) {od.classList.remove('active')}this.classList.add('active')})})</script>
</body></html>`)//设置响应体
});//监听端口, 启动服务
server.listen(9000, () => {console.log('服务已经启动....')
});

显示效果:

  • 大家应该也发现了,响应体的内容太多,而且这样写没有代码高亮和提示,对我们来说是不友好的。

解决方法:
将响应体内容放在一个HTML文件中,通过fs模块来对此文件进行读取。

const http = require('http');
const fs = require('fs');
//创建服务对象
const server = http.createServer((request, response) => {// 读取文件内容let html = fs.readFileSync(__dirname + '/table1.html')response.end(html)//设置响应体
});//监听端口, 启动服务
server.listen(9000, () => {console.log('服务已经启动....')
});
  • 如果我们将css和js各种单独放在一个文件当中,我们这样写是有问题的。

显示效果:

没有css样式js行为,为什么会这样呢?
我们先来看看浏览器响应体返回的结果是什么


  • css和js文件返回的依旧是HTML文件
  • 在服务器返回响应给我们的时候会执行下面这个回调函数,而回调函数里面只返回了一个html,所以会导致这样的结果发生。
const server = http.createServer((request, response) => {// 读取文件内容let html = fs.readFileSync(__dirname + '/table1.html')response.end(html)//设置响应体
});
  • 我们该如何解决?

    • 我们只需要给每一个路径进行判断,如果是这个文件,就返回该文件的内容。
// 导入模块
const http = require('http')
const fs = require('fs')
const server = http.createServer((request, response) => {// 获取路径let { pathname } = new URL(request.url, 'http://127.0.0.1')if (pathname === '/') {let html = fs.readFileSync(__dirname + '/index.html')response.end(html)} 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 = 404response.end('404,NOT FOUND')}
})server.listen(9000, () => {console.log('服务已启动');
})

显示效果:

  • 说到这其实又引申出另外一个问题,如果我们有很多个文件,那我们岂不是要对每个文件进行判断,这样是很麻烦的。
  • 所以我们又想到了另外一种解决办法。
  • 通过搭建静态服务资源来解决这个问题
  • 目录结构:
const http = require('http')
const fs = require('fs')
const path = require('path')
// 创建服务对象
const server = http.createServer((request, response) => {//获取请求url的路径let { pathname } = new URL(request.url, 'http://127.0.0.1')//声明一个变量let root = __dirname + '/page'//拼接文件路径let filePath = path.resolve(root + pathname)//读取文件 fs 异步 APIfs.readFile(filePath, (err, data) => {if (err) {response.statusCode = 500response.end('文件读取失败···')return}response.end(data)})
})
server.listen(9000, () => {console.log('服务已启动');
})

5、网页资源的基本加载过程

  • 网页资源的加载都是循序渐进的,首先获取 HTML 的内容, 然后解析 HTML 在发送其他资源的请求,如 CSS,Javascript,图片等。

6、静态资源服务

6.1 什么是静态资源

  • 静态资源是指 内容长时间不发生改变的资源 ,例如图片,视频,CSS 文件,JS文件,HTML文件,字体文件等
  • 动态资源是指 内容经常更新的资源 ,例如百度首页,网易首页,京东搜索列表页面等

6.2 网站根目录或静态资源目录

  • HTTP 服务在哪个文件夹中寻找静态资源,那个文件夹就是 静态资源目录 ,也称之为 网站根目录

思考:vscode 中使用 live-server 访问 HTML 时, 它启动的服务中网站根目录是谁?

  • 答案:以打开的文件夹作为网站根目录

6.3 网页中的 URL

  • 网页中的 URL 主要分为两大类:相对路径绝对路径

6.3.1 绝对路径

  • 绝对路径可靠性强,而且相对容易理解,在项目中运用较多
  • 我们最常用的是第三种
  • 如果将来我们要改变域名ip,用前两种方法会比较麻烦,一但改变,里面的链接路径全部要更改。
  • 第三种方法则随便你域名ip更改我都不受影响

6.3.2 相对路径

  • 相对路径在发送请求时,需要与当前页面 URL 路径进行 计算 ,得到完整 URL 后,再发送请求,学习阶 段用的较多。
  • 例如当前网页 url 为 http://www.atguigu.com/course/h5.html

在实际工作当中我们都是使用绝对路径,因为相对路径不可靠,体现在于页面url的路径相关,它是参照页面url的,当页面url不正常的时候,我们使用相对路径去获取资源就会异常

6.3.3网页中使用 URL 的场景小结

  • 包括但不限于如下场景:

    • a 标签 href
    • link 标签 href
    • script 标签 src
    • img 标签 src
    • video audio 标签 src
    • form 中的 action
    • AJAX 请求中的 URL

6.4 设置资源类型(mime类型)

  • 媒体类型( 通常称为 Multipurpose Internet Mail Extensions 或 MIME 类型 )是一种标准,用来表示文档文件字节流的性质和格式。

mime 类型结构: [type]/[subType]
例如: text/html text/css image/jpeg image/png application/json

  • HTTP 服务可以设置响应头 Content-Type 来表明响应体的 MIME 类型,浏览器会根据该类型决定如何处理资源
  • 下面是常见文件对应的 mime 类型
html: 'text/html',
css: 'text/css',
js: 'text/javascript',
png: 'image/png',
jpg: 'image/jpeg',
gif: 'image/gif',
mp4: 'video/mp4',
mp3: 'audio/mpeg',
json: 'application/json'

对于未知的资源类型,可以选择application/octet-stream 类型,浏览器在遇到该类型的响应时,会对响应体内容进行独立存储,也就是我们常见的 下载 效果

我们来对之前的代码进行改进一下:

//导入 http 模块
const http = require('http');
const fs = require('fs');
const path = require('path');
//声明一个变量
let mimes = {html: 'text/html',css: 'text/css',js: 'text/javascript',png: 'image/png',jpg: 'image/jpeg',gif: 'image/gif',mp4: 'video/mp4',mp3: 'audio/mpeg',json: 'application/json'
}//创建服务对象
const server = http.createServer((request, response) => {if(request.method !== 'GET'){response.statusCode = 405;response.end('<h1>405 Method Not Allowed</h1>');return;}//获取请求url的路径let {pathname} = new URL(request.url, 'http://127.0.0.1');//声明一个变量let root = __dirname + '/page';// let root = __dirname + '/../';//拼接文件路径let filePath = root + pathname;//读取文件 fs 异步 APIfs.readFile(filePath, (err, data) => {if(err){console.log(err);//设置字符集response.setHeader('content-type','text/html;charset=utf-8');//判断错误的代号switch(err.code){case 'ENOENT':response.statusCode = 404;response.end('<h1>404 Not Found</h1>');case 'EPERM':response.statusCode = 403;response.end('<h1>403 Forbidden</h1>');default:response.statusCode = 500;response.end('<h1>Internal Server Error</h1>');}return;}//获取文件的后缀名let ext = path.extname(filePath).slice(1);//获取对应的类型let type = mimes[ext];if(type){//匹配到了                          text/html;charset=utf-8if(ext === 'html'){response.setHeader('content-type', type + ';charset=utf-8');}else{response.setHeader('content-type', type);}}else{//没有匹配到response.setHeader('content-type', 'application/octet-stream');}//响应文件内容response.end(data);})});//监听端口, 启动服务
server.listen(9000, () => {console.log('服务已经启动....')
});

注:
1.响应头里面的字符集权重比HTML页面中meta标签字符集权重要高。
2.当css、js、img等资源进入到网页当中去,会根据网页的字符集进行处理,所以没必要给它们设置字符集。

7、GET 和 POST 请求

7.1 场景小结

  • GET 请求的情况:

    • 在地址栏直接输入 url 访问

    • 点击 a 链接

    • link 标签引入 css

    • script 标签引入 js

    • img 标签引入图片

    • form 标签中的 method 为 get (不区分大小写)

    • ajax 中的 get 请求

  • POST 请求的情况:
    • form 标签中的 method 为 post(不区分大小写)
    • AJAX 的 post 请求

7.2 GET和POST请求的区别

  • GETPOST 是 HTTP 协议请求的两种方式。

    • GET 主要用来获取数据,POST 主要用来提交数据
    • GET 带参数请求是将参数缀到 URL 之后,在地址栏中输入 url 访问网站就是 GET 请求, POST带参数请求是将参数放到请求体中
    • POST 请求相对 GET 安全一些,因为在浏览器中参数会暴露`在地址栏
    • GET 请求大小有限制,一般为 2K,而 POST 请求则没有大小限制

参考

尚硅谷2023版Node.js零基础视频教程,nodejs新手到高手

05-Node.js—http模块相关推荐

  1. node.js中模块_在Node.js中需要模块:您需要知道的一切

    node.js中模块 by Samer Buna 通过Samer Buna 在Node.js中需要模块:您需要知道的一切 (Requiring modules in Node.js: Everythi ...

  2. Node.js中模块加载机制

    Node.js中模块加载机制 模块查找规则-当模块拥有路径但没有后缀时 1. require方法根据模块路径查找模块,如果是完整路径,直接引入模块. 2. 如果模块后缀省略,先找同名JS文件再找同名J ...

  3. Node.js Web 模块

    Node.js Web 模块 什么是 Web 服务器? Web服务器一般指网站服务器,是指驻留于因特网上某种类型计算机的程序,Web服务器的基本功能就是提供Web信息浏览服务.它只需支持HTTP协议. ...

  4. Node.js Domain 模块

    Node.js 工具模块 Node.js Domain(域) 简化异步代码的异常处理,可以捕捉处理try catch无法捕捉的异常.引入 Domain 模块 语法格式如下: var domain = ...

  5. Node.js DNS 模块

    Node.js 工具模块 Node.js DNS 模块用于解析域名.引入 DNS 模块语法格式如下: var dns = require("dns") 方法 序号 方法 & ...

  6. Node.js Net 模块

    Node.js 工具模块 Node.js Net 模块提供了一些用于底层的网络通信的小工具,包含了创建服务器/客户端的方法,我们可以通过以下方式引入该模块: var net = require(&qu ...

  7. Node.js Path 模块

    Node.js 工具模块 Node.js path 模块提供了一些用于处理文件路径的小工具,我们可以通过以下方式引入该模块: var path = require("path") ...

  8. Node.js 工具模块

    在 Node.js 模块库中有很多好用的模块.接下来我们为大家介绍几种常用模块的使用: 序号 模块名 & 描述 1 OS 模块 提供基本的系统操作函数. 2 Path 模块 提供了处理和转换文 ...

  9. Node.js OS 模块

    Node.js 工具模块 Node.js os 模块提供了一些基本的系统操作函数.我们可以通过以下方式引入该模块: var os = require("os") 方法 序号 方法 ...

  10. Node.js:模块查找,引用及缓存机制

    1. Node.js的模块载入方式与机制 Node.js中模块可以通过文件路径或名字获取模块的引用.模块的引用会映射到一个js文件路径,除非它是一个Node内置模块.Node的内置模块公开了一些常用的 ...

最新文章

  1. html整体垂直居中,htmlcss垂直水平居中
  2. oracle11g +WindoWs7 安装错误:未找到文件WFMLRSVCApp.ear
  3. 2017.8.17 开始了我的QT 学习。
  4. 用来处理python字典的方法_python字典的常用方法总结
  5. c++ 使用socket实现C/S端文件的下载传输
  6. 协作机器人 ai算法_如果我们希望人工智能为我们服务而不是不利于我们,我们需要协作设计...
  7. 357. Count Numbers with Unique Digits
  8. REVERSE-PRACTICE-CthulhuOJ
  9. Nginx学习之十-超时管理(定时器事件)
  10. 荣耀Magic3相机界面公布:提供专业“电影”功能
  11. 打开word时总是弹出The resource dll can not be loaded
  12. mongodb 如何更改端口号_Centos7配置MongoDB以及端口修改
  13. C# 尝试还原程序包时出错:找不到“XXXXX”版本的程序包“XXXXXX”
  14. android框架揭秘!Android开发你需要了解的那些事,附大厂真题面经
  15. Error:Execution failed for task ':app:mergeDebugResources'. Crunching Cruncher bg_btn.9.png
  16. 秋招之前实习面经汇总
  17. linux 词霸,Ubuntu下使用原版金山词霸
  18. 线上故障之-CPU飙高
  19. 【认知计算】Deepfake/Anti-deepfake综述探究
  20. Android判断网络状态是否断开

热门文章

  1. 大规模线性方程组求解
  2. Google hacking能做什么以及对应的语法
  3. PHP前一页 后一页 切换
  4. 【JAVA】easyexcel 导出excel文件带多个图片
  5. 安装 window10 系统
  6. 机械臂规划----三次样条曲线
  7. iOS 自定义转场动画篇
  8. themeleaf基本语法
  9. HDLBITS笔记五加法器减法器
  10. 计算机 发声原理,终于懂得麦克风的发声原理是什么