一、五层网络模型
-
1.物理层：主要作用是定义物理设备如何传输数据
-
2.数据链路层：在通信的实体间建立数据链路连接
-
3.网络层：为数据在结点之间传输创建逻辑链路
-
4.传输层：向用户提供可靠的端到端（End-to-End）服务，传输层向高层屏蔽了下层数据通信的细节
-
5.应用层：为应用软件提供了很多服务，构建于TCP协议之上，屏蔽网络传输相关细节
二、HTTP
- 1.三次握手
三、URI-URL和URN
- 1.URI：Uniform Resource Identifier/统一资源标识符，用来唯一标识互联网上的信息资源，包括URL和URN
- 2.URL：Uniform Resource Locator/统一资源定位器，
http://user:pass@host.com:80/path?query=string#hash此类格式的都叫做URL，比如ftp协议 - 3.URN：永久统一资源定位符，在资源移动之后还能被找到，目前还没有非常成熟的使用方案
四、HTTP报文
- 1.HTTP方法：用来定义对于资源的操作，常用有GET、POST等、从定义上讲有各自的语义
- 2.HTTP CODE：定义服务器对请求的处理结果，各个区间的CODE有各自的语义，好的HTTP服务可以通过CODE判断结果
五、创建一个简单的web服务
- 1.安装nodejs
- 2.创建文件夹，然后添加
server.js
const http = require('http');
http.createServer(function (request, response){
console.log('request com', request.url)
response.end('123');
}).listen(8888)
console.log('server listening on 8888');
六、跨域请求的限制与解决
- 1.说明：浏览器对请求返回的拦截
- 2.出现跨域的场景：
不同域名;主域名相同，子域名不同;域名和域名对应相同ip;同一域名，不同协议;同一域名，不同端口;同一域名，不同文件或路径;
- 3.解决方法：
jsonp、配置响应头
- 4.案例
test.html测试的html代码 发起跨域ajax请求
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
</body>
<!-- 使用jsonp，可以解决跨域 -->
<!-- <script src="http://127.0.0.1:8887/"></script> -->
<script>
var xhr = new XMLHttpRequest();
xhr.open('GET', 'http://127.0.0.1:8887/')
xhr.send()
</script>
</html>
server.js构建服务，使用test.html发起跨域请求
const http = require('http');
const fs = require('fs')
http.createServer(function (request, response){
console.log('request com', request.url)
const html = fs.readFileSync('test.html', 'utf8');
response.writeHead(200, {
'Content-Type': 'text/html'
})
response.end(html);
}).listen(8888)
console.log('server listening on 8888');
server2.js 接收服务器，解决跨域问题
const http = require('http');
http.createServer(function (request, response){
console.log('request com', request.url)
// 处理跨域
// response.writeHead(200, {
// 'Access-Control-Allow-Origin': '*' // 全部允许
// })
// 某个特定的域名
response.writeHead(200, {
'Access-Control-Allow-Origin': 'http://127.0.0.1:8888' // 全部允许
})
response.end('123');
}).listen(8887)
console.log('server listening on 8887');
七、CORS跨域限制预请求验证
-
1.允许方法
GET
HEAD
POST -
2.允许Content-Type
text/plain
multipart/form-data
application/x-www-form-urlencoded -
3.其他限制 请求头限制
XMLHttpRequestUpload对象均没有注册任何事件监听器
请求中没有使用ReadableStream对象 -
4.例
response.writeHead(200, {
'Access-Control-Allow-Origin': '*', // 全部允许
'Access-Control-Allow-Headers': 'X-Test-Cors',
'Access-Control-Allow-Methods': 'POST, PUT, DELETE',
'Access-Control-Max-Age': '1000'
})
八.缓存头Cache-Control
-
1.可缓存行
publichttp经过的任何地方都可以发起缓存
private发起请求的浏览器上才可以进行缓存
no-cache任何节点都不可以缓存 -
2.到期
max-age=<seconds>设置过期时间
s-maxage=<seconds>为代理服务器设置的读取过期时间
max-stale=<seconds>即便缓存过期，在这个设置时间内也可用过期的缓存 PS:浏览器一般用不到 -
3.重新验证【不太会用到】
must-revalidate在我们设置max-age过期之后，必须重新发起请求，重新获取
proxy-revalidate用在缓存服务器中 -
4.其他
no-cache每次发起请求都需要和服务器端进行验证，判断是否能使用本地的缓存 PS：本地可以存缓存
no-store本地和代理服务器都不可以使用缓存
no-transform告诉代理服务器不要改变返回内容
九、缓存验证Last-Modified和Etag
- 1.Last-Modified
上次修改时间
配合If-Modified-Since或者If-Unmodified-Since使用
对比上次修改时间以验证资源是否需要更新 - 2.Etag
数据签名 资源内容修改，签名就会不一样，然后重新获取资源
配合If-Match或者If-Non-Match使用
对比资源的签名判断是否使用缓存
十、Cookie&Session
- 1.Cookie
Cookie，简而言之就是在本地计算机保存一些用户操作的历史信息（当然包括登录信息），并在用户再次访问该站点时浏览器通过HTTP协议将本地cookie内容发送给服务器，从而完成验证或继续上一步操作。 通过Set-Cookie设置
下次请求会自动带上
键值对，可以设置多个
Cookie属性
max-age和expires设置过期时间 secure只在https的时候发送 设置HttpOnly无法通过document.cookie访问
- 2.session
session,简而言之就是在服务器上保存用户操作的历史信息。服务器使用session id来标识session，session id由服务器负责产生，保证随机性与唯一性，相当于一个随机密钥，避免在握手或传输中暴露用户真实密码。
