OSI七层交换“参考模型”
物理层 物理学家、通行工程关心的,考虑材料,电压等问题
链路层 内网寻址 ARP
网络层 外网寻址 IP/ICMP
传输层 维持通信稳定性 TCP
表示层 统一各个网络结构
会话层 记录状态
应用层 应用细节 http、FTP、SMTP
五层模型
物理层 物理学家、通行工程关心的,考虑材料,电压等问题
链路层 内网寻址 ARP
网络层 外网寻址 IP/ICMP
传输层 维持通信稳定性 TCP
应用层 应用细节 http、FTP、SMTP
TCP和UDP
TCP---传输控制协议 适用于文件下载和聊天
1.保证到达 2.保证质量 3.保证顺序
UDP---用户数据报协议,对质量没有绝对要求,对延迟有很高要求 适用于IP电话和视频直播
1.不保证到达 2.不保证质量 3.不保证顺序
TCP与UDP基本区别:
1、基于连接与无连接。
2、TCP要求系统资源较多,UDP较少。
3、UDP程序结构较简单。
4、流模式(TCP)与数据报模式(UDP)。
5、TCP保证数据正确性,UDP可能丢包。
6、TCP保证数据顺序,UDP不保证。
7、TCP面向连接(如打电话要先拨号建立连接);UDP是无连接的,即发送数据之前不需要建立连接。
8、TCP提供可靠的服务。也就是说,通过TCP连接传送的数据,无差错,不丢失,不重复,且按序到达;UDP尽最大努力交付,即不保证可靠交付。
9、TCP面向字节流,实际上是TCP把数据看成一连串无结构的字节流;UDP是面向报文的,UDP没有拥塞控制,因此网络出现拥塞不会使源主机的发送速率降低(对实时应用很有用,如IP电话,实时视频会议等)。
10、每一条TCP连接只能是点到点的;UDP支持一对一,一对多,多对一和多对多的交互通信。
11、TCP首部开销20字节;UDP的首部开销小,只有8个字节。
12、TCP的逻辑通信信道是全双工的可靠信道,UDP则是不可靠信道。
表单
1.属性
action 表示提交到哪
methods 方法,分为GET、POST、DELETE、HEDEER
name 必须加,可以重复
submit 提交按钮
2.数据提交
get 数据放在url里
特点: 1.容量有限 2.看得见数据(表单提交) 3.有缓存 4.利于分享和收藏
post 数据放在http-body里
特点: 1.容量有限 2.看不见数据 3.无缓存 4.没法分享和收藏
get和post安全性一样,HTTPS 才是真的安全
ajax与表单提交
ajax用户体验好(js实现),表单提交性能更稳定(浏览器来实现)
表单重复提交优化
开始提交----禁用submit
提交完成---启用submit
同步----串行 一个一个来,前面没完,后面等着
异步----并行 一堆一块进行,前面没完成没关系,后面的也接着上,前面的处理完了返回给它就好了
readyState
0 初始化--刚刚创建
1 已连接
2 已发送
3 已接收---头
4 已接收---body
http状态码:
1xx 消息
2xx 成功
3xx 重定向
301(永久重定向---浏览器永不会再次请求老地址)
302(临时重定向---浏览器下次还会请求老地址)
304(缓存)
4xx 请求错误(客户端)
5xx 服务端错误
xhr.responseText 文本
xhr.responseXML XML数据
ajax原生实现:
1)创建XMLHttpRequest对象,也就是创建一个异步调用对象
(2)创建一个新的HTTP请求,并指定该HTTP请求的方法、URL及验证信息
(3)设置响应HTTP请求状态变化的函数
(4)发送HTTP请求
(5)获取异步调用返回的数据
表单
简化代码:
function ajax(options) {
options = options || {};
options.type = options.type || 'get';
options.data = options.data || {};
options.dataType = options.dataType || 'text';
let xhr = new XMLHttpRequest();
//数据组装
let arr = [];
for (let name in options.data) {
arr.push(`${name}=${options.data[name]}`)
}
let strData = arr.join('&');
if (options.type == 'post') {
xhr.open('POST', options.url, true)
xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded')
xhr.send(strData);
} else {
xhr.open('GET', options.url + '?' + strData, true)
xhr.send();
}
// 接收
xhr.onreadystatechange = function() {
if (xhr.readyState == 4) {
if (xhr.status >= 200 && xhr.status < 300 || xhr.status == 304) {
let data = xhr.responseText;
switch (options.dataType) {
case 'json':
if (window.JSON && JSON.parse) {
data = JSON.parse(data);
} else {
data = eval('(' + str + ')');
}
break;
case 'xml':
data = xhr.responseXML;
break;
}
options.success && options.success(data)
} else {
options.error && options.error(data)
}
}
}
}
// 使用
ajax({
url: '1.php',
data: {
a: 1,
b: 2
},
dataType: 'json',
success(data) {
console.log(data)
},
error() {
console.log('出错')
}
})
重定向 给浏览器下命令,让浏览器去请求另一个地址---地址变化
转发 在服务器内部,把请求转交给另一个模块处理;对客户端不可见---地址不变
单点登录:单点登录原理与简单实现
content-type有哪些类型,各是什么意思?
text/plain 纯文本
application/x-www-form-urlencoded 数据编码格式为(名字=值&名字=值&名字=值),名字和值都进行了URL转码)
multipart/form-data 定界符分隔各个数据(文件上传)
jsonp
安全性问题在于过于开放