HTTP学习
1.概念
1.客户端与服务器超本文无状态传输协议
2.http默认端口80
3.https 默认端口 443
2.请求方法
1.options：测试有哪些方法可以用
2.get：获取服务信息
3.Post： 修改与更新，新增服务器信息
4.put：新增
5.delete：删除
6.head 只返回头信息
7.trace：回显头信息，用来测试
8.connect： 管道形式连接
3.请求过程
建立tcp连接 客户端发送请求头+请求体 服务器响应请求头+请求体 ，关闭tcp连接 客户端渲染内容
1.客户端发起 http请求 建立tcp连接
2. 客服端（浏览器）发送请求信息（状态行 请求头 空行 请求体）
3. 服务的响应请求信息（状态行 响应头 空行 响应体）
4. 客服关闭tcp网络连接
5. 客户端（浏览器）渲染内容
4常见的http响应码
1.
100：这个状态码是告诉客户端应该继续发送请求，这个临时响应是用来通知客户端的，部分的请求服务器已经接受，但是客户端应继续发送求请求的剩余部分，如果请求已经完成，就忽略这个响应，而且服务器会在请求完成后向客户发送一个最终的结果
2.
200：这个是最常见的http状态码，表示服务器已经成功接受请求，并将返回客户端所请求的最终结果
202：表示服务器已经接受了请求，但是还没有处理，而且这个请求最终会不会处理还不确定
204：服务器成功处理了请求，但没有返回任何实体内容 ，可能会返回新的头部元信息
301：客户端请求的网页已经永久移动到新的位置，当链接发生变化时，返回301代码告诉客户端链接的变化，客户端保存新的链接，并向新的链接发出请求，已返回请求结果
404：请求失败，客户端请求的资源没有找到或者是不存在
500：服务器遇到未知的错误，导致无法完成客户端当前的请求。
503：服务器由于临时的服务器过载或者是维护，无法解决当前的请求，以上http状态码是服务器经常返回的状态代码，用户只能通过浏览器的状态了解服务器是否正常运行，一般除了错误的状态码，都不会看到服务器的状态码的，新SEOer你们了解到了吗？内容编辑来自51特色购SEO优化人员，想了解更过状态码的知识可以加我好友，一起相互交流学习
5.同步异步
概念理解:
**“同步”**就好比：你去外地上学(人生地不熟)，突然生活费不够了；此时你决定打电话回家，通知家里转生活费过来，可是当你拨出电话时，对方一直处于待接听状态(即：打不通，联系不上)，为了拿到生活费，你就不停的oncall、等待，最终可能不能及时要到生活费，导致你今天要做的事都没有完成，而白白花掉了时间。打不通电话，阻塞了。
异步就是：在你打完电话发现没人接听时，猜想：对方可能在忙，暂时无法接听电话，所以你发了一条短信(或者语音留言，亦或是其他的方式)通知对方后便忙其他要紧的事了；这时你就不需要持续不断的拨打电话，还可以做其他事情；待一定时间后，对方看到你的留言便回复响应你，当然对方可能转钱也可能不转钱。但是整个一天下来，你还做了很多事情（非阻塞）。 或者说你找室友临时借了一笔钱，又开始happy的上学时光了。
阻塞和非阻塞强调的是程序在等待调用结果（消息，返回值）时的状态
同步和异步强调的是消息通信机制
6.原生get 原生post
Get方式:
用get方式可传送简单数据，但大小一般限制在1KB下，数据追加到url中发送（http的header传送），也就是说，浏览器将各个表单字段元素及其数据按照URL参数的格式附加在请求行中的资源路径后面。另外最重要的一点是，它会被客户端的浏览器缓存起来，那么，别人就可以从浏览器的历史记录中，读取到此客户的数据，比如帐号和密码等。因此，在某些情况下，get方法会带来严重的安全性问题。
Post方式:
当使用POST方式时，浏览器把各表单字段元素及其数据作为HTTP消息的实体内容发送给Web服务器，而不是作为URL地址的参数进行传递，使用POST方式传递的数据量要比使用GET方式传送的数据量大的多。
总之，GET方式传送数据量小，处理效率高，安全性低，会被缓存，而POST方式传送数据量大，处理效率没有get方式高，数据不会被缓存，对于账号和密码等，比较安全。
7.地址url的组成
// 地址分享
// https://www.520mg.com/ajax/echo.php?name=mumu&age=18#top
// protocol: “http:” 协议
// host: “www.520mg.com” 域名
// pathname: “/ajax/echo.php” 地址
// port: 80 /443端口号
// search: “?name=mumu&age=18” 查询条件
// hash: “#top” 哈希值
8.浏览器的同源策略
// 当从本地网页 获取服务器资源(ajax) 要求被请求的地址 与当前地址要保持同源
// 协议一致 file http https
// 域名一致 520mg.com baidu.com
// 子域名一致 music.qq.com game.qq.com不同的子域名
// 端口号一致 127.0.0.1:8080 127.0.0.1:8888 不同端口号,
// http://127.0.0.1:8088/ajax/demo3-ajax-post.html
// "http://localhost/echo.php
域名不一致端口号不一致
9.理解跨域，跨域的方法
// 跨过浏览器的同源策略（跨域名）请求数据：在实际的工作的经常需要的功能
// 01 后端响应头cos跨域
Access-Control-Allow-Origin *
// php：header(“Access-Control-Allow-Origin: *”);
// 02 jsonp跨域
// 03 （开发阶段）代理跨域
ajax
1.名称：异步的javascript and xml
2.原理
1.通过 XMLHttpRequest 与服务器交换数据
2.服务数据通过json 或者 xml格式返回
3.浏览器端通过js+ccs渲染展示数据
3.Post
1.新建ajax对象
var xhr = new XMLHttpRequst()
2. 打开连接
xhr.open(“POST”,url,fasle)
3. 设置头信息(get省略)
xhr.setRequestHeader(‘Content-Type’,‘application/x-www-form-urlencoded’);
4. 监听事件
xhr.onreadystatechange = function(){
if(xhr.readyState4&&xhr.status200){}
}
返回的数据 xhr.responseText
5.发送
xhr.send(“name=mumu&age=18”)
3.script 标签的src属性没有同源策略限制
// 浏览器的同源策略
// 当浏览器向服务器请求数据（ajax）需要被请求的地址与当前的网址同源
// 同源：协议一致http 子域名一致 pan.baidu new.baidu 域名一致 qq.com 端口号一致:8081
// https://wis.qq.com/weather/common?weather_type=observe|forecast_24h|air&source=pc&province=%E6%B2%B3%E5%8D%97&city=%E9%83%91%E5%B7%9E%E5%B8%82&callback=__jp1
// script 标签的src属性没有同源策略限制
// 已经后后端约定好 返回的数据格式是 方法名(数据) jp({data…}) 执行函数并传参
jquery中ajax
1.第一层 $.ajax()
2.第二层
$.get
1.回调函数
$.get(url,function(data,status,xhr){})
2. .done()
.fail()
.always()
3. .then()
.catch()
$.post(url,data,function(data,status,xhr))
1
3.第三层
$.getJSON()
$.getScript()
load()
url组成
1.https:www.520mg.com:443/ajax/echo.php?name=mumu&age=18#cate
2.https 协议
3.www子域名
4.520mg.com 域名
5.:443 端口号
6./ajax/echo.php 路径
7.?name=mumu&age=18 查询条件
8.#cate 哈希值
浏览器同源策略
1.当浏览器去访问服务器资源（ajax） 要求服务器的地址与浏览器同源
2.协议，域名，子域名，端口号要一致
跨域
1.绕过浏览器的同源策略，请求到数据
2.跨域方式
1. 服务器响应头信息跨域
Access-Control-Allow-Origin: *
2. jsonp跨域
3. 服务器代理（开发）
异步，同步
同步胡阻塞代码执行
http响应码
1xxx
开始
2xx
成功
3xx
重定向
4xxx
客户端请求地址错误
5xx
服务器错误
案例解析 要多读背敲，
案例一
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>同步</title>
</head>
<body>
<script>
// console.log(100);
// alert(200);
// console.log(300);
console.log(100);
setTimeout(()=>{
console.log(200);
},2000)
console.log(300);
</script>
</body>
</html>
扫一扫
1131
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
