标签：中文 网站 应用 open uri 语言 使用 失败 有一种
一. AJAX配置
打开一个URL请求地址(发送请求前的一些配置)
监听AJAX状态的改变,实现不同的业务操作
xhr.readystate:AJAX状态
xhr.status:HTTP状态码
通过状态码可以知道当前HTTP事物是否成功,以及失败的原因
[2开头]:代表成功
200:ok
[3开头]:也代表成功,但是这个成功经历了一些特殊处理
[4开头]:代表错误,而且一般都是客户端的错误
[5开头]:代表错误,而且一般都是服务器端错误
500:Internal Server Error,服务器的未知错误
503:service Unavailable,服务器超负荷
操作
xhr.setRequsetHeader([key],[value]):设置请求头信息
设置请求头之前必须保证已经执行open了
设置请求头的内容不能是中文(除非进行编码)
二.AJAX请求发送
AJAX请求这件事从执行send后才开始(之前都是在做准备),当readystate=4的时候这件事结束
xhr.send(null):send方法中写的内容就是客户端通过请求主体传递给服务器的内容,不想通过请求主体传递内容我们写null
三. js编码和解码
如果就是想通过请求头给服务器传递中文汉字,我们需要先把传递的内容进行编码,由服务器进行编码
escape/unescape:这种方式经常应用于客户端对中文汉字和特殊字符进行编码的(一般不常用,因为服务器端语言,除了NODE其他的貌似不支持这个方法)
encodeURI/decodeURI:按照UNICODE编码解码
encodeURIComponent/decodeURIComponent:相对于上面的方法来说可以把特殊字符也进行编码,而encodeURI只能编码中文汉字
服务器端接受的时候再进行解码decodeURIComponent
四. 加密
加密不是简单的编码解码,而是按照规则进行加密解密(项目中的重要信息我们一般都要进行加密的)
[可逆转的加密]
重要的信息加密后还可以再解密回来,例如:电话号码或者银行卡号进行加密
一般公司都是自己写加密和解密规则
[不可逆转的加密]
五.GET/POST系列请求
不管哪种HTTP请求方式,客户端都可以把信息传递给服务器,服务器也可以把内容返回给客户端
GET系列
POST系列
POST:推送,给服务器的多,从服务器拿的少
PUT:放,在服务器上放入一些资源文件
GET系列和POST系列存在一些主要的区别
GET请求传递给服务器内容通过的是"问号传参",POST系列传递给服务器内容通过的是"请求主体"
每个浏览器对于URL的长度都是一个最大限制(谷歌8kb/火狐7kb/IE2kb),如果POST请求也用问号传参,很有可能导致URL的长度超出限制(POST传递的内容多),超出的部分会被浏览器自动截取掉,导致信息不完整,所以POST应该使用请求主体,GET可以使用问号传参(GET传递的少);请求主体传递的内容大小理论上没有限制,真实项目中为了保证上传的速度,我们一般自己会限制其大小(例如:上传文件要求限制在100KB以内)
[GET]
xhr.open("GET","/userInfo?name=zxt&age=27&sex=1");
xhr.send(null);
[POST]
xhr.open("POST","/userInfo");
xhr.send("name=zxt&age=27&sex=1");
GET系列请求会出现不可控制的缓存,而POST请求不会
原因是因为GET是通过问号传参的方式传递给服务器的,如果我发送两次请求,地址和传递的参数都一摸一样,会触发浏览器的记忆识别功能,它认为你第二次请求的数据和第一次一样,所以会把缓存中的数据返回;有些需求这样不好,例如随时获取股票信息等需求此时我们需要清除GET请求的缓存;
[清除缓存只需要在每一次请求的地址后面加一个随机数,保证每一次请求的地址不完全一致即可;属性名使用_是为了不和其他有意义的属性名冲突(行业规范)]
xhr.open("GET","/userInfo?_="+Math.random());
xhr.send(null);
GET系列请求相对于POST请求来说不安全,在互联网面前没有绝对的安全,我们平时上网都是在裸奔
原因:GET传递个服务器的内容都在URL上(问号传参),有一种比较简单的黑客技术"URL劫持",别人可以通过劫持URL把我们传递给服务器的数据捕获到
以后只要给服务器传递的是重要的信息,不管内容多少都应该使用POST
六. 获取服务器时间
我们获取的服务器时间和当前真实的时间,出现一些差距"时间差",我们获取的时候是服务器返回数据的时间,客户端接收到数据也需要一点时间,所以当客户端接收到这个值的时候,已经距离真实的时间差了一点
减少时间差
七. jQ中的AJAX
$.ajax("note.txt",{
method:"get",
dataType:"txt",
async:true,
cache:false,
data:{
name:"zxt",
age:"[27,28]"
}
success:function(){},
error:function(){},
complete:function(){}
})
data
所有需要传递给服务器的内容都放在DATA中,GET系列采用问号传参,POST系列采用请求主体;DATA中的字符串内容是什么我们传递的就是什么
还可以是个对象,POST系列会把这个对象直接放在请求主体中处理,DATA中是什么放入的就是什么;GET系列会把它拆分XXX=XXX这种形式,放在URL的末尾以问号传参传递给服务器,值得注意的是,对于汉字和特殊字符,我们需要把内容进行编码
complete:不管成功还是失败,只要完成就会执行这个
八. 模拟jQ中AJAX
思想
传入为一个对象,避免顺序问题导致参数混乱
对传入的参数进行默认操作
使用method进行默认,不使用Type
将传入的对象将默认值进行覆盖,没传递的走默认值,传递的走自己需要的值
将Type和method进行统一,最后使用method
发送AJAX请求
对XMLHttpRequest进行兼容处理
在onreadystatechange事件中,分情况进行讨论
请求失败
请求成功
对readystate的情况进行讨论
获取响应主体内容(一般是字符串),根据dataType值来处理响应主体内容,处理失败,结果为空,避免报错
讨论对应的回调函数并传入响应主体执行函数
回调函数中的this为xhr对象
根据method对data参数进行处理,并传入send()中
根据dataType和cache的值来进行缓存清除操作
验证url是否?是否存在,来对url进行随机数的添加
AJAX相关知识总结
相关文章
精彩导读
热门资讯
关注我们
